微信小程序支付前端源码

本文实例为大家分享了微信小程序支付前端源码，供大家参考，具体内容如下

//index.js
Page({
data: {
},
//点击支付按钮进行支付
payclick: function () {
var t = this;
wx.login({
 //获取code换取openID
 success: function (res) {
 //code = res.code //返回code
 console.log("获取code");
 console.log(res.code);
 var opid = t.getOpenId(res.code);
 }
})
},
//获取openID
getOpenId: 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 = this
wx.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)
 }
})
}
})

本地调试如过出现请求失败请将    微信开发者工具  >    详情(右上角) > 不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书   勾上即可

来源：https://www.cnblogs.com/oneall/p/9548448.html