微信小程序支付前端源码


Posted in Javascript onAugust 29, 2018

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

//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 证书   勾上即可

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 另一种图片滚动切换效果思路
Apr 20 Javascript
JS操作select下拉框动态变动(创建/删除/获取)
Jun 02 Javascript
js 窗口抖动示例
Sep 04 Javascript
Jquery实现的角色左右选择特效
May 21 Javascript
BootStrap3中模态对话框的使用
Jan 06 Javascript
js移动端图片压缩上传功能
Aug 18 Javascript
微信小程序中时间戳和日期的相互转换问题
Jul 09 Javascript
JS 中可以提升幸福度的小技巧(可以识别更多另类写法)
Jul 28 Javascript
详解小程序毫秒级倒计时(适用于拼团秒杀功能)
May 05 Javascript
微信小程序实现搜索指定景点周边美食、酒店
May 18 Javascript
继承行为在 ES5 与 ES6 中的区别详解
Dec 24 Javascript
vue相同路由跳转强制刷新该路由组件操作
Aug 05 Javascript
微信小程序使用swiper组件实现类3D轮播图
Aug 29 #Javascript
javascript中UMD规范的代码推演
Aug 29 #Javascript
详解webpack自定义loader初探
Aug 29 #Javascript
在vue中使用SockJS实现webSocket通信的过程
Aug 29 #Javascript
微信小程序自定义select下拉选项框组件的实现代码
Aug 28 #Javascript
微信小程序中上传图片并进行压缩的实现代码
Aug 28 #Javascript
vee-validate vue 2.0自定义表单验证的实例
Aug 28 #Javascript
You might like
解决Codeigniter不能上传rar和zip压缩包问题
2014/03/07 PHP
PHP strip_tags() 去字符串中的 HTML、XML 以及 PHP 标签的函数
2016/05/22 PHP
php微信开发接入
2016/08/27 PHP
php依赖注入知识点详解
2019/09/23 PHP
JQuery CSS样式控制 学习笔记
2009/07/23 Javascript
jQuery写的日历(包括日历的样式及功能)
2013/04/23 Javascript
IE6-IE9中tbody的innerHTML不能赋值的解决方法
2014/09/26 Javascript
javascript实现数独解法
2015/03/14 Javascript
Js和JQuery获取鼠标指针坐标的实现代码分享
2015/05/25 Javascript
JS+CSS实现TreeMenu二级树形菜单完整实例
2015/09/18 Javascript
JS实现网页右侧带动画效果的伸缩窗口代码
2015/10/29 Javascript
理解javascript对象继承
2016/04/17 Javascript
Javascript中的迭代、归并方法详解
2016/06/14 Javascript
JavaScript中join()、splice()、slice()和split()函数用法示例
2018/08/24 Javascript
浅谈redux, koa, express 中间件实现对比解析
2019/05/23 Javascript
Vue 实现v-for循环的时候更改 class的样式名称
2020/07/17 Javascript
基于JavaScript实现简单的轮播图
2021/03/03 Javascript
windows下安装python paramiko模块的代码
2013/02/10 Python
跟老齐学Python之总结参数的传递
2014/10/10 Python
Tensorflow使用tfrecord输入数据格式
2018/06/19 Python
在Pycharm中项目解释器与环境变量的设置方法
2018/10/29 Python
Python实现带下标索引的遍历操作示例
2019/05/30 Python
python+logging+yaml实现日志分割
2019/07/22 Python
Django项目基础配置和基本使用过程解析
2019/11/25 Python
Python Flask异步发送邮件实现方法解析
2020/08/01 Python
优秀的教师个人的中文求职信
2013/09/21 职场文书
《春晓》教学反思
2014/04/20 职场文书
教师师德演讲稿
2014/05/06 职场文书
个人委托书范本
2014/09/13 职场文书
餐厅感恩节活动策划方案
2014/10/11 职场文书
办公用品管理制度
2015/08/04 职场文书
队名及霸气口号大全
2015/12/25 职场文书
干货!开幕词的写作方法
2019/04/02 职场文书
python实现黄金分割法的示例代码
2021/04/28 Python
mysql分表之后如何平滑上线详解
2021/11/01 MySQL
在SQL Server中使用 Try Catch 处理异常的示例详解
2022/07/15 SQL Server