记录Uniapp使用webView和uni路由联动问题

1,147 阅读1分钟

问题叙述:

使用uniapp开发需求要使用webview跳转到外部链接进行一些列操作。完成后需要再次回跳到uni的路由中的某个页面。直接使用uni.navigateTo是跳转不回来的。

应用场景:

我的项目使用了阿里的金融级实人认证“PC或移动端H5网页接入”;APP嵌入uni开发的wgt小程序,需要使用webview访问H5。和H5使用一套。

解决办法:

在index.html中需要引入uni.webview.js

<!-- 需要把 uni.webview.1.5.4.js 下载到自己的服务器 -->
<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>

然后再需要使用到uni.webview的地方进行判断就好了。示例如下:

// 使用uni.webView.getEnv函数判断使用环境。
uni.webView.getEnv(function(res) {
    console.log('当前环境:' + JSON.stringify(res));
    if(res.plus){
        // 当前环境:{"plus":true}
        setTimeout(()=>{
            // 使用uni.webview方法进行跳转回uni的路由页面
            uni.webView.switchTab({
                url: '/pages/user/my' 
            });
        },500);
    }else{
        // 当前环境:{"h5":true}
        setTimeout(()=>{
            uni.switchTab({
                url: '/pages/user/my' 
            });
        },500);
    }
});

参考资料:ask.dcloud.net.cn/article/id-…