HarmonyOS webview加载h5页面点击拍照相册webview怎么做兼容

webview加载h5页面 在h5页面点击拍照或者相册没有反应 webview需要怎么做兼容。

HarmonyOS
2024-09-03 10:44:48
1019浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
FengTianYa

可以尝试以下方案:

在ArkTS跟webview里的js交互成功后用选择模式拉起photoPicker,相关api参考官网:

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-file-picker-V5

选择文件之后需要web组件拦截图片加载的沙箱地址,以下是图片处理这部分的代码:

Web({xxxx}) 
   .onInterceptRequest((event) => { 
         if (!event) { 
           return null 
         } 
         const url = event?.request?.getRequestUrl() 
         if (isFileUri(url)) { 
           const path = url 
           const file = fs.openSync(path, fs.OpenMode.READ_ONLY) 
           const fd = file.fd 
           const responseWeb = new WebResourceResponse() 
           responseWeb.setResponseData(fd) 
           responseWeb.setResponseCode(200) 
           responseWeb.setReasonMessage('OK') 
           responseWeb.setResponseIsReady(true) 
           console.info(TAG, `responseWeb`) 
           return responseWeb 
         } 
         return null 
       }) 
export function isFileUri (path: string): boolean { 
  if (path && typeof(path) === 'string' && (path.startsWith('file://') || path.startsWith('datashare://'))) { 
 return true 
  } 
  return false 
}
  • 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.

最后用HarmonyOS的文件管理方法去读取文件内容,然后将文件内容传给webview,webview就能显示出来图片了。

分享
微博
QQ
微信
回复
2024-09-03 16:58:10


相关问题
HarmonyOS webview H5页面事件监听
1112浏览 • 1回复 待解决
HarmonyOS 通过webview改变H5页面字体
777浏览 • 1回复 待解决
HarmonyOS WebView加载H5卡顿
799浏览 • 1回复 待解决
webview加载Vue h5失败
18538浏览 • 5回复 待解决
HarmonyOS webview加载H5显示过慢
750浏览 • 1回复 待解决
HarmonyOS webview 怎么H5交互
763浏览 • 1回复 待解决
HarmonyOS webview h5的localstorage
940浏览 • 1回复 待解决
HarmonyOS H5页面加载缓存机制
1128浏览 • 1回复 待解决
恭喜您,今日已阅读两篇内容,特奖励+2声望, 快来领取吧。