微信支付官方文档首页竟然没有H5支付的入口😏😏，传送门在此：
微信H5支付官方文档
这一块可以认真读一下：

准备：

前往商户平台开通H5支付；文档
前往商户平台绑定appid
配置域名【商户平台->产品中心->开发配置->H5支付】（申请H5支付时会输入授权域名，如无需改变可跳过）
H5支付微信会校验客户端外网ip，我使用内网穿透工具（frp）配合 nginx 解决

nginx 配置：

log_format frp '$remote_addr - $remote_user [$time_local] "$request" '
                     '$status $body_bytes_sent ["referer: $http_referer"] [hostname: $hostname] [host: $host] [remote_addr $remote_addr]'
                     ' [remote_port $remote_port] [X-Forwarded-For $proxy_add_x_forwarded_for]';
server {
    listen 80;
    # 改成自己的域名，这个域名需要配置在商户平台的H5支付中【商户平台->产品中心->开发配置->H5支付】
    server_name *.frps.baidu.com;
    access_log logs/frp.log frp;
    location / {
        proxy_pass http://localhost:7001;
        # proxy_set_header Host $host:7001;
        ####        微信H5支付 获取用户端ip用   结束 start      ========
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Real-Port $remote_port;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        ####        微信H5支付 获取用户端ip用   结束 end      ========
        # add_header Access-Control-Allow-Origin *;
        # add_header Access-Control-Allow-Headers *;
        # add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
    }
}

需要注意的是：

微信内置浏览器不能使用H5支付😅😄😅

在微信内置浏览器打开的网页不能使用H5支付，虽然文档也给了说明，不过不遇到这种情况，一般不会去查文档🤣所以特别说明一下。要在微信浏览器调起支付可以使用JSAPI支付（需要已认证的服务号）

H5支付调用成功返回示例：

{
  "data": {
    "return_code": "SUCCESS",
    "return_msg": "OK",
    "result_code": "SUCCESS",
    "mch_id": "1588254821",
    "appid": "wxd250963102d6d4e8",
    "nonce_str": "meIzCdesfgVpaph7",
    "sign": "4ED45DFA97EEFE1ADB99D33B7BA04EF1B144E284610553DB75DCA9E20B742843",
    "prepay_id": "wx2717295728429189d6accdeb24eb7c0000",
    "trade_type": "MWEB",
    "mweb_url": "https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx2717295728429189d6accdeb24eb7c0000&package=3873244427"
  }
}