在小程序开发中，常需实现用户点击课程或资料跳转到内部学习系统或外部网站的需求。但小程序禁止直接用 <a> 标签跳转外部网页，也不能像浏览器那样用 window.open。本文将结合实际项目，介绍两种常见方案。
背景：小程序的安全限制
微信对小程序的外部链接有严格限制，只能通过 <WebView /> 组件来加载 H5 页面。该 H5 的域名必须提前在小程序后台的开发设置中配置为业务域名，未配置的域名一律无法打开。因此，解决问题的第一步是确认目标链接的域名是否可控以及能否添加到业务域名列表中。
方案一：业务域名 + WebView
如果域名可控，实现较为简单。
1. 后台配置业务域名
在微信公众平台 → 开发管理 → 开发设置里，将外部系统的域名添加到「业务域名」列表中。
2. 封装 Webview 页面
新建一个 pages/webview/index.tsx 页面：
import { WebView } from '@tarojs/components'
import { useRouter } from '@tarojs/taro'
export default function WebviewPage() {
const router = useRouter()
const { url } = router.params
// 从路由参数里取出外部链接
return (
<WebView src={decodeURIComponent(url || '')} />
)
}
3. 点击跳转时传递外部链接
在业务页面中，比如课程列表：
Taro.navigateTo({
url: `/pages/webview/index?url=${encodeURIComponent(course.link)}`
})
这样就能在小程序里「无缝」打开外部网页，用户体验和原生浏览器几乎一样。
方案二：域名不可控 → 自动复制链接
有些情况，外部系统的域名是公司内网的，根本没法加到微信后台的「业务域名」里。这时 WebView 打不开，只能换个思路：点击课程 → 直接复制链接 → 提示用户去内网环境手动打开。
实现也很简单，用 Taro 的 setClipboardData：
