HarmonyOS 鸿蒙Next中H5的WebView注入cookie失效问题

想要在多个子域名中使用，需要在 cookie 中添加顶级域名的标志，例如 domain=baidu.com

web_webview.WebCookieManager.configCookieSync("example.com", "key=value; domain=baidu.com");

参考文档：

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

import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct WebviewCookie {
  webviewController: webview.WebviewController = new webview.WebviewController();

  aboutToAppear() {
    // 配置Web开启调试模式
    webview.WebviewController.setWebDebuggingAccess(true);
  }

  build() {
    Flex({ direction: FlexDirection.Column }) {
      Button('configCookieSync')
        .onClick(() => {
          try {
            // 仅支持设置单个cookie值。
            webview.WebCookieManager.configCookieSync("baidu.com", "key=value; domain=baidu.com");
          } catch (error) {
            console.error(`ErrorCode: ${(error as BusinessError).code}, Message: ${(error as BusinessError).message}`);
          }
        })
      Web({ src: 'http://www.baidu.com', controller: this.webviewController }).flexGrow(1).flexShrink(1).flexBasis(1)
    }
  }
}

按照这种方式测试一下，如果想要设置多个cookie， 需要单独使用 configCookieSync 逐条设置。

不支持 resource://rawfile/xxx/ 这种形式的 url。可以将其转为 http 使用。

可以参考：

1. 通过拦截主资源的方式解决 主资源请求改为 http 请求，拦截主资源，读取本地的文件返回给内核
2. 设置 cookie 的时候指定 samesite=none；secure 但是这种需要把 file 协议里发起的 http 请求改为 https，需要服务器支持。 示例代码如下

import webview from '@ohos.web.webview';

@Entry
@Component
struct MainPage {
  @State isLoading: boolean = true
  @State msg: string = ""
  controller: webview.WebviewController = new webview.WebviewController();

  aboutToAppear() {
    webview.WebviewController.setWebDebuggingAccess(true);
    webview.WebCookieManager.configCookieSync('https://www.ahahahah/index.html', ' samesite=non;');
  }

  build() {
    Row() {
      Column() {
        Button().onClick(() => {
          console.log('cookie为：' + webview.WebCookieManager.fetchCookieSync('https://www.ahahahah/index.html'))
        })
        Web({ src: "https://www.ahahahah/index.html", controller: this.controller })
          .javaScriptAccess(true)
          .domStorageAccess(true)
          .fileAccess(true)
          .onInterceptRequest((event) => {
            if (!event) {
              return;
            }
            let requestUrl: string = event.request.getRequestUrl();
            console.log('请求为：' + event.request.getRequestUrl())
            interface HtmlMimeType {
              type: string,
              mime: string
            }
            let typeArr: Array<HtmlMimeType> =
              [{ type: ".html", mime: "text/html" }, { type: ".js", mime: "text/javascript" },
              { type: ".css", mime: "text/css" }, { type: ".wasm", mime: "application/wasm" }];
            let isSearch: boolean = false;
            let searchTypeObj: HtmlMimeType;
            for (const typeObj of typeArr) {
              let index: number = requestUrl.lastIndexOf(typeObj.type);
              if (index > 0) {
                isSearch = true;
                searchTypeObj = typeObj;
                break;
              }
            }
            if (isSearch) {
              let rawfileName: string = requestUrl.replace("https://www.ahahahah/", "");
              let endIndex = rawfileName.indexOf("?");
              if (endIndex > -1) {
                //如果没去除，文件名会导致错误
                rawfileName = rawfileName.substring(0, endIndex);
              }
              let response = new WebResourceResponse();
              response.setResponseData($rawfile(rawfileName));
              response.setResponseEncoding('utf-8');
              response.setResponseMimeType(searchTypeObj!.mime);
              response.setResponseCode(200);
              response.setReasonMessage('OK');
              response.setResponseIsReady(true);
              return response;
            }
            return null;
          })
          .width('100%')
          .height('100%')
      }
    }
  }
}

H5 文件放在 rawfile 里面，它通过 web 加载出来的协议是 rsource，内核是设置不了 resource 协议链接的 cookie 的，所以需要通过拦截方法将加载的本地资源设置一个 https 协议的域名，这样就可以给它设置 cookie，也能解决本地资源中的 http 请求的跨域问题。设置 cookie 直接按照安卓那样的写法即可

在HarmonyOS鸿蒙Next中，H5的WebView注入cookie失效问题可能与以下因素有关：

1. 跨域问题：如果WebView加载的H5页面与cookie的域名不一致，可能会导致cookie注入失效。确保cookie的域名与H5页面的域名匹配。

2. Cookie路径：如果cookie的路径设置不正确，WebView可能无法正确识别和应用该cookie。检查并确保cookie的路径与H5页面的路径一致。

3. Cookie的Secure和HttpOnly属性：如果cookie设置了Secure或HttpOnly属性，可能会影响WebView对cookie的处理。确保这些属性设置符合实际需求。

4. WebView配置：WebView的配置可能影响cookie的注入。检查WebView的相关设置，确保其支持cookie的注入和处理。

5. 系统版本差异：不同版本的HarmonyOS可能对WebView的cookie处理机制有所不同。确保在目标系统版本上测试和验证。

6. 缓存问题：WebView可能会缓存页面和cookie，导致注入的cookie未能及时生效。尝试清除WebView的缓存后重新注入cookie。

7. 权限问题：确保应用具有必要的权限来操作cookie。检查应用的权限配置，确保其具备操作cookie的能力。

以上是可能导致HarmonyOS鸿蒙Next中H5的WebView注入cookie失效的原因，具体问题需根据实际场景进行分析和验证。