HarmonyOS webview如何拦截本地文件,例如图片资源?

webview页面要加载一个自定义协议资源,通过onInterceptRequest可以拦截到请求,此资源对应的是沙盒的一个文件,例如一张图片,onInterceptRequest中如何返回这个图片资源,WebResourceResponse 里面只有 setResponseData(data: string | number)。

HarmonyOS
2024-11-07 10:44:26
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

请参考下面demo:

import web_webview from '@ohos.web.webview'; 
import fs from '@ohos.file.fs'; 
import common from '@ohos.app.ability.common'; 
import axios from '@ohos/axios' 
 
@Entry 
@Component 
struct GetFile { 
  @State message: string = 'Hello World'; 
  // 获取应用文件路径 
  context = getContext(this) as common.UIAbilityContext; 
  webviewController: web_webview.WebviewController = new web_webview.WebviewController(); 
  responseweb: WebResourceResponse = new WebResourceResponse() 
 
  aboutToAppear() { 
    // 配置Web开启调试模式 
    web_webview.WebviewController.setWebDebuggingAccess(true); 
  } 
 
  hasFile(filePath: string) { 
    let b = fs.accessSync(filePath) 
    return b 
  } 
 
  async getFile(url: string) { 
    const fileName = url.split("/").pop(); 
    const filePath = this.context.cacheDir + '/' + fileName; 
 
    const flag = this.hasFile(filePath); 
    console.log(flag + "123456") 
    if (!flag) { 
      await this.downloadImage(url, filePath); 
    } 
    let file = await fs.openSync(filePath, fs.OpenMode.READ_ONLY); 
    let arrayBuffer = new ArrayBuffer(4096); 
    return file.fd; 
  } 
}
@Entry 
@Component 
struct GetFile { 
 
  @State message: string = 'Hello World'; 
  // 获取应用文件路径 
  context = getContext(this) as common.UIAbilityContext; 
  webviewController: web_webview.WebviewController = new web_webview.WebviewController(); 
  responseweb: WebResourceResponse = new WebResourceResponse() 
  aboutToAppear() { 
    // 配置Web开启调试模式 
    web_webview.WebviewController.setWebDebuggingAccess(true); 
  } 
 
  hasFile(filePath:string){ 
    let b = fs.accessSync(filePath) 
    return b 
  } 
  async downloadImage(url : string, filePath:string) { 
    try { 
      await axios({ 
        method: "get", 
        url, 
        context: this.context, 
        filePath: filePath }); 
    } catch (error) { 
      console.error('[Demo] axios error'); 
    } 
  } 
  build() { 
    Column() { 
      Web({ src: $rawfile('catch.html'), controller: this.webviewController }) 
        .onInterceptRequest((event) => { 
          if (event) { 
          } 
          const url = event!.request.getRequestUrl(); 
          console.log(url.endsWith(".jpg") + '123456') 
          if (!url.endsWith(".jpg")) return null; 
          try { 
            let url2='https://img.huawei.com/3.jpg'; 
            this.getFile(url2).then(fd => { 
              this.responseweb.setResponseData(fd); 
              this.responseweb.setResponseCode(200); 
              this.responseweb.setReasonMessage('OK'); 
              this.responseweb.setResponseIsReady(true); 
            }); 
            this.responseweb.setResponseMimeType('image/*'); 
            this.responseweb.setResponseIsReady(false); 
            console.log(this.responseweb.getResponseData().toString+"123456") 
            return this.responseweb; 
          } catch (error) { 
            console.error(`[Demo]Code: ${error.code},Message: ${error.message} `); 
            return null 
          } 
        }) 
    } 
  } 
}
分享
微博
QQ
微信
回复
2024-11-07 15:16:55
相关问题
HarmonyOS 本地资源如何引用?
290浏览 • 1回复 待解决
HarmonyOS WebView拦截网络请求
467浏览 • 1回复 待解决
WebView goBack事件拦截
1084浏览 • 1回复 待解决
webview如何实现网络请求拦截功能
2249浏览 • 1回复 待解决
webview拦截返回按钮。
825浏览 • 1回复 待解决
HarmonyOS webview如何播放本地沙箱视频
1700浏览 • 1回复 待解决
webview如何拦截网络请求
663浏览 • 1回复 待解决
HarmonyOS webview加载本地html问题
468浏览 • 1回复 待解决
HarmonyOS 本地webView跨域方案
820浏览 • 1回复 待解决
HarmonyOS 如何去除如图中的间隙
26浏览 • 1回复 待解决