微信小程序支付前端源码
//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 证书 勾上即可
微信小程序支付前端源码的更多相关文章
- 从微信小程序开发者工具源码看实现原理(一)- - 小程序架构设计
使用微信小程序开发已经很长时间了,对小程序开发已经相当熟练了:但是作为一名对技术有追求的前端开发,仅仅熟练掌握小程序的开发感觉还是不够的,我们应该更进一步的去理解其背后实现的原理以及对应的考量,这可能 ...
- 微信小程序一键生成源码 在线制作定制功能强大的微信小程序
微信小程序发展到现在,短短的一年不到的时间(很快就要迎来微信小程序周年庆),在快迎来周年庆之际,百牛信息技术bainiu.ltd特记录一下这个发展的历程,用于将来见证小程序发展的辉煌时刻,我们还能知道 ...
- 从微信小程序开发者工具源码看实现原理(四)- - 自适应布局
从前面从微信小程序开发者工具源码看实现原理(一)- - 小程序架构设计可以知道,小程序大部分是通过web技术进行渲染的,也就是最终通过浏览器的dom tree + cssom来生成渲染树:既然最终是通 ...
- 从微信小程序开发者工具源码看实现原理(三)- - 双线程通信
文章概览: 引言 小程序开发者工具双线程通信的设计 1.on: 用来收集小程序开发者工具触发的事件回调 2.invoke:以api方式调用开发工具提供的基础能力 3.publish:用来向Appser ...
- 从微信小程序开发者工具源码看实现原理(二)- - 小程序技术实现
wxml与wxss的转换 1.wxml使用wcc转换 2.wxss使用wcsc转换 开发者工具主入口 视图层页面的实现 视图层页面实现技术细节 视图层快速打开原理 视图层新打开页面流程 业务逻辑层页面 ...
- 2018微信小程序官方示例源码最新版
忘记从哪获得的 CSDN 可以支持一下 谢谢你们 https://download.csdn.net/download/lan1128/10197682 当然也有免费的 代码在码云上免费公开 点个关 ...
- 微信小程序支付C#后端源码
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.W ...
- 微信小程序支付源码,后台服务端代码
作者:尹华南,来自原文地址 微信小程序支付绕坑指南 步骤 A:小程序向服务端发送商品详情.金额.openid B:服务端向微信统一下单 C:服务器收到返回信息二次签名发回给小程序 D:小程序发起支付 ...
- 通俗易懂,C#如何安全、高效地玩转任何种类的内存之Span的脾气秉性(二)。 异步委托 微信小程序支付证书及SSL证书使用 SqlServer无备份下误删数据恢复 把list集合的内容写入到Xml中,通过XmlDocument方式写入Xml文件中 通过XDocument方式把List写入Xml文件
通俗易懂,C#如何安全.高效地玩转任何种类的内存之Span的脾气秉性(二). 前言 读完上篇<通俗易懂,C#如何安全.高效地玩转任何种类的内存之Span的本质(一).>,相信大家对sp ...
随机推荐
- 平衡二叉树Balanced Binary Tree
[抄题]: Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced b ...
- 旋转链表(所有元素往右移) rotate list
[抄题]: 给定一个链表,旋转链表,使得每个节点向右移动k个位置,其中k是一个非负数 样例 给出链表1->2->3->4->5->null和k=2 返回4->5-& ...
- C++ 输入cin 和输出cout
C++输入cout与输出cin 输入和输出并不是C++语言中的正式组成成分.C和C++本身都没有为输入和输出提供专门的语句结构.输入输出不是由C++本身定义的,而是在编译系统提供的I/O库中定义的. ...
- php 使用html5 XHR2 上传文件 进度显示
思路:只要我们知道上传文件的总大小,还有上传过程中上传文件的大小,那么就可以实现进度显示了. 在html5中,XMLHttpRequest对象,传送数据的时候,progress事件用来返回进度信息. ...
- 开发中经典sql总结
1.说明:显示文章.提交人和最后回复时间 select a.title,a.username,b.adddate ,(select max(adddate) from table where tabl ...
- dedecms连表查询参照
ixingmeib2c/ds/entity_clas/tc_coupon_index.ls.php下面的getIndexInfo()方法
- Java数据结构和算法(一)线性结构
Java数据结构和算法(一)线性结构 数据结构与算法目录(https://www.cnblogs.com/binarylei/p/10115867.html) 线性表 是一种逻辑结构,相同数据类型的 ...
- 01 Linux 网络配置和克隆
Linux 网络配置和克隆 一.配置 Linux 网络 当在 VMware 中安装完 Linux 以后需要通过一些网络配置才能使 Linux 能够连能网络: 首先如果是在虚拟机上安装的 Linux 必 ...
- zeromq学习记录(二)天气更新服务器使用ZMQ_SUB ZMQ_PUB
/************************************************************** 技术博客 http://www.cnblogs.com/itdef/ ...
- bat批量重命名文件
@echo off setlocal enabledelayedexpansion set prefix="mai" set /a num=000 rem 排序/o:? -代表逆序 ...