微信网页授权与微信H5支付

                 微信网页授权与微信H5支付

 

一、微信网页授权

    用户在点公众号里的链接时,让用户授权,并以此得到用户的更多信息

    完整的介绍见:

    https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842

    我这里只做一个流程说明。

1.  引导用户打开点击一个链接

    格式如下:


https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

2.  用户点击后会出现授权页面,如果用户同意授权,页面将跳转至redirect_uri/?code=CODE&state=STATE

    注意这个redirect_uri是自己设定的,一般会设置会自己的后台的某个地址。这个时候后台这个接口上就接收到了code,再去通过code换取网页授权access_token,如果scope为 snsapi_userinfo,再去拉取用户信息。

3.  这个时候就有几种选择了,我现在这边团队的做法是,再做一次重定向。这个重定向地址放在第1步的state里。当第2步执行完毕后,后台将state里的STATE取出(STATE是一个字符串,为一个网址),直接让用户的界面跳转到这个网址。同时在服务器端启用session.此session关联着第2步获取的用户信息。这样就记录进这个网页的用户到底是谁。

 

二、在微信公众号里的H5页面中调起微信支付

    详情见https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_1

    我这里只做一个关键点提示。

1.  设置支付目录

    https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3

    极其重要不设置目录不能调起支付接口。

2.  用户在前端产生支付事件(比如点击了支付按钮),前端向后端请求支付所需要数据。

3.  后端去获取支付所需要数据:

(1) 获取预订单信息(prepay_id)

    无论是公众号支付,还是二维码支付,还是任何其它支付方式,这一步是必须的。

    详情见:

    https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=9_1

    大致是:根据你的公众号相关信息、用户相关信息、商品相关信息,去获取一个prepay_id

    需要注意的是:交换格式是XML,并且有些字段需要在XML中注释掉

(2) 生成前端所需要的数据

    详情见:

    https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6

    主要是生成一个签名。

    这里就涉及成一个签名算法。详情见:

    https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=4_3

    需要注意的是:

    算法并不复杂,但是其中有些易错点。我只说正确的理解:

    传送的参数不需要转化为小写再生成签名。

    在签名生成过程中需要在最后拼接一个商户平台设置的密钥key

(3) 将这些参数全部传递给前端,前端通过这些参数调微信支付

    详情见:

    https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6

    需要注意的是:

    这里是使用的 function onBridgeReady(){}来调用的支付,这种方式并不能在微信开发者工具中调试,会报一个chooseWXPay:fail,the permission value is offline verifying的错误.

    所以其实是有两种方法去调用微信支付。这两种方法是等价的,只是调用形式不同而已。

    wx.chooseWXPay需要引入JSSDK,然后配置wx.config。没有验证过这种方法能不能在微信开发者工具中调试。

    只调用 function onBridgeReady(){}会简单一些,不需要引用JSSDK,但不能在微信开发者工具中调试。

    这个时候如果成功就会弹起支付框了,用户支付成功后,微信后端会向自己的前端的这个function onBridgeReady(){}返回一个值,并向自己的后端返回一个结果。这时自己的前端并不能根据微信返回的值作为判断依据,而是要再次向自己的后端请求是否支付成功来判断。

--ByPY

展开阅读全文

没有更多推荐了,返回首页