小程序内嵌webview实现支付

编程之家收集整理的这篇文章主要介绍了小程序内嵌webview实现支付编程之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

概述

青年码农 一个码农运营的公众号,佛系更新。 139篇原创内容 ...,下方主要介绍关于小程序内嵌webview实现支付的全文内容,希望对你有所帮助。

点击上方“青年码农”关注

回复特效源码”可获取各种资料

目前的一个小程序项目需要把客户之前的h5页面嵌入到现在的小程序中,并且之前的支付功能要正常。小程序提供了webvIEw开放能力供我们使用,但是不允许在webvIEw直接调起微信支付。因此只能另辟蹊径。我们今天来讲一讲。在小程序的webvIEw里实现微信支付功能

在webvIEw中不能支付,那只能把webvIEw嵌入h5页面的支付挪到小程序中,也就是把支付时的参数传给小程序小程序调起原生支付,这里面有两种情况,一种是同一主体的,另外一种是非同主体。

1.同主体

适用场景:同一主体下H5页面

前置条件:商户号已和小程序绑定

流程:H5内获取支付必须参数,传递给小程序小程序调用支付

[外链图片转存中…(img-ChUDSlgl-1652856799027)]

2.非同一主体

适用场景:第三方商品

前置条件:商户号已和小程序绑定

原理:由于第三方商品是内嵌第三方页面,需要传递当前小程序appID,结合第三方商户号等信息,调用微信统一下单接口,返回支付必须参数小程序内发起支付。

[外链图片转存中…(img-aN8hjqcz-1652856799028)]

接下来就是代码实现,webvIEw中src中配置网页链接参数的话,通过get方式传递

<web-vIEw src="xxx.com?name='zhangsan'"></web-vIEw>

h5页面可以直接在url中获取到,这里就不过多解释。拿到参数后可以处理其他逻辑,重点(需要后端配合),生成的支付参数要用小程序的方式,参数格式如下

timeStamp: '',nonceStr: '',package: '',signType: 'MD5',paySign: '',

拿到参数后,只需要在重新打开小程序页面即可,打开方式

[外链图片转存中…(img-pa6Uh0GW-1652856799028)]

let url = "../payPage/index?payParam="encodeURIComponent(JsON.stringify(payParam));
wx.miniProgram.navigateto({
  url: url
});

保险一点,我们用 encodeURIComponent 函数编码,通过这种方式,可以打开小程序,只需要在小程序对应页面中,接收参数调用支付即可

注意:记得在小程序页面用 decodeURIComponent 解码

非同一主体流程一样,只不过在用webvIEw的时候,把当前小程序的appID一同传过去,生成的支付参数要用传递过去的appID生成,这样才能在当前小程序支付。其他的也不多说,这都是一步一步调通并上线的项目,如果有不懂的可以留言。

总结

以上是编程之家为你收集整理的小程序内嵌webview实现支付全部内容,希望文章能够帮你解决小程序内嵌webview实现支付所遇到的程序开发问题。

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。

HTML文章

HTML邮件内容所在上下文或者说所在外部容器(以下简称环境)都是由邮箱服务商决定的,这就要求邮件内容需要在任何一种情况下都要正确显示。
HTML内容类型决定使用的语义标签,在网页中某种类型的内容必定需要某种特定的HTML标签来承载,也就是我们常常提到的根据你的内容语义化HTML结构。
HTML代码在书写的时候应该遵循什么规范?青岛星网今天跟大家分享:HTML的代码格式规范,希望大家都可以写出高质量的HTML代码。
青年码农 一个码农运营的公众号,佛系更新。 139篇原创内容 ...
better-scroll实现左侧导航点击,右侧内容滚动,或者右侧内容滑动,左侧导航联动
一、基本使用需求:有两个页面(A 和 B),当我们在页面A的table列表中点击查看详情按钮,跳转到B页面,在B页面点击返回时,要定位到之前A的列表位置, 不能刷新该页面。在 &lt;router-view /&gt; 的外层包一个 keep-alive 如:&lt;keep-alive include="pageA"&gt; &lt;router-view /&gt;&lt;/keep-alive&gt;其中 include 为要缓存的页面,如果有多个页面可用逗号隔开,pageA为.
WebviewObjectWebview窗口对象,用于操作加载HTML页面的窗口属性id:webview窗口的标识方法:监听addEventListener添加事件监听器wobj.addEventListener( event, listener, capture );参数说明:event: ( WebviewEvent ) 必选 Webview窗口事件类型liste...
1、Android调用H5(JS)1.1、新建assets资源目录并将准备好的HTML页面放入其中(真实项目中HTML页面放在Tomcat中启动)1.2、初始化webView并加载HTML页面 @SuppressLint({"SetJavaScriptEnabled", "AddJavascriptInterface"}) public void initWebView() { //可以加载网页和自定义浏览器 webView = new W
微信公众号搜索 “ 程序精选 ” ,选择关注!
微信公众号搜 "程序精选"关注