微信小程序前端微信支付功能支付流程

小程序支付（纯前端）

前提（实现微信小程序支付功能需要appid主体为企业，以及开通了微信商家服务的小程序才能实现，个人小程序是无法实现这个功能的）

前期准备：
1.开通了微信支付，并且小程序绑定了微信支付；
2.准备好小程序的appid，微信支付的商户号，支付秘钥。

商户系统和微信支付系统主要交互：
1、小程序内调用登录接口，获取到用户的openid 方法见：【小程序登录API】
2、调用商户服务器支付统一下单接口，进行预支付（后台）
3、调用商户服务器再次签名接口，返回支付数据
4、小程序内完成支付，商户服务器接收支付回调通知。
————————————————

调用方法及参数说明：

需要注意的是在调用这个方法的时候需要要配合后端请求相关支付商品的数据，金额等，以及实现用户登录，让后台知道是哪个用户支付的。

模板：

wx.requestPayment()

wx.requestPayment({timeStamp: preData.timeStamp + "",nonceStr: preData.nonceStr,package: preData.package + "",signType: 'MD5',paySign: preData.paySign,success(res) {console.log('支付成功');},fail(res) {console.log('支付失败');return;},'complete': function (res) {console.log('支付完成');if (res.errMsg == 'requestPayment:ok') {wx.showModal({title: '提示',content: '购买成功'});}return;}
})

示例代码：

//index.js
Page({data: {},//点击支付按钮进行支付payclick: function () {var t = this;wx.login({//获取code换取openIDsuccess: function (res) {//code = res.code //返回codeconsole.log("获取code");console.log(res.code);var opid = t.getOpenId(res.code);}})},//获取openIDgetOpenId: function (code) {var that = this;wx.request({url: "https://api.weixin.qq.com/sns/jscode2session?appid=你的appid&secret=AppSecret(小程序密钥)&js_code=" + code + "&grant_type=authorization_code",data: {},method: 'GET',success: function (res) {console.log("获取openid")console.log(res)that.setData({openid: res.data.openid,session_key: res.data.session_key})that.generateOrder(res.data.openid)},fail: function () {// fail},complete: function () {// complete}})},//生成商户订单generateOrder: function (openid) {var that = thiswx.request({url: 'http://localhost:25492/wx/getda',//后台请求地址method: 'GET',data: {gfee: '商品价钱',gname: '商品名称',openId: openid//（商品价钱和商品名称根据自身需要是否传值, openid为必传）},success: function (res) {console.log("后台获取数据成功");console.log(res);var param = { "timeStamp": res.data.timeStamp, "package": res.data.package, "paySign": res.data.paySign, "signType": "MD5", "nonceStr": res.data.nonceStr };//发起支付that.pay(param);},fail: function (res) {console.log("向后台发送数据失败")}})},//支付pay: function (param) {var that = this;console.log("发起支付")console.log(param)wx.requestPayment({timeStamp: param.timeStamp,nonceStr: param.nonceStr,package: param.package,signType: param.signType,paySign: param.paySign,success: function (res) {console.log("success");console.log(res);},fail: function (res) {console.log("fail")console.log(res);},complete: function (res) {console.log("complete");console.log(res)}})}
})

二，可以正常调用微信预订单接口，能获得微信支付返回的prepay_id，但是小程序调起收银台失败

参数错误，会返回调用支付jsapi缺少参数：total_fee，此时与签名没关系，需要检查方法参数，随机字符串和package对应的参数值，还有就是，下预订单使用的用户openid和拉起支付的用户，必须是同一个，不然会报错，我就是遇到这个错误。
支付验证签名失败，这个与获得签名有关系，返回的签名不正确。自己手动获取签名，要注意参数的顺序以及大小写。使用微信工具类获得签名时，也要注意大小写，并且在要签名的参数中加上签名方式repData.put(“signType”,“MD5”);

微信小程序前端微信支付功能支付流程相关推荐

springboot 微信小程序对接微信支付功能(完整版)
微信小程序对接微信支付功能业务流程时序图 JAVA版 1. 项目架构 2. pom.xml配置文件 3. 小程序账号参数配置类 4.JAVA 通用代码 4.1 工具类 4.1.1 IdGen (id ...
(已更新）运势运程小程序v1.2.0 功能模块+微信小程序+前端+后端+新增每日星座卡片
运势运程算命小程序 v1.2.0 完整版+微信小程序+前端+后端运势运程算命小程序开源源码最新更新日志: 新增测算栏目支付成功模版消息提醒,增加留存率.新增每日星座卡片.单向历,请求缓存解决请求慢问 ...
运势运程算命小程序v1.2.0 功能模块+微信小程序+前端+后端+新增每日星座卡片
运势运程算命小程序开源源码最新更新日志: 新增测算栏目支付成功模版消息提醒,增加留存率.新增每日星座卡片.单向历,请求缓存解决请求慢问题.修复测算出生日期开始时间,从 1979 更改为 1918 运势 ...
微信小程序Ⅰ [关于微信支付的一点思路]
背景首先,小程序端的微信支付功能我还没有做,但是之前做过网页版已经微信端唤醒方式的微信支付因为还需要申请新的域名,过几天才能正式测试,此处是在参考小程序官方文档后的思路因此文可自成一体,所以被我 ...
微信小程序开发-微信支付之免密支付（自动扣费）一小程序+java接口
微信小程序开发-微信支付之免密支付(自动扣费)一小程序+java接口链接: 点击进入
微信小程序实现微信支付
准备工作首先要是一个企业账号的微信公众平台,才有资格开启微信支付(毕竟人家帮你收钱相当于),然后还要用微信开通一个商户号mch_id等一下作为参数使用,也就是这个微信可以收到钱的,大概就是这些准备工 ...
微信小程序接入微信支付（二）：后台调用统一下单接口
微信统一支付官方文档:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_1 因该接口需要商户系统中自己的订单编号,笔者先 ...
微信小程序接入微信支付（三）：小程序端调用支付接口
微信小程序调用支付接口官方文档:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_7&index=5 在上一节中 ...
微信小程序获取用户手机号码，Java后台servlet解密（微信小程序调用微信支付也是大致的流程）
本篇记录说明微信小程序获取用户手机号码,Java后台servlet解密(微信小程序调用微信支付也是大致的流程,详细内容可私信交流) (第一次写博客,写得不好的地方见谅,面向新手,大佬请无视,不喜勿喷 ...
随笔集：微信小程序的微信支付
微信小程序的微信支付简单来说一下微信支付的开发流程: 大概来说就是两步: 1.客户端请求后端生成订单,后端生成商户订单后调用统一下单API,微信方会生成一个预付单,并返回预付单信息(prepay_i ...

微信小程序前端微信支付功能支付流程

小程序支付（纯前端）

调用方法及参数说明：

模板：

示例代码：

容易遇到的问题：
一，调用微信预订单接口失败

二，可以正常调用微信预订单接口，能获得微信支付返回的prepay_id，但是小程序调起收银台失败

微信小程序前端微信支付功能支付流程相关推荐

最新文章

热门文章

微信小程序前端微信支付功能 支付流程

小程序支付（纯前端）

调用方法及参数说明：

模板：

示例代码：

容易遇到的问题： 一，调用微信预订单接口失败

二，可以正常调用微信预订单接口，能获得微信支付返回的prepay_id，但是小程序调起收银台失败

微信小程序前端微信支付功能 支付流程相关推荐

最新文章

热门文章

微信小程序前端微信支付功能支付流程

容易遇到的问题：
一，调用微信预订单接口失败

微信小程序前端微信支付功能支付流程相关推荐