微信点金计划接入详细步骤

已于 2022-03-20 23:11:59 修改
阅读量4.4k 收藏 7
点赞数 3
分类专栏： 笔记 文章标签： python 经验分享
于 2022-03-20 23:03:55 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43464076/article/details/123618948
版权

文章目录

前言

在之前，普通的JSAPI调用跳转到自定义界面的功能还是存在的，而在2020/6，微信公告了特约商户与普通商户跳转自定义界面的功能区别开了。特约商户只有开通了点金计划才可以跳转自定义界面，否则付款完成后将直接关闭完成界面。

这里是先介绍整体流程，然后最后是我所踩的坑的解答。

点金计划文档：https://wx.gtimg.com/pay/download/goldplan/goldplan_product_description_v2.1.pdf
官方的文档中的查询订单接口文档是V2版本相关文档：https://pay.weixin.qq.com/wiki/doc/api/index.html
根据自己的支付方式对接响应的支付接口
根据我后期与客户沟通用V3是最好的（文档下面会有V3接口链接），因为V2我在某个文档看好像会停用。

最后创作不易，多多支持一下！

一、开通点金计划

  1. 自行登录微信服务商平台https://pay.weixin.qq.com/index.php/core/home/login
  2. 一次点击服务商功能–>点金计划–>开通计划

在这里插入图片描述
3. 填写接口人员最多填写5个，这个功能用来给开发者来调试点金计划的页面

二、配置点金计划的商家小票

  1. 在点金计划页面点击【商家小票链接配置】，在如图所在的位置，我这边已经是配置好了。
    在这里插入图片描述
  2. 下载微信验证文件

在这里插入图片描述

  1. 自定义一个路径用来返回一个商家小票的界面
    如：商家小票的页面的路径为：https://www.aaa.com/ym/customerpage
    或者放在服务器的可能为：https://www.aaa.com/ym/customerpage.html
  2. 将下载好的微信验证文件放在访问商家小票的路径下如：https://www.aaa.com/ym/微信验证文件，必须在同一个目录下，即在ym下
  3. 将商家小票的页面路径写进商家小票连接的框中https://www.aaa.com/ym/customerpage或https://www.aaa.com/ym/customerpage.html，这是点提交微信会自动通过商家小票的根路径去寻找微信验证文件的内容进行匹配

三、编写商家小票界面

为了大家方便直接复制以下代码，自行修改即可

<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="referrer" content="origin">
    <meta name="viewport"
        content="width=device-width, viewport-fit=cover, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <title>支付完成</title>
    <script type="text/javascript" charset="UTF-8" src="https://wx.gtimg.com/pay_h5/goldplan/js/jgoldplan-1.0.0.js">
    </script>
    <script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>
    <script type="text/javascript" src="https://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

    <style>
        body {
            font-family: PingFang SC, "Helvetica Neue", Arial, sans-serif;
        }

        .order_box {
            text-align: center;
        }

        .order_box .bussiness_avt img {
            width: 68px;
            height: 68px;
            border-radius: 100%;
            border: 1px solid #E0E0E0;
        }

        .b_name {
            font-size: 14px;
            font-weight: 500;
            color: #333333;
            margin-top: 6px;
        }

        .col_box {
            margin-top: 35px;
        }

        .col_box .col {
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
            font-size: 14px;
            color: #333;
            margin-bottom: 10px;
        }

        .col .ct.price {
            color: #E61515
        }

        .btns {
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            /* 页面底下有两个按钮时，放开这个来进行均匀排版 */
            /* justify-content: space-between; */
			/* 只有一个按钮就居中处理 */
            justify-content: center;
            margin-top: 25px;
        }

        .btns .btn {
            width: 147px;
            height: 35px;
            line-height: 35px;
            font-size: 14px;
            border-radius: 39px;
            border: 1px solid #CD2314;
            box-sizing: border-box;
            color: #CD2314;
        }

        .btns .btn.detail {

            background: linear-gradient(270deg, #D51010 0%, #EF4D2D 100%);
            color: #fff;
        }
    </style>
</head>

<body>
<div class="order_box">
    <div class="bussiness_avt">
        <img id="b_avt" src="https://cdn.ibeelink.com/favicon.ico"
             alt="">
    </div>
    <div class="b_name" id="b_name">
        xxx公司
    </div>
    <div class="col_box">
        <div class="col">
            <div class="lab">产品名称</div>
            <div id="p_name" class="ct">产品名称</div>
        </div>
        <div class="col">
                <div class="lab">购买数量</div>
                <div id="count" class="ct"></div>
            </div>
        <div class="col">
            <div class="lab">优惠金额</div>
            <div id="discountAmount" class="ct price"></div>
        </div>
        <div class="col">
            <div class="lab">实付金额</div>
            <div id="amount" class="ct price"></div>
        </div>
    </div>
    <div class="btns">
        <!-- <div id="backHome" class="btn home">返回首页</div> -->
        <div id="toOrder" class="btn detail">业务地址</div>
    </div>
</div>

<script>
    //初始化console  调试商家小票最好打开这个，可以看到接口访问时间
    // var vConsole = new VConsole();

    //获取返回页面参数
    function getQueryString(name) {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
            var pair = vars[i].split("=");
            if (pair[0] == name) {
                return pair[1];
            }
        }
        return null;
    }

    //获取参数
    // "特约商户号（sub_mch_id）"、"商户订单号（out_trade_no）"
    // ?sub_mch_id=123456G&che7&out_trade_no=ABCDEFck_code=39f0876dd58e4eb61b66250f69d02705
    var sub_mch_id = getQueryString("sub_mch_id"); //特约商户号
    // console.log("sub_mch_id is " + sub_mch_id)
    var out_trade_no = getQueryString("out_trade_no"); //商户订单号
    // console.log("out_trade_no is " + out_trade_no)
    // var check_code = getQueryString("check_code"); //md5 校验码  如果服务商是通过银行注册的，需要银行提供接口进行订单验证，该验证码需要根据银行那边进行特殊处理
    // console.log("check_code is " + check_code)


    $.ajax({
        type: "GET",
        url: 获取页面参数的接口,
        data: {
            sub_mch_id: sub_mch_id,
            out_trade_no: out_trade_no,
        },
        dataType: "json",
        success: function (res) {
            // console.log(res)
            if (res.errorCode == 0) {
                var detailLink = res.data.returnUrl;
                $("#b_avt").src = res.data.logo
                $("#b_name").html(res.data.name)
                $("#p_name").html(res.data.goodsName)
                // 我这边的单位是分所以需要转化一下
                $("#discountAmount").html("￥" + Math.floor(res.data.discountAmount) / 100)
                $("#amount").html("￥" + Math.floor(res.data.amount) / 100)
                $("#count").html(res.data.count)
                var initData = {
                    action: 'onIframeReady',
                    displayStyle: 'SHOW_CUSTOM_PAGE',
                }
                var initPostData = JSON.stringify(initData)
                parent.postMessage(initPostData, "https://payapp.weixin.qq.com")
                //注册点击事件(去详情)
                document.getElementById("toOrder").onclick = function () {
                    var mchData = {
                        action: 'jumpOut',
                        jumpOutUrl: detailLink //跳转的页面
                    }
                    var postData = JSON.stringify(mchData)
                    parent.postMessage(postData, "https://payapp.weixin.qq.com")
                }
                //注册点击事件(去首页)
                // document.getElementById("backHome").onclick = function () {
                //     var mchData = {
                //         action: 'jumpOut',
                //         jumpOutUrl: homeLink //跳转的页面
                //     }
                //     var postData = JSON.stringify(mchData)
                //     parent.postMessage(postData, "https://payapp.weixin.qq.com")
                // }
            }

        }
    });
</script>
</body>
</html>

四 、调试商家小票

  1. 点击商家小票调试工具
    在这里插入图片描述
  2. 向某个特约商户的商品支付一笔订单，然后在手机上获取商户订单以及微信订单号
  3. 向该服务商获取他在注册微信服务商成功后微信向他发送的一个邮件里面有一个所属银行商户号即是从业机构商户号
  4. 在填写好商家小票地址与特约商户号，然后点击生成调试验证码 （需要付款人扫码且必须是其中一个接口人）

五、申请证书

在操作点金计划相关的接口需要进行一些签名操作，在进行签名操作的时候需要确认有无可操作的证书账户中心-->API安全查看
若没有证书需要按照流程进行申请证书。
注：需要现在设置v3密钥采取申请证书，否则直接申请证书到中间会提示需要先申请V3密钥（点金计划用的都是V3接口）
在这里插入图片描述
在申请完证书后，需要点击管理证书，里面会出现一串商户证书序列号，这个需要记录下来，后面的签名需要这串号码，需要要将apiclient_key.pem这个私钥放进你的项目，后面需要根据这个进行签名
在这里插入图片描述

六、签名

微信V3签名地址：https://pay.weixin.qq.com/wiki/doc/apiv3_partner/wechatpay/wechatpay4_0.shtml
点金计划相关接口：https://pay.weixin.qq.com/wiki/doc/apiv3_partner/open/pay/chapter3_5_4.shtml

如果自己写的代码验证不通过，用postman的调用以下网址的访问demo，对比哪里有问题
POSTMAN调用接口操作：https://developers.weixin.qq.com/community/develop/article/doc/00024c9c0f81a08b223d219095b813

python相关代码（省略的是签名的模块）

import string
import random
import requests

url = "/v3/goldplan/merchants/set-advertising-industry-filter"
nonce_str = ''.join(random.sample(string.ascii_letters + string.digits, 32))
timestamp = str(int(time.time()))
message = method + "\n" + url + "\n" + timestamp + "\n" + nonce_str + "\n" + json.dumps(body) + "\n"
signature = 根据你的私钥进行签名

author = 'WECHATPAY2-SHA256-RSA2048 mchid="{}",nonce_str="{}",timestamp="{}",serial_no="{}",signature="{}"'.format(
    服务商商户号（不是特约商户号）, nonce_str, timestamp, 你的证书序列号, signature)

header = {"Content-Type": "application/json", "Accept": "application/json", "Authorization": author}

response_data = requests.具体请求方法("https://api.mch.weixin.qq.com" + url, json=body, headers=header)

Q&A 问答

1. 想更换调试接口人该如何进行？

我找来找去都没有找到调试接口人，只试了一个方法可行，那就是退出计划再进入计划，这时候就可在配置接口人，再次进入之后相关配置不会清除，若还有其他方法可以私信我，我会记录在这里

2. 如何解除特约商户？

如果申请了特约商户目前是不支持解绑也无法注销的，如不想在服务商旗下，建议重新直接在商户平台申请一个普通商户号

3. 特约商户中商家小票的广告利益去哪获取？

这个问题我问过腾讯客服，他们的解释是：目前只有服务商才具有获取收益的资格，即所有特约商户的广告利益都会放进服务商中，若特约商户也想分红，需要与服务商进行协调沟通
在这里插入图片描述

4、为什么查询微信订单接口时返回：普通商户不允许传sub_mch_ic？

这就表明该服务商不具备调用微信的查询订单接口资格，需要与开通该服务商的银行进行反馈，由银联提供接口文档。

5、商家小票为什么出现Failed to execute ‘postMessage’ on ‘DOMWindow’: The target origin provided (‘https://payapp.weixin.qq.com’) does not match the recipient window’s origin (‘xxx’)？

这错误搞得我真的是头皮发麻，解决办法有三点：

  1. 将parent.postMessage(postData, "https://payapp.weixin.qq.com")中的 “https://payapp.weixin.qq.com"改为”*"

  2. 若是通过某种中间件进行代理，则需要添加X-Frame-Options响应头
    以下是摘录一些常用的，具体https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/X-Frame-Options：
    Apache

    需要把下面这行添加到 ‘site’ 的配置中 Header set X-Frame-Options "allow-from *"

    nginx

    把下面这行添加到 ‘http’, ‘server’ 或者 ‘location’ 的配置中：add_header X-Frame-Options ALLOW-FROM *;

    IIS

    <system.webServer>
  ...

  <httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="allow-from *" />
    </customHeaders>
  </httpProtocol>

  ...
</system.webServer>

    HAProxy

    配置 HAProxy 发送 X-Frame-Options 头，添加这些到你的前端、监听 listen，或者后端的配置里面：rspadd X-Frame-Options: allow-from *
    较新版本新版本：http-response set-header X-Frame-Options allow-from *

  3. 如果以上两者都试过，那可以直接选择无视，因为我配置完了第二种的haproxy之后还是会出现该报错，我就试着调试商家小票，而在调试中却没有这个错误。

Pierce°ღ
关注
  • 3
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
微信小程序接入百度统计
03-29
一. 百度统计添加应用，获取appkey和微信小程序统计sdk: 百度统计首页，点击“我的全部应用”右侧的添加按钮： (此图片来源于网络，如有侵权，请联系删除! ) “应用类型”选择小程序统计，选择微信小程序，填写应用名称信息，选择内容分类，然后点击创建应用： (此图片来源于网络，如有侵权，请联系删除! ) 获取到AppKey,下载微信小程序统计SDK，然后就可以在小程序中接入统计了，在这个页面下边就有SDK接入说明了。 (此图片来源于网络，如有侵权，请联系删除! ) 二. 微信小程序接入： 把下载的微信小程序统计SDK解压后的mtj-wx-sdk.js和mtj-wx-sdk.config.j
微信点金计划步骤详情
m0_55333789的博客
03-10 1562
微信点金计划
微信小程序接入指南
03-29
产品定位及功能介绍 微信小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。 小程序注册 访问公众平台官网 在微信公众平台官网首页（mp.weixin.qq.com）点击右上角的“立即注册”按钮。 (此图片来源于网络，如有侵权，请联系删除! ) 选择注册的帐号类型 选择“小程序”，点击“查看类型区别”可查看不同类型帐号的区别和优势。 填写邮箱和密码 请填写未注册过公众平台、开放平台、企业号、未绑定个人号的邮箱。 激活邮箱 登录邮箱，查收激活邮件，点击激活链接。 填写主体信息 点击激活链接后，继续下一步的注册流程。请选择主体类型选择，完善主体信息和管
php 微信公众平台接入 代码
02-09
php 微信公众平台接入 代码
nodejs微信开发之接入指南
10-17
主要介绍了nodejs微信开发之接入指南，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
微信点金计划对接步骤详解
f1661434531的博客
03-14 2138
之前使用微信jsapi的接口做公众号支付，突然就不能使用返回页面了。是因为微信新推出了新的返回页面解决方案，就是所谓的点金计划。使用点金计划就可以更加丰富你的返回页面，可以在返回页面展示支付信息 小票和广告等。 如果之前已经对接了支付，升级也挺简单，不需要修改之前的代码。官方给的文档有点麻烦，这里简单记录下。 1，在公众号里申请开通点金计划，过程可以按官方文档指导来，最重要的是设置返回页面。 2，这个页面是微信支付成功后会返回的页面，在这个返回页面里写入如下代码 <!DOCTYPE ht
微信点金计划（服务商角度）
qq_36566924的博客
02-17 847
引入的头部文件，除了./jsapiResult/cssFiles/jsapiResult.css这个文件外，其他直接去网上扒拉资源就好，我这里都是自己下载下来放置为静态文件调用,这个样式文件如下。②“商家小票”调试工具里面的，“从业机构商户号”是银行/服务商的商户号，底部的2个单号，可以在微信支付的“账单”里面点进去查询到。三.因为微信的前端回调没有跳转小程序的方法，所以设置了一个空白页面，先跳转到空白页面，空白页面再跳转到小程序，空白页面代码如下。这个文件，我目前是放置在index.html里面。
微信点金计划对接笔记
weixin_44219223的博客
11-16 366
微信 点金计划
微信支付服务商点金计划
dmmrli的博客
08-23 1593
点金计划 简介 点金计划是微信支付官方提供的支付后跳转能力的升级计划。 1、产品简介：微信支付平台提供支付后页面模板，支持账单展示、服务性内容展示、流量位推广等功能。其中，流量位推广指接入微信广告平台； 2、服务商收益：服务商提供点金计划相关技术服务，由微信支付向服务商支付返佣奖励； 3、服务商管理工具：可在服务商平台对特约商户开通/关闭点金计划，以及为特约商户配置同业过滤标签，过滤所选行业的广告。同时，对于有需要的特约商户，服务商可为其开通商家小票功能，即可在点金计划官方页面上方嵌入商家服务性内
微信支付点金计划和商家小票的开发教程
qq_37172200的博客
12-01 5255
微信支付成功的跳转页面，点金计划和商家小票的开发教程 最近和一家企业合作，考虑怎么流量互换，于是就有了微信支付完后的跳转页面，利用微信的点金计划，展示商家小票的功能，作为初步方案。 直接进入主题，下面详细介绍代码开发方面需要注意的点（坑）： 1、微信支付后跳转展示的页面， 叫点金计划，能够展示商家小票。商家小票就是展示自己写的内容。 2、官方的开发指引： https://http://wx.gtimg.com/pay/download/goldplan/goldplan_developer_guideli
微信接入步骤java版（详细）
08-20
微信支付接入详细步骤，java接入java代码： 1、access_token是公众号的全局唯一接口调用凭据，公众号调用各接口时都需使用access_token。开发者需要进行妥善保存。access_token的存储至少要保留512个字符空间。access_token的有效期目前为2个小时，需定时刷新，重复获取将导致上次获取的access_token失效
h5小程序使用微信点金计划解决方案
qq_57260058的博客
06-14 644
主要解决微信点金计划跳转、显示不出来的问题。
H5微信支付成功跳转商家小票
m0_50278775的博客
08-03 2367
H5支付完成之后是直接把整个项目关闭的，以前可以跳转到指定的页面，但2020年微信出了点金计划，并且陆续回收了跳转指定页面的权限。如果真的想跳到某个页面，那么就要开通点金计划，把我们自定义的页面（商家小票）嵌套在点金页面。然后我有点怀疑是第三点超时问题，但是我的商家小票页面其实就是个静态页面，都没有做数据交互，应该不至于会超过3s。然后部署到测试环境，发现安卓支付成功后跳转点金页面可以正常显示商家小票内容，但是ios显示无法获取订单信息~以为可以了，但是ios的问题还是没有解决。网上的资料大概就这些。...
微信支付点金计划商家小票
逆袭的菜鸟X
05-13 720
1、参考资料 点金计划管理文档： 商家小票管理文档： 微信点金pdf文档: 微信点金计划，开通商家小票，微信支付完成后页面跳转 2、实战 （1）引入SDK <!-- 商家小票 --> <script type="text/javascript" charset="UTF-8" src="https://wx.gtimg.com/pay_h5/goldplan/js/jgoldplan-1.0.0.js"></script> （2）发送事件通知 onIframeRea
uniapp 微信公众号微信支付完成后页面跳转 即 点金计划 商家小票的开发
hthereal的博客
03-16 3318
最近在使用uniapp 开发微信公众号页面，有支付订单功能，在完成支付后，发现支付后的success，一直无法响应，找了好久文档，才发现目前微信支付完成后的回调能力被回收，已强制性的由点金计划的功能来替代（广告创收）。 WeixinJSBridge.invoke('getBrandWCPayRequest', { "appId": wxAppId, //公众号名称，由商户传入 "timeStamp": orderback.timeStamp, //时间戳，自1970年以来的秒数
点金计划商家小票
m0_45827438的博客
12-02 946
'SHOW_OFFICIAL_PAGE'----微信官方小票。'SHOW_CUSTOM_PAGE'-----商家小票
微信点金计划中的商家小票交互
weixin_39475476的博客
11-17 1416
微信的点金计划 其实 就是我们嵌入微信的一个页面，被称之为商家小票，以下是我的商家小票的代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device.
微信点金计划，开通商家小票，微信支付完成后页面跳转
pipizhou16的博客
09-27 6306
今天有个需求，修改uniapp微信公众号h5页面的微信点金商家小票，并设置按钮跳转首页。 （下面我要写的内容，我感觉比较通用，不仅适用我的这个uniapp需求，还适用小程序） 为啥会有微信点金计划这个需求，因为对于微信支付成功之后，跳转到指定页面，微信目前已经关闭了该通道，具体通知请参看：https://pay.weixin.qq.com/index.php/public/cms/content_detail?platformType=1&lang=zh&id=121505 根据通知提示，要
Python中使用tkinter模块和类结构的结合使用举例——编写制作一个简单的加数GUI界面
最新发布
qq_18937049的博客
05-09 585
编写程序实现GUI界面是一种重要的编程技能，Python 作为一种面向对象的程序编程语言，也提供了GUI设计的库。本文以tkinter库为基础进行GUI的简单设计举例，并在编写过程中说明类结构的定义方法。
将chatgpt接入微信详细步骤
04-12
将C知道接入微信需要以下步骤： 1. 创建微信公众号或小程序，获取开发者ID和密钥。如果您还没有微信公众号或小程序，请先注册一个。 2. 在微信公众平台或小程序后台设置接口信息，将服务器地址设置为您的C知道 API的地址，将Token设置为一个自定义的字符串。 3. 配置您的C知道 API，确保它可以接受来自微信服务器的请求。在API中，您需要实现以下功能： - 验证来自微信服务器的请求是否合法，包括验证Token是否匹配。 - 处理微信服务器发送的消息，包括解析XML格式的消息、调用C知道 API生成回复消息等。 - 将生成的回复消息发送给微信服务器。 4. 部署您的C知道 API，确保它可以被公网访问。您可以使用云服务器、容器等云计算服务来部署API。 5. 在微信公众平台或小程序后台测试接口是否正常工作。您可以在后台设置中创建测试用户，模拟用户向您的公众号或小程序发送消息，查看C知道 API是否能够正确生成回复。 需要注意的是，将C知道接入微信是一项较为复杂的开发任务，需要熟悉微信开发、API开发等相关技术。如果您不具备相关技术，建议寻找专业的技术团队进行开发。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Pierce°ღ

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值