小程序与H5页面相互跳转

科技前沿 • 2025-03-05 17:40 • 阅读 50

大家好，我是讯享网，很高兴认识大家。

业务场景：A小程序在做业务时需要到B网站去做授权签合同，签完合同后需要从B网站回到A小程序

1、在A小程序端，使用web-view标签进行网页跳转。web-view标签中还有其他属性可参照：微信官方文档web-view

index.wxml <view> <web-view src="{ 
  
    
  {url}}"></web-view> </view> index.js onLoad: function (options) { this.setData({ url: 'xxxxx?token=' + token,// 可在url后携带所需的参数 }); },

讯享网

2、在B网站的H5端，引用jssdk，可使用sdk中提供的接口完成从H5页面回到小程序的任意页面。除了下面列举的方法，可打开上方的官方文档，还有一些其他方法可以使用。

讯享网// <script type="text/javascript" src="https://res.wx..com/open/js/jweixin-1.3.2.js"></script> 引用相关js即可使用下方方法 // javascript // 回到小程序的任意页面，但不能是tabBar定义的页面 wx.miniProgram.navigateTo({url: '/path/to/page'}) // 此方法只能回到tabBar定义的页面，其他页面无法用该方法实现跳转 wx.miniProgram.switchTab({url: '/path/to/page'}) // 此方法是H5向小程序跳转时携带参数 wx.miniProgram.postMessage({ data: 'foo' }) wx.miniProgram.postMessage({ data: {foo: 'bar'} })

3、在开发阶段，使用微信开发者工具进行开发版联调时，可打开不校验业务域名的校验，实现跳转完成联调。使用体验版小程序时，可点击右上角三个点，选择打开调试模式即可，这样就不校验业务域名了。

讯享网