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
相关问题
HarmonyOS webview H5页面事件监听
627浏览 • 1回复 待解决
HarmonyOS 通过webview改变H5页面字体
475浏览 • 1回复 待解决
webview加载Vue h5失败
18237浏览 • 5回复 待解决
HarmonyOS WebView加载H5卡顿
538浏览 • 1回复 待解决
HarmonyOS webview加载H5显示过慢
420浏览 • 1回复 待解决
HarmonyOS webview 怎么H5交互
518浏览 • 1回复 待解决
HarmonyOS webview h5的localstorage
709浏览 • 1回复 待解决
HarmonyOS H5页面加载缓存机制
798浏览 • 1回复 待解决