HarmonyOS 鸿蒙Next中web加载前端页面怎么跳过安全证书验证

本地资源替换使用Web组件拦截请求。通过onInterceptRequest拦截请求，将远程资源替换为本地预置内容，规避证书验证。

import { webview } from '@kit.ArkWeb';

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

  schemeMap = new Map([
    ["https://your-domain.com/index.html", "local/index.html"],
    ["https://your-domain.com/script.js", "local/script.js"]
  ]);

  build() {
    Column() {
      Web({
        src: "https://your-domain.com/index.html",
        controller: this.controller
      })
      .onInterceptRequest((event) => {
        if (event && this.schemeMap.has(event.request.url)) {
          const localPath = this.schemeMap.get(event.request.url);
          return webview.WebResourceResponse.createWithFilePath(
            localPath,
            "text/html"
          );
        }
        return null;
      })
    }
  }
}

动态加载使用RCP模块跳过验证。通过@kit.RemoteCommunicationKit的SecurityConfiguration配置跳过证书验证，动态获取页面内容后注入Web组件。

import { rcp } from '@kit.RemoteCommunicationKit';
import { webview } from '@kit.ArkWeb';

async function loadUrlWithSkipSSL(url: string): Promise<string> {
  const client = rcp.createHttpClient();
  const config: rcp.HttpClientOptions = {
    securityConfig: {
      remoteValidation: 'skip'
    }
  };
  const request: rcp.HttpRequest = {
    method: rcp.RequestMethod.GET,
    url: url
  };
  const response = await client.request(request, config);
  return response.result.toString();
}

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

  build() {
    Column() {
      Web({
        src: $rawfile("blank.html"),
        controller: this.controller
      })
      .onPageBegin(() => {
        loadUrlWithSkipSSL("https://your-domain.com").then(html => {
          this.controller.executeJavaScript(`document.write('${html}')`);
        });
      })
    }
  }
}