html5页面无法直连支付，必须经https服务端生成签名参数并中转：微信h5用mweb模式返回h5_url跳转，支付宝用alipay.trade.page.pay提交表单；所有验签、回调处理、状态确认均须服务端完成。
HTML5 页面本身不能直接接入支付，必须走服务端中转
纯静态 index.html 文件里写再多 fetch 或 XMLHttpRequest，也拿不到支付网关的合法响应——微信/支付宝等平台明确要求：prepay_id、sign、timestamp 等关键参数必须由你自己的服务器生成并签名，且域名需在商户后台白名单中备案。浏览器前端直连支付接口会触发 403 Forbidden 或 INVALID_REQUEST 错误。
- 所有支付 SDK（如微信 JS-SDK、支付宝 AlipayJSBridge）都只负责「唤起收银台」，不负责「生成订单」
- 前端能做的只有：调用你后端 API 获取支付参数 → 触发 SDK 的
chooseWXPay或my.pay.requestPayment - 你的服务端必须部署 HTTPS，且域名与微信公众号/小程序/支付宝开放平台配置的「支付授权目录」完全一致（注意末尾斜杠）
微信 H5 支付必须用 MWEB 模式，不能用 JSAPI
很多人卡在「点击支付没反应」或跳转到「该链接无法访问」，本质是混淆了场景：JSAPI 只适用于公众号内嵌网页（用户已关注公众号且 openid 可获取），而普通手机浏览器打开的 HTML5 页面，必须走 MWEB（即微信内置浏览器外的 H5 支付）。它返回的是一个带 redirect_url 的跳转链接，由你前端重定向过去。
-
MWEB接口地址是https://api.mch.weixin.qq.com/v3/pay/transactions/h5（v3 版）或旧版https://api.mch.weixin.qq.com/pay/unifiedorder（v2 版） - 请求体必须包含
scene_info.h5_info.type = "Wap"和scene_info.h5_info.app_name - 返回的
h5_url是临时有效链接（通常 5 分钟），需立即window.location.href = res.h5_url
支付宝网页支付要用 alipay.trade.page.pay，别碰 alipay.wap.trade.pay
支付宝文档里有两个相似接口，但适用场景不同：alipay.trade.page.pay 是标准 H5 支付（适配所有浏览器），而 alipay.wap.trade.pay 是老版本 WAP 支付，2023 年起已逐步下线，调用会返回 INVALID_PARAMETER 或直接拒绝。
新版本程序更新主要体现在：完美整合BBS论坛程序，用户只须注册一个帐号，即可全站通用!采用目前流行的Flash滚动切换广告 变换形式多样，受人喜爱!在原有提供的5种在线支付基础上增加北京云网支付!对留言本重新进行编排，加入留言验证码，后台有留言审核开关对购物系统的前台进行了一处安全更新。在原有文字友情链接基础上，增加LOGO友情链接功能强大的6种在线支付方式可选，自由切换。对新闻列表进行了调整，
- 前端只需构造一个隐藏表单，
method="POST"提交到https://openapi.alipay.com/gateway.do - 必填参数包括：
app_id、method、format、charset、sign_type、sign、timestamp、version、notify_url、return_url、biz_content（JSON 字符串） -
sign必须由服务端用 RSA2 私钥生成，前端拼接后无法通过验签
<form id="alipay-form" action="https://openapi.alipay.com/gateway.do" method="POST">
<input type="hidden" name="app_id" value="2021000123456789">
<input type="hidden" name="method" value="alipay.trade.page.pay">
<input type="hidden" name="format" value="JSON">
<input type="hidden" name="charset" value="utf-8">
<input type="hidden" name="sign_type" value="RSA2">
<input type="hidden" name="sign" value="kX1y... ">
<input type="hidden" name="timestamp" value="2024-04-01 12:00:00">
<input type="hidden" name="version" value="1.0">
<input type="hidden" name="notify_url" value="https://yourdomain.com/alipay/notify">
<input type="hidden" name="return_url" value="https://yourdomain.com/alipay/return">
<input type="hidden" name="biz_content" value='{"subject":"商品","out_trade_no":"ORD20240401001","total_amount":"1.00","product_code":"FAST_INSTANT_TRADE_PAY"}'>
</form>
<script>document.getElementById('alipay-form').submit()</script>
回调验证和订单状态不能靠前端轮询，必须以服务端通知为准
很多开发者在前端用 setInterval 每 2 秒查一次 /api/order/status?sn=xxx，这是危险做法：支付结果可能延迟到达（尤其银行渠道），重复查询浪费资源，且无法防止用户手动篡改状态。微信/支付宝的 notify_url 是唯一可信来源，必须由你服务端接收、验签、更新数据库，并主动推送前端（如 WebSocket 或 Server-Sent Events）。
立即学习“前端免费学习笔记（深入）”；
- 微信 notify 地址必须是公网可访问的 HTTPS 接口，且返回
success（纯文本，无空格无换行），否则微信会持续重试 - 支付宝 notify 中的
trade_status为TRADE_SUCCESS才代表真实到账；return_url仅作展示，可被用户关闭或伪造 - 前端收到支付完成提示后，仍应调用一次
/api/order/detail?sn=xxx获取最终状态，但该接口必须校验服务端已标记为「已支付」
