# 8、打开外部链接
审批里面有很多打开外部链接的场景，有当前容器打开，也有唤起端上打开形式。
# 内部 webview 容器打开
该场景需要使用到基础组件 webview，需要使用请仔细阅读说明文档。
项目中添加一个 app-webview 页面
<template>
<view class="app-container">
<web-view v-if="src" :src="src"></web-view>
<app-loading v-else />
</view>
</template>
<script>
/**
* webview 打开三方网页
*/
export default {
data() {
return {
src: ''
}
},
onLoad(option) {
this.src = `${option.url}`
if (option.title) {
bz.setNavigationBarTitle({ title: option.title })
}
}
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
在需要打开三方页面的地方，跳转到该页面路由即可
bz.navigateTo({
url: `/pages/app-webview/index?title=数据导出&url=${encodeURIComponent(thirdLink)}`
})
1
2
3
2
3
注意： web-view 组件的特性，需要配置可信域名，否则将被安全拦截
先前往开发者后台配置网页的可信域名：
注意：web-view 组件打开的容器，与 BossHi 是隔离的，即内部 h5 不能使用 jsSDK 调用端上的能力
# 端上打开形式
为了不受上面束缚，也可以选择使用端上打开的形式。 此时我们需要借助的基础能力是 API openSchema。
目前该 API 只支持 AppLink 的链接，我们封装好 AppLink url 后，传入 openSchema , 即可让端上执行 AppLink 的逻辑。
移动端可新开一个 webview 打开该 url , PC 端可侧边栏打开该 url；也可以创建一个独立窗口打开该 url。
具体 AppLink 的能力可参看 applink访问指定URL
注意： pc 端需要区分 qa 环境和正式环境的 applink 域名