微信小程序支付前端源碼
本文實(shí)例為大家分享了微信小程序支付前端源碼,供大家參考,具體內(nèi)容如下
//index.js
Page({
data: {
},
//點(diǎn)擊支付按鈕進(jìn)行支付
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',//后臺(tái)請求地址
method: 'GET',
data: {
gfee: '商品價(jià)錢',
gname: '商品名稱',
openId: openid
//(商品價(jià)錢和商品名稱根據(jù)自身需要是否傳值, openid為必傳)
},
success: function (res) {
console.log("后臺(tái)獲取數(shù)據(jù)成功");
console.log(res);
var param = { "timeStamp": res.data.timeStamp, "package": res.data.package, "paySign": res.data.paySign, "signType": "MD5", "nonceStr": res.data.nonceStr };
//發(fā)起支付
that.pay(param);
},
fail: function (res) {
console.log("向后臺(tái)發(fā)送數(shù)據(jù)失敗")
}
})
},
//支付
pay: function (param) {
var that = this;
console.log("發(fā)起支付")
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)
}
})
}
})
本地調(diào)試如過出現(xiàn)請求失敗請將 微信開發(fā)者工具 > 詳情(右上角) > 不校驗(yàn)合法域名、web-view(業(yè)務(wù)域名)、TLS 版本以及 HTTPS 證書 勾上即可
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
ES2020讓代碼更優(yōu)美的運(yùn)算符 (?.) (??)
這篇文章主要介紹了ES2020讓代碼更優(yōu)美的運(yùn)算符 (?.) (??),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
使用indexOf等在JavaScript的數(shù)組中進(jìn)行元素查找和替換
使用slice、replace、indexOf等等在JavaScript的數(shù)組中進(jìn)行元素的查找和替換,感興趣的朋友可以學(xué)習(xí)下2013-09-09
bootstrap datepicker 與bootstrapValidator同時(shí)使用時(shí)選擇日期后無法正常觸發(fā)校驗(yàn)的解
這篇文章主要介紹了bootstrap datepicker 與bootstrapValidator同時(shí)使用時(shí)選擇日期后無法正常觸發(fā)校驗(yàn)的解決思路的相關(guān)資料,需要的朋友可以參考下2016-09-09
VSCode Webview中實(shí)現(xiàn)點(diǎn)擊下載圖片的基本流程
這篇文章主要介紹了VSCode Webview中如何實(shí)現(xiàn)點(diǎn)擊下載圖片,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-04-04
javascript 偽數(shù)組實(shí)現(xiàn)方法
能通過Array.prototype.slice轉(zhuǎn)換為真正的數(shù)組的帶有l(wèi)ength屬性的對(duì)象。2010-10-10
Javascript中類式繼承和原型式繼承的實(shí)現(xiàn)方法和區(qū)別之處
其它的面向?qū)ο蟪绦蛟O(shè)計(jì)語言都是通過關(guān)鍵字來解決繼承的問題。但是javascript中并沒有定義這種實(shí)現(xiàn)的機(jī)制。接下來通過本文給大家介紹Javascript中類式繼承和原型式繼承的實(shí)現(xiàn)方法和區(qū)別,需要的朋友可以參考下2017-04-04

