在 UniApp 的微信小程序端,由于平台安全限制,无法直接通过路由跳转外链(如 uni.navigateTo
跳转到 https://www.XX.com
)。但可以通过以下两种方式间接实现外链跳转:
web-view
组件(推荐)web-view
是小程序提供的网页容器组件,可以内嵌加载外链页面。
配置业务域名
外链域名需在微信小程序后台的 业务域名 中配置,否则无法加载。
登录微信公众平台 → 开发 → 开发设置 → 业务域名 → 添加域名(如 https://baidu.com
)。
下载校验文件并部署到域名根目录。
创建 web-view
页面
在项目中新建页面用于加载外链。
在 pages.json
中注册页面
{ "pages": [ { "path": "pages/webview/webview", "style": { "navigationBarTitleText": "加载中..." } } ] }
跳转到 web-view
页面
通过 uni.navigateTo
跳转,并传递外链地址参数:
// 在需要跳转的页面调用 const externalUrl = 'https://baidu.com'; uni.navigateTo({ url: `/pages/webview/webview?url=${encodeURIComponent(externalUrl)}` });
如果无法满足 web-view
的条件,可通过以下方式间接引导用户访问外链:
用户在小程序内联系客服,客服回复外链(用户需主动点击链接)。
// 打开客服会话 uni.navigateTo({ url: 'contact/contact' });
在公众号文章中插入外链,用户点击文章中的链接跳转。
// 跳转到公众号文章(需关联同一主体的公众号) uni.navigateToMiniProgram({ appId: '公众号AppID', path: 'pages/article/article?id=123' });