一、支付模式
微信提供付款码支付、Native支付、JSAPI支付、APP支付、H5支付、小程序支付、刷脸支付共7种支付模式，其中Native支付是指生成支付二维码扫码支付，JSAPI支付是用户在微信中打开商户H5页面时调用JSAPI接口完成支付，H5支付是支持用户在微信浏览器外完成支付，详见https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=2_1文档
二、开发流程
1、JSAPI支付
接入前准备：根据https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3文档完成相关配置
业务路程图：
前端开发：
页面中判断WeixinJSBridge对象是否初始化完成(未完成监听WeixinJSBridgeReady事件)，调用WeixinJSBridge对象的invoke方法调起微信支付，发起发起支付；其中invoke方法接收的getBrandWCPayRequest参数对象列表需由后端提供appId(公众号id)、timeStamp(时间戳)、nonceStr(随机字符串)、package(订单详情扩展字符串)、signType(签名方式)、paySign(签名)，参考代码截图：
2、Native支付
业务路程图：
前端开发：
由商户后台系统先调用微信支付的统一下单接口，微信后台系统返回链接参数code_url(有效期为2小时)，商户后台系统将code_url值生成二维码图片，前端对该二维码进行展示并向商户后台系统进行轮询用户支付结果，成功关闭二维码图的展示并跳转支付成功页面，注意用户关闭页面时也当停止轮询，参考代码截图：
3、H5支付
申请入口：登录商户平台-->产品中心-->我的产品-->支付产品-->H5支付
业务路程图：
前端开发：
由商户后台系统调用微信支付接口下单，微信支付后台系统返回跳转url，商户后台系统返302消息，前端根据url进行跳转支付。其中可在跳转url后附加redirect_url参数，来指定回调页面。参考代码截图：
4、小程序支付
接入前准备：根据https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_11&index=2完成相关配置
业务路程图：
前端开发：
小程序端提供了支付API：wx.requestPayment(OBJECT)发起微信支付，接收的参数OBJECT列表同JSAPI支付，由后端提供appId(公众号id)、timeStamp(时间戳)、nonceStr(随机字符串)、package(订单详情扩展字符串)、signType(签名方式)、paySign(签名)。参考代码截图：
5、APP支付
APP端开发步骤：https://pay.weixin.qq.com/wiki/doc/api/app/app.php?chapter=8_5
业务路程图：
前端开发：
商户APP调用微信提供的SDK调用微信支付模块，商户APP会跳转到微信中完成支付，支付完后跳回到商户APP内，最后展示支付结果。案例参考：https://pay.weixin.qq.com/wiki/doc/api/app/app.php?chapter=8_5，付代码截图：
IOS：
Android：
三、采用微信JS-SDK开发
1、简介：
微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。
通过使用微信JS-SDK，网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力，同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力，为微信用户提供更优质的网页体验。
2、开发步骤：
绑定域名：登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”
引入JS文件：http://res.wx.qq.com/open/js/jweixin-1.0.0.js
通过config接口注入权限验证配置：将需要完成支付功能的页面url传到后端换取appId(公众号的唯一标识)、timestamp(签名的时间戳)、nonceStr(签名的随机串)、signature(signature)后与debug(是否开启调试模式)、jsApiList(需要使用的JS接口列表)完成权限验证配置
通过ready接口处理：config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。
3、备注：
所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用
4、案例参考：
参考代码截图：
封装config接口注入权限验证配置过程
实例化
wx.chooseWXpay吊起支付，该接口所需参数同JSAPI支付，由商户后台系统提供
四、商户系统后台接入API列表：
https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=9_1
五、参考文档
1、各端获取openid方式
网页授权获取用户openid：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html
小程序获取openid：https://developers.weixin.qq.com/miniprogram/dev/api/open-api/login/wx.login.html
公众号获取openid：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html
APP获取openid：https://developers.weixin.qq.com/doc/oplatform/Mobile_App/WeChat_Login/Authorized_API_call_UnionID.html
2、微信支付开发文档
https://pay.weixin.qq.com/wiki/doc/api/index.html
