微信点金计划

【微信点金计划】做微信支付的时候因为需求让支付后跳转自家项目的页面,发现支付点击完成之后直接退出项目返回到了微信公众号页面,上网查了一下,发现已经不支持这种自定义了,需要参加微信的点金计划,这样支付成功之后会跳转到小票页面,分为两种一种商家小票,一种是官方小票,我这里用的是商家小票。访问这个地址可以查看关于点金计划的文档和配置教程:点金计划。
---> 首先配置商家小票链接:需要先把自己的页面文件上传到服务器,我的是上传了一个html文件,然后把该html文件对应的链接填写到商家小票链接input框就行了,微信的支付成功页面会把该链接填进ifram标签里面,这样自己的页面就嵌入微信的支付成功页了,代码会放在下面。
---> 这样所有的东西配置好之后就能在商家小票的调试工具进行调试了,填写好对应的参数扫描生成的二维码就可以。微信点金计划
文章图片

然后就是嵌入页面的代码,这个也是我网上借鉴的,改了自己的样式就能用:

支付完成测试 - 锐客网body { font-family: PingFang SC, "Helvetica Neue", Arial, sans-serif; }.container{ padding: 15px; display: flex; height: 600px; flex-direction: column; align-items: center; } .icon{ background: url('https://3ayj-oss.oss-cn-shenzhen.aliyuncs.com/pic/sprite_fm.png') 0 0 no-repeat; background-size: 985px 650px; width: 40px; height: 40px; margin: 15px; border-radius: 50%; background-position: -729px -215px; } .icon img{ display: inline-block; height: 40px; width: 40px; border-radius: 20px; } .msg{ font-size: 16px; font-weight: bold; margin-bottom: 15px; } #tips{ margin-bottom: 15px; } #cost{ font-size: 20px; font-weight: bold; margin-bottom: 15px; } #toOrder{ width: 100%; line-height: 50px; background-color: #00d660; color: #fff; border-radius: 7px; } #toOrder span{ display: inline-block; width: 100%; text-align: center; }支付成功查看支付详情

最后,我支付成功点击完成出现的页面是这样的:
微信点金计划
文章图片

    推荐阅读