HarmonyOS webview组件跨域问题

webview不支持本地html调用远程服务接口，https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/web-cross-origin-V5 提供的解决方案无法解决在url地址后面带参数问题。比如要打开的页面为本地的页面index.html，需要在url后面追加参数a=1&b=2,则完整的本地url地址为index.html?a=1&b=2，通过上述方案无法拿到a=1&b=2

HarmonyOS

shlp

2025-01-09 17:51:56

647浏览

回答 1

按赞同

按时间

put_get

可以将文件放在resfile目录下，参考下方demo，设置允许跨域访问的目录。

文档链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-webview-V5#setpathallowinguniversalaccess12

// xxx.ets
import { webview } from '@kit.ArkWeb';
import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct WebComponent {
  controller: WebviewController = new webview.WebviewController();

  build() {
    Row() {
      Web({ src: "resource://resfile/index.html?id=1&name=222", controller: this.controller })
        .onControllerAttached(() => {
          try {
            // 设置允许可以跨域访问的路径列表
            this.controller.setPathAllowingUniversalAccess([
              getContext().resourceDir,
              getContext().filesDir + "/example"
            ])
            // this.controller.loadUrl("file://" + getContext().resourceDir + "/index.html")
          } catch (error) {
            console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
          }
        })
        .javaScriptAccess(true)
        .fileAccess(true)
        .domStorageAccess(true)
    }
  }
}


<!-- main/resources/resfile/index.html -->
  <html>
  <head>
  <meta name="viewport" content="width=device-width,initial-scale=1">
  </head>
  <body>
  <script crossorigin src="./js/script.js"></script>
  </body>
  </html>


  // main/resources/resfile/js/script.js
  const body = document.body;
const element = document.createElement('div');
element.textContent = 'success';
body.appendChild(element);
let p=window.location.search
console.info('Parameter:'+p)
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.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.

2025-01-09 19:55:10

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

HarmonyOS webview组件跨域问题

订阅鸿蒙技术特刊，精选内容抢先看