小程序 webview 中的h5页面,跳转小程序的某一个页面

556 阅读1分钟

微信小程序

一、引入 JS-SDK

JS-SDK说明文档

通过 script 标签引入

在框架里面的html页面里引入js文件
在需要调用 JS 接口的页面引入如下 JS 文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.6.0.js
如需进一步提升服务稳定性,当上述资源不可访问时,可改访问:http://res2.wx.qq.com/open/js/jweixin-1.6.0.js (支持https)。

在uniapp实践中通过 script 标签引入 没有效果,推荐使用 npm 进行引入。

二、通过 npm 导入(推荐)

jweixin-module

1、安装 jweixin-module (不能在vue3中使用)

npm install jweixin-module --save

2、在 main.js 中引入 jweixin-module

// 在vue3.x中,会编译报错:require is not defined,没有require模块,改成import的话,由于jweixin-module不支持export写法,所以引入也不能成功。
const jweixin = require("jweixin-module");
Vue.prototype.$wx = jweixin; // 挂到prototype上,方便直接使用

3、在 在页面中使用 SDK 中的API

wx.miniProgram 文档

this.$wx.miniProgram.reLaunch({
    url: redirectToUrl,
})
weixin-js-sdk

1、安装 jweixin-module (不能在vue3中使用)

npm install weixin-js-sdk --save

weixin-js-sdk使用总结

支付宝小程序

引入 JS-SDK

JS-SDK说明文档

通过 script 标签引入

1、在index.html文件中引入

<script type="text/javascript" src="https://appx/web-view.min.js"></script>

如该 H5 页面需要同时在非 mPaaS 客户端内使用,为避免该请求 404,可参考以下写法 // 请尽量在 html 头部执行以下脚本

<script> 
    if (navigator.userAgent.indexOf('AlipayClient') > -1) {
        document.writeln('<script src="https://appx/web-view.min.js"' + '>' + '<' + '/' + 'script>');
    }
</script>

2、在 在页面中使用 SDK 中的API

wx.miniProgram 文档

    window.my.reLaunch({
        url: redirectToUrl,
    })
});