HarmonyOS 鸿蒙Next Web组件无法加载链接,而鸿蒙内置浏览器/安卓/IOS都正常
HarmonyOS 鸿蒙Next Web组件无法加载链接,而鸿蒙内置浏览器/安卓/IOS都正常
如以下代码所示,无法加载链接。显示有标题和作者,但下方为空屏https://mp.weixin.qq.com/s/wEzl1mPVVfAj9IlBPhyX9Q
/** * https://developer.huawei.com/consumer/cn/forum/topic/0201147433133377220?fid=0102683795438680754 */
// 导入HarmonyOS的Web视图组件
import web_webview from ‘@ohos.web.webview’;
// 定义基础网页组件
@Entry
@Component
export struct TestWebPage {
webController: web_webview.WebviewController = new web_webview.WebviewController();
build() {
Column() {
Web({
controller: this.webController, src: ‘https://baidu.com’,
// src: ‘https://mp.weixin.qq.com/s/wEzl1mPVVfAj9IlBPhyX9Q’,
}).width(‘100%’).height(‘100%’)
}
}
}
如果加载了http资源,浏览器将认为这是不安全的资源,将会默认阻止。
可以设置webview的加载模式为MixedMode.All,参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-web-V5#mixedmode
提供一个demo给你参考一下
标题和图片都有显示。
先确认module.json5里添加了ohos.permission.INTERNET权限
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct WebComponent {
controller: web_webview.WebviewController = new web_webview.WebviewController()
@State mode: MixedMode = MixedMode.All
build() {
Column() {
Web({ src: ‘https://mp.weixin.qq.com/s/wEzl1mPVVfAj9IlBPhyX9Q’, controller: this.controller })
.domStorageAccess(true)
.mixedMode(this.mode)
}
}
}
<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>