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

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

HarmonyOS
2024-09-03 10:44:48
浏览
收藏 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 
}

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

分享
微博
QQ
微信
回复
2024-09-03 16:58:10
相关问题
webview加载Vue h5失败
17814浏览 • 5回复 待解决
HarmonyOS webview 怎么H5交互
58浏览 • 1回复 待解决
HarmonyOS H5页面加载缓存机制
285浏览 • 1回复 待解决
HarmonyOS webview h5的localstorage
417浏览 • 1回复 待解决
HarmonyOS Web组件加载在线H5页面
227浏览 • 1回复 待解决
Web中webviewH5交互
1099浏览 • 1回复 待解决
HarmonyOS h5页面缩放问题
573浏览 • 0回复 待解决
HarmonyOS H5如何访问相册
281浏览 • 1回复 待解决