提示：本文章实现从0到1小程序内打开H5链接或跳转到某公众号文章，使用​​web-view​​组件就可以了。

文章目录

一、先配置链接的域名

进入到小程序后台 ​ ​https://mp./​​ 扫码登录，下滑找到业务域名。

文章这里以外部链接百度、微信公众号链接为例。

配置百度的域名（），

微信公众号链接的域名（https://mp.）

如果不配置域名或者域名配置不正确，会出现打不开接口问题。

不支持打开非业务域名,请重新配置。

二、代码实现

1、首先，在app.json中page[]中正常注册一个页面，用来放置 web-view 组件。

"pages": ["pages/webview/webview",],

例如我们注册一个webview页面，点击编译一下，webview页面就自动生成啦。

2、打开webview.js，逻辑代码如下

// pages/webview/webview.jsPage({/*** 页面的初始数据*/data: {// 需要跳转路径url: '', },/*** 生命周期函数--监听页面加载*/onLoad: function(options) {this.setData({url: options.url, // 从跳转页面中传过来的url在options中可以拿到});},OpenToURL() {var url = this.data.urlwx.navigateTo({// 注意路径 url: `/pages/webview/webview?url=${url}`})},});

3、打开webview.wxml

<!--pages/webview/webview.wxml--><view><button bindtap="OpenToURL">打开百度</button><web-view src="{{ url }}" bindload="bindload" binderror="binderror"/></view>

4、查看效果

5、同理，打开公众号文章只需要把webview.js中的url替换成公众号文章链接地址即可。