小程序实现h5页面的微信支付

您所在的位置:网站首页 h5支付页面 小程序实现h5页面的微信支付

小程序实现h5页面的微信支付

#小程序实现h5页面的微信支付| 来源: 网络整理| 查看: 265

小程序实现h5页面的微信支付 浏览量:2251 时间:2019-12-25 来源:chen_pan_pan

项目需求:

由于小程序的热度高涨,公司为了引流,又想降低研发成本,所以将原先的H5项目嵌套在现在的小程序中。

之前的h5项目虽然实现了微信支付,但是嵌套之后小程序无法直接使用之前的h5支付功能。为了达到兼容,因为支付页面是同一个,所以项目必须同时兼容两个支付,一个是原本h5项目的支付能正常使用,另一个是当在小程序中点击支付的时候调用小程序自己的支付功能。

 

实现思路:

先判断h5的加载环境,如果是普通的浏览器则默认使用h5的支付方式,如果是小程序环境,则使用小程序自己的支付。

如果不清楚webview和小程序之间的跳转请看:https://blog.csdn.net/chen_pan_pan/article/details/80332473 。

小程序的支付逻辑:

1、通过wx.login获取到临时的code,

2、然后通过code和appid和appkey去获取openid。【注意这里的appid和appkey指的是小程序】

3、通过openid和一些其他的订单参数去调用微信的统一下单接口。

【可能大家为疑惑为啥要获取openid呢,因为小程序中的支付是通过trade_type=JSAPI的方式去实现的。】

4、调用了完统一下单接口之后微信会返回一些参数给你,这个时候你要拿这些参数进行一个二次签名,然后再返回到小程序。

代码实现:

    小程序代码:

小程序 点击这里免费试用,快速创建您的专属小程序 标签: 微信小程序 小程序 小程序是什么

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至[email protected] ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3