HarmonyOS鸿蒙Next中系统浏览器能访问局域网前端界面，APP内使用ArkWeb无法访问

HarmonyOS鸿蒙Next中系统浏览器能访问局域网前端界面，APP内使用ArkWeb无法访问

因为涉及到推流操作，需要使用srsAPI，所以srs和前端vue项目都配置了HTTPS，真机鸿蒙平板也安装了cert.pem证书

在同一局域网下，鸿蒙平板的浏览器能正常访问界面和推流，但app内ArkWeb无法访问

Web({
  src: 'https://xxx.xxx.xx.xxx:5173/webrtc',
  controller: this.controller
})


更多关于HarmonyOS鸿蒙Next中系统浏览器能访问局域网前端界面，APP内使用ArkWeb无法访问的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

使用DevTools调试工具，将arkweb映射到浏览器下，看下控制台报的什么错？

更多关于HarmonyOS鸿蒙Next中系统浏览器能访问局域网前端界面，APP内使用ArkWeb无法访问的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS Next中，系统浏览器能访问局域网前端界面而ArkWeb无法访问，通常由以下原因导致：

  • ArkWeb默认禁用非HTTPS请求；
  • ArkWeb未配置局域网访问权限；
  • ArkWeb的跨域限制比系统浏览器更严格。

解决方法：

  • 在config.json中配置"cleartextTrafficPermitted": true允许HTTP访问；
  • 为ArkWeb添加局域网权限；
  • 若涉及跨域，需服务端配置CORS头或使用代理。

系统浏览器有更宽松的安全策略，而ArkWeb遵循更严格的安全规范。

在HarmonyOS Next中，ArkWeb与系统浏览器的网络访问机制存在差异。针对您描述的HTTPS局域网访问问题，以下是关键点分析：

  1. 证书信任链差异：
  • 系统浏览器使用系统级证书存储，您安装的cert.pem证书已被识别
  • ArkWeb使用独立的网络栈，需通过代码显式配置证书信任：
import web from '@ohos.web.webview';

// 在WebController初始化时添加
this.controller.setWebSecurityConfig({
  certOverrideEnabled: true // 允许自签名证书
});
  1. 混合内容安全策略：
  • 检查前端项目是否引用了HTTP资源（如图片、脚本）
  • 在Web初始化时添加配置：
Web({
  src: 'https://xxx.xxx.xx.xxx:5173/webrtc',
  controller: this.controller,
  fileAccess: true, // 启用本地文件访问
  mixedMode: web.MixedMode.MIXED_CONTENT_COMPATIBILITY_MODE // 允许混合内容
})
  1. 网络权限检查： 确保manifest.json已声明：
"reqPermissions": [
  {
    "name": "ohos.permission.INTERNET"
  },
  {
    "name": "ohos.permission.ACCESS_NETWORK_STATE"
  }
]
  1. 调试建议：
  • 通过onError回调捕获具体错误：
this.controller.onError((err) => {
  console.error('WebView error:', JSON.stringify(err));
});

注意：真机调试时请保持开发者模式开启，并通过HiLog查看完整错误日志。

回到顶部