一、介绍

今天跟大家分享微信小程序集成支付。

二、分析

1、小程序支付API

地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-pay.html#wxrequestpaymentobject

注释:

通过接口的查看,我们知道,小程序端要想使用支付的接口,必须要拿到相应的值

timeStamp:Linux时间戳,可获取本地时间。

nonceStr:随机字符串,从服务器统一下单接口返回。

package:统一下单接口返回的prepay_id参数值,发送提交时格式‘prepay_id=*’

signType:算法签名直接写MD5

paySign:签名,签名算法。签名必须严格按按照如下规则进行签名,注意一定拼接上key,关于key后面再说。

举例:paySign = MD5(appId=wxd678efh567hg6787&nonceStr=5K8264ILTKCH16CQ2502SI8ZNMTM67VS&package=prepay_id=wx2017033010242291fcfe0db70013231072&signType=MD5&timeStamp=1490840662&key=qazwsxedcrfvtgbyhnujmikolp111111) = 22D9B4E54AB1950F51E0649E8810ACD6

2、微信支付接口

虽然我们已经查看了小程序的支付接口,但是到此时,我们还是不知道这些参数怎么得来,接下来我们选择支付接口中的了解更多信息,查看微信支付接口文档。

打开后,我们可以看到如下的截图。

第一步:开发步骤:

地址:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_3&index=1

从上面我们得到的有用信息是:

1)小程序支付跟JSAPI和JSSDK很相似

2)统一下单,都需要首先获取到Openid,调用相同的API,通过下面的我们的得知是https://api.mch.weixin.qq.com/pay/unifiedorder

3)调起支付页面协议,小程序只支持HTTPS,

4)注意点,支付目录和授权域名,小程序都是无。

5)小程序的回调函数

第二步:业务流程

地址:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=2

分析上面的时序图,

1)用户进入小程序,通过小程序发送下单支付请求,到我们的商户系统。

过程拆解:商户系统可以理解为我们自己的商户服务器,存放我们服务器的代码,这个过程就是,用户发送一个请求到我们自己的服务器,参数就是商品的一些信息。

2)服务器调用小程序登录API,微信服务器后台返回openid,商户服务器生成订单,调用统一下单API,返回预付单信息(prepay_id),将组合再次签名。

过程拆解:我们自己的商户服务器,调用微信登录的API,这时候从微信的服务器拿到用户的openid,拿到openid之后,我们自己的服务器要组合生成一条订单,通过过程1发送过来的商品信息,组合生成一条订单(可以参看统一下单API所需的参数),然后调用统一下单API,这时候微信服务器就返回给了我们prepay_id,我们自己的服务器通过再次签名,可以拿到五个参数和sign

3)返回支付参数(5个参数和sign),小程序中发起下单请求到我们商户服务器,这时候就可把相应的把小程序支付API需要的信息都返回给我们的小程序了。

4)调用wx.requestPayment,按照规则传入我们需要的信息。

5)后面就是支付成功失败的回调和显示了。

三.服务器代码分析

1、总览

服务器demo下载地址:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=11_1

微信支付开发文档:https://pay.weixin.qq.com/wiki/doc/api/index.html

证书下载地址:商户平台下载证书,账户中心->账户设置->API安全 下载证书&设置秘钥

这里的秘钥就是最开始说的key。

2、代码结构,以PHP为例(WxpayAPI_php_v3)

SDK目录结构

|-- cert

|   |-- apiclient_cert.pem

|   `-- apiclient_key.pem

|-- download.php

|-- index.php

|-- lib

|   |-- WxPay.Api.php

|   |-- WxPay.Config.php

|   |-- WxPay.Data.php

|   |-- WxPay.Exception.php

|   `-- WxPay.Notify.php

|-- logs

|   |-- 2015-03-06.log

|   `-- 2015-03-11.log

|-- micropay.php

|-- native.php

|-- native_notify.php

|-- notify.php

|-- orderquery.php

|-- qrcode.php

|-- refund.php

|-- refundquery.php

|-- unifiedorder.php

`-- unit

|-- WxPay.JsApiPay.php

|-- WxPay.MicroPay.php

|-- WxPay.NativePay.php

|-- log.php

`-- phpqrcode

目录功能简介

lib

API接口封装代码

WxPay.Api.php 包括所有微信支付API接口的封装

WxPay.Config.php  商户配置

WxPay.Data.php   输入参数封装

WxPay.Exception.php  异常类

WxPay.Notify.php    回调通知基类

cert

证书存放路径,证书可以登录商户平台https://pay.weixin.qq.com/index.php/account/api_cert下载

unit

工具类

unit/phpqrcode

开源二维码php代码

logs

日志文件

3、配置指南

MCHID = '1225312702';

这里填开户邮件中的商户号

APPID = 'wx426b3015555a46be';

这里填开户邮件中的(公众账号APPID或者应用APPID或者小程序APPID)

KEY = 'e10adc3949ba59abbe56e057f20f883e'

这里请使用商户平台登录账户和密码登录http://pay.weixin.qq.com 平台设置的“API密钥”,为了安全,请设置为32字符串。

APPSECRET = '01c6d59a3f9024db6336662ac95c8e74'

改参数在JSAPI支付(open平台账户不能进行JSAPI支付)的时候需要用来获取用户openid,可使用APPID对应的公众平台登录http://mp.weixin.qq.com的开发者中心获取AppSecret。小程序后台获取小程序的AppSecret。

四、效果

点击支付后,会弹出二维码,用相应的微信扫描二维码,即可完成支付。

如有任何问题可加入微信小程序QQ群(418177552)咨询

【微信小程序】支付过程详解的更多相关文章

  1. 微信支付之扫码、APP、小程序支付接入详解

    做电商平台的小伙伴都知道,支付服务是必不可少的一部分,今天我们开始就说说支付服务的接入及实现.目前在国内,几乎90%中小公司的支付系统都离不开微信支付和支付宝支付.那么大家要思考了,为什么微信支付和支 ...

  2. 微信小程序开发之详解生命周期方法

    生命周期是指一个小程序从创建到销毁的一系列过程 在小程序中 ,通过App()来注册一个小程序 ,通过Page()来注册一个页面 先来看一张小程序项目结构 从上图可以看出,根目录下面有包含了app.js ...

  3. 微信小程序的配置详解

    1.配置详解: 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. 1>pages 接受一个数组,每一项都是字符串,来指定小 ...

  4. 微信小程序 生命周期函数详解

    微信小程序 生命周期函数 小程序中 判断当前首页是从其他页面返回,还是由入口打开 由于小程序的数据在我们退出小程序时并没有得到释放,因此再次点击开来数据依然没有变成初始化 解决方法:在小程序 data ...

  5. 微信小程序开发者工具详解

    一.微信小程序web开发工具下载地址 1.1 在微信公众平台-小程序里边去下载开发工具下载地址. 1.2 下载后安装一下就可以使用了: 二.创建项目 2.1 微信小程序web开发工具需要扫码登陆,所以 ...

  6. 微信小程序wxss样式详解

    一.wxml 界面结构wxmL比较容易理解,主要是由八大类基础组件构成: 一.视图容器(View Container): 二.基础内容(Basic Content) 组件名 说明 组件名 说明 vie ...

  7. 微信小程序 Mustache语法详解

    最近微信小程序非常火,对于前端开发的程序员是个利好的消息,这里主要记录下微信小程序  Mustache语法. 小程序开发的wxml里,用到了Mustache语法.所以,非常有必要把Mustache研究 ...

  8. 微信小程序页面传值详解

    我们知道,在微信小程序中,从一个页面转到另一个页面,一般情况下可以通过navigate或redirect时候的url来携带参数,然后在目标页面的onLoad函数参数中获取这些url参数.例如:   / ...

  9. 微信小程序的登陆流程详解

    由于小程序的登陆和登陆状态维护流程比较复杂,需要客户端和服务器的数次交互以及服务器端的相应处理,很多同学都觉得比较麻烦,所以特别写下这篇博客为大家梳理一下微信的登陆流程,同时加深对微信小程序与登陆状态 ...

  10. 微信小程序生命周期详解

    文章出处:https://blog.csdn.net/qq_29712995/article/details/79784222 在我看来小程序的生命周期虽然简单,但是他渗透了小程序开发的整个过程,对于 ...

随机推荐

  1. PHP过滤器

    这里介绍的过滤器包括: 1.filter_input 2.filter_input_array 3.filter_var 4.filter_var_array 5.filter_has_var 一.查 ...

  2. Aeroo Reports Linux server

    This article covers installation process for Aeroo reporting engine on Linux servers. If you find th ...

  3. [Swift A] - HTTP请求

    iOS开发中大部分App的网络数据交换是基于HTTP协议的.本文将简单介绍在Swift中使用HTTP进行网络请求的几种方法. 注意:网络请求完成后会获得一个NSData类型的返回数据,如果数据格式为J ...

  4. ASP.Net MVC3/4中Model验证错误信息的本地化

    最近使用ASP.Net MVC4做一个B/S的管理系统,里面有N多的Action和View Model,View Model上又有N多的验证. 一开始写的时候虽然知道要实现多语言,但是没有过多考虑,本 ...

  5. bootstrap学习笔记 多媒体对象

    本文将介绍Bootstrap中的多媒体对象(Media Object).这些抽象的对象样式用于创建各种类型的组件(比如博客评论),我们可以在组件中使用图文混排,图像可以左对齐或者右对齐.媒体对象可以用 ...

  6. IDEA部署Tomcat应用所有接口中文乱码

    解决问题的思路: 1.分析比对http请求头,contentType等设置 2.前段编码,后端解码,这个方式比较落麻烦,凡是有中文乱码的地方都要进行解决 3.修改Tomcat的默认编码,tomcat8 ...

  7. jquery easyUi columns日期格式化

    jquery easyUi  columns日期格式化 方法一 Date.prototype.format = function (format) { var o = { "M+" ...

  8. php分页插件

    前台调用样式<?php include_once('page.class.php');?><link rel="stylesheet" type="te ...

  9. LayerMask小结

    layerMask参数: Raycast (ray : Ray, out hitInfo : RaycastHit, distance : float = Mathf.Infinity, layerM ...

  10. [k8s]kubectl windows配置(kubernetic) && kubectl config set-context使用Kubernetic

    参考: https://feisky.gitbooks.io/kubernetes/components/kubectl.html https://kubernetes.io/docs/tasks/t ...