HarmonyOS 鸿蒙Next中webview加载本地html白屏

HarmonyOS 鸿蒙Next中webview加载本地html白屏

以上为html文件，存放位置为rawFile

以下为web设置，基本上能开的全开了，加载依旧白屏

.fileAccess(true) .multiWindowAccess(true) .mixedMode(MixedMode.All) .onlineImageAccess(true) .domStorageAccess(true) .geolocationAccess(true) .cacheMode(CacheMode.Default) .overScrollMode(OverScrollMode.ALWAYS) .zoomAccess(true) .geolocationAccess(true) .databaseAccess(true)


更多关于HarmonyOS 鸿蒙Next中webview加载本地html白屏的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

这边文件完全用的你的html，页面不是空白。真机和模拟器我都试过是正常的。

import { webview } from '@kit.ArkWeb';
@Entry
@Component
struct Index {
  controller: webview.WebviewController = new webview.WebviewController();
  build() {
    Column(){
      Web({ src: $rawfile('index.html'), controller: this.controller })
        .fileAccess(true)
        .multiWindowAccess(true)
        .mixedMode(MixedMode.All)
        .onlineImageAccess(true)
        .domStorageAccess(true)
        .geolocationAccess(true)
        .cacheMode(CacheMode.Default)
        .overScrollMode(OverScrollMode.ALWAYS)
        .zoomAccess(true)
        .geolocationAccess(true)
        .databaseAccess(true)
    }
  }
}

更多关于HarmonyOS 鸿蒙Next中webview加载本地html白屏的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


鸿蒙Next中WebView加载本地html白屏问题可能原因及解决方案：

  1. 文件路径问题：确保html文件放在entry/src/main/resources/rawfile目录下，使用"resource://rawfile/xxx.html"格式加载。

  2. 权限配置：在module.json5中确认已申请ohos.permission.INTERNET权限。

  3. 加载方式：应当使用loadUrl()而非load()方法加载本地资源。

  4. WebView配置：检查是否设置了必要的WebConfig参数，如enableJavaScript等。

  5. 文件编码：确认html文件使用UTF-8编码格式。

在HarmonyOS Next中WebView加载本地HTML出现白屏问题，可能由以下原因导致：

  1. 文件路径问题：
  • 确保使用正确的资源路径格式：resource://rawfile/文件名
  • 检查文件名大小写是否匹配（HarmonyOS对大小写敏感）
  1. 权限配置缺失：
  • 需要在config.json中添加网络权限：
"reqPermissions": [
  {
    "name": "ohos.permission.INTERNET"
  }
]
  1. WebView初始化时机：
  • 确保在Web组件挂载完成后加载内容，可在aboutToAppear或onPageShow生命周期中执行
  1. 内容安全策略限制：
  • 尝试在HTML头部添加：
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'">
  1. 调试建议：
  • 启用WebView调试：
webController.setWebDebuggingAccess(true)
  • 检查控制台错误日志

如果问题仍然存在，建议检查HTML文件是否完整，特别是闭合标签是否正确。可以尝试先加载一个简单的HTML测试文件确认基础功能是否正常。

回到顶部