HarmonyOS鸿蒙Next中ArkTS和H5的数据解析如何处理

HarmonyOS鸿蒙Next中ArkTS和H5的数据解析如何处理 在arkts拿到这样的数据，在h5怎么接受这个数据并解析呢，想要拿到它的originalValue
//result is {“scanType”:,“originalValue”:“XXXXXXX”}

4 回复

可参考：https://developer.huawei.com/consumer/cn/codelabsPortal/carddetails/tutorials_NEXT-SelectContact

核心代码：

// JsBridge.ets
/**
 * 定义桥接类
 */
export default class JsBridge {
  /**
   * 将ArkTS侧数据传递给call方法
   */
  call = (func: string, params: string): void => {
    const paramsObject: ParamsItem = JSON.parse(params);
    let result: Promise<string> = new Promise(resolve => resolve(''));
    switch (func) {
      case 'chooseContact':
        result = this.chooseContact();
        break;
      case 'changeTel':
        result = this.changeTel(paramsObject);
        break;
      case 'changeAmount':
        result = this.changeAmount();
        break;
      case 'getProportion':
        result = this.getProportion();
        break;
      default:
        break;
    }
    result.then((data: string) => {
      this.callback(paramsObject?.callID, data);
    })
  }

  /**
   * 将ArkTS侧数据传递到H5
   */
  callback = (id: number, data: string): void => {
    this.controller.runJavaScript(`JSBridgeCallback('${id}', ${JSON.stringify(data)})`);
  }
}

更多关于HarmonyOS鸿蒙Next中ArkTS和H5的数据解析如何处理的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


result.originalValue  

参考：[https://developer.huawei.com/consumer/cn/forum/topic/0201149266747738559?fid=0109140870620153026](https://developer.huawei.com/consumer/cn/forum/topic/0201149266747738559?fid=0109140870620153026)

这是扫码那块的返回值吧，返回的应该是个图片路径，可以将图片转成base64传给web端

在HarmonyOS鸿蒙Next中，ArkTS和H5的数据解析可以通过以下方式处理：

  1. ArkTS数据解析：使用JSON.parse()方法将JSON字符串转换为对象，或使用JSON.stringify()将对象转换为JSON字符串。对于复杂数据结构，可以使用@ohos.util模块中的HashMap、ArrayList等集合类进行管理。

  2. H5数据解析：在Web组件中，可以通过JavaScript的JSON.parse()和JSON.stringify()方法进行数据解析和序列化。此外，可以使用XMLHttpRequest或fetch API从服务器获取数据，并进行解析。

  3. ArkTS与H5交互：通过WebView组件的postMessage和onMessage方法实现ArkTS与H5之间的数据传递和解析。

回到顶部