实战：微信小程序支付开发

mdluo 发布于2019-06-27 15:00 / 1174人阅读

摘要：调用微信申请支付的方式生成一串验证信息如下小程序随机字符串的预支付交易单小程序就是上面的验证信息测试开启校验请求域名与配置，点击预览使用真机测试，开发工具不会响应发起支付的接口。

该文章纪录了我在开发小程序支付过程中的具体流程
自己写的一个简单电商小程序：https://github.com/ateddy/Wec...

1. 申请微信支付

小程序认证后进入微信支付申请小程序的微信支付

填写企业信息对公账户并上传凭证后，微信支付会打一笔随机金额到对公账户，输入金额完成验证后，在线签署协议，这样整个微信支付的申请流程完成了。注意此处申请所填写的信息都需要真实且详细，设置小程序的密钥。

微信支付申请完，会发送微信支付商户号，商户平台用户名密码等信息到注册者邮箱。

2.配置商户信息

申请微信支付成功后，登陆商户平台(pay.weixin.qq.com)进入账户中心，设置微信商户的API Key与下载证书

3.配置Https服务器

小程序的前端是使用微信提供的框架开发，但是后台依然是开发者自己的服务器。小程序发起的是 https 请求，意味着小程序开发者必须配置 https 服务器。
配置 https 服务器之前，先要获取证书，证书可以向相关机构购买，腾讯云目前可以向用户提供免费的证书。

证书安装指引在这里查看：
https://www.qcloud.com/docume...

4.服务端准备

下载微信支付sdk,配置微信小程序信息与商户信息，放置证书到对应目录。调用微信申请支付JSAPI的方式生成一串验证信息如下：

appId:"wx3*******6"//小程序id
nonceStr:"qdpys6rdizbnpj12ahwvkf568a6c1sr9" //随机字符串
package:"prepay_id=wx2016***********3" //wx的预支付交易单
paySign:"8A7DC1A560B3B6DB0C656AC382D3E6F1"
signType:"MD5"
timeStamp:"1481167418"

5.小程序demo：

  const wechatData = payRes.data.payment;//wechatData就是上面的验证信息
  console.log(wechatData);
  wx.requestPayment({
    "appId" : wechatData.appId,
    "timeStamp": wechatData.timeStamp,
    "nonceStr": wechatData.nonceStr,
    "package": wechatData.package,
    "signType": "MD5",
    "paySign": wechatData.paySign,
  "success":function(res){
    console.log(res);
    console.log("success");
  },
  "fail":function(res){
    console.log(res);
    console.log("fail");
  },
  "complete": function(res){
    console.log(res);console.log("complete");
  }
});
console.log(2);

6.测试

开启校验请求域名与AppID配置，点击预览使用真机测试，开发工具不会响应发起支付的接口。

混合云超融合服务器微信小程序支付微信小程序免费开发微信小程序怎样开发微信小程序的开发

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/22147.html

从零开始：微信小程序新手入门宝典《一》

摘要：为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习一微信小程序的特点张小龙张小龙全面阐述小程序，推荐通读此文小程序是一种不需要下载安装即可使用的应用，它出现了触手可及的梦想，用户扫一扫或者搜一下即为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习；一：微信小程序的特点张小龙：张小龙全面阐述小程...

whataa 2019-07-25 11:18 评论0 收藏0
从零开始：微信小程序新手入门宝典《一》

摘要：为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习一微信小程序的特点张小龙张小龙全面阐述小程序，推荐通读此文小程序是一种不需要下载安装即可使用的应用，它出现了触手可及的梦想，用户扫一扫或者搜一下即为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习；一：微信小程序的特点张小龙：张小龙全面阐述小程...

mdluo 2019-08-21 15:02 评论0 收藏0
从零开始：微信小程序新手入门宝典《一》

摘要：为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习一微信小程序的特点张小龙张小龙全面阐述小程序，推荐通读此文小程序是一种不需要下载安装即可使用的应用，它出现了触手可及的梦想，用户扫一扫或者搜一下即为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习；一：微信小程序的特点张小龙：张小龙全面阐述小程...

yearsj 2019-08-05 10:38 评论0 收藏0
从零开始：微信小程序新手入门宝典《一》

摘要：为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习一微信小程序的特点张小龙张小龙全面阐述小程序，推荐通读此文小程序是一种不需要下载安装即可使用的应用，它出现了触手可及的梦想，用户扫一扫或者搜一下即为了方便大家了解并入门微信小程序，我将一些可能会需要的知识，列在这里，让大家方便的从零开始学习；一：微信小程序的特点张小龙：张小龙全面阐述小程...

LdhAndroid 2019-08-14 17:08 评论0 收藏0
10行代码实现小程序支付功能！丨实战

摘要：前面给大家讲过一个借助小程序云开发实现微信支付的，但是那个操作稍微有点繁琐，并且还会经常出现问题，今天就给大家讲一个简单的，并且借助官方支付实现小程序支付功能。只需要一个简单的云函数，就可以轻松的实现微信小程序支付功能。前面给大家讲过一个借助小程序云开发实现微信支付的，但是那个操作稍微有点繁琐，并且还会经常出现问题，今天就给大家讲一个简单的，并且借助官方支付api实现小程序支付功能。...

SimpleTriangle 2019-08-26 10:48 评论0 收藏0