HarmonyOS 鸿蒙Next webview怎么使用file协议加载项目中 rawfile下的文件

发布于 1周前 作者 phonegap100 来自 鸿蒙OS

HarmonyOS 鸿蒙Next webview怎么使用file协议加载项目中 rawfile下的文件

webview加载的本地项目local.html,需要使用file协议加载 否则页面无法正常显示

webview 组件加载项目 怎么使用web({src:file://XXX/local.html})这种方式进行加载,原本以为沙箱路径呈现的方式可以解决,但是不清楚沙箱路径和rawfile路径的映射关系,想问一下有没有沙箱路径和rawfile路径的转换,或者沙箱路径和resource协议路径的转换,或者直接将resource协议转换成file协议
 


更多关于HarmonyOS 鸿蒙Next webview怎么使用file协议加载项目中 rawfile下的文件的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

沙箱路径关系如下:
1.临时文件目录路径
绝对路径:/data/app/el2/<userId默认是100>/base/<bundleName>/temp
沙箱路径:/data/storage/el2/base/temp
ArkTS侧获取方式:getContext(this).getApplicationContext().tempDir
2.应用内本地文件路径
绝对路径:/data/app/el2/<userId默认是100>/base/<bundleName>/files
沙箱路径:/data/storage/el2/base/files
应用空间统计ArkTS侧获取方式:getContext(this).getApplicationContext().filesDir
3.应用资源文件目录路径
绝对径:/data/app/el1/bundle/public/<bundlename>/<hapName>/resources
沙箱路径:/data/storage/el1/bundle/entry/resources
ArkTS侧获取方式:getContext(this).bundleCodeDir + ‘/<hapName>/resources’
参考文档:‘https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V13/app-sandbox-directory-V13#应用沙箱路径和真实物理路径的对应关系’

由于应用以HAP形式进行安装,安装完成后不会解压HAP包,所以在程序运行时无法获取resource路径。 参考FAQ:‘https://developer.huawei.com/consumer/cn/doc/harmonyos-faqs/faqs-localization-kit

若要得到文件存储的路径,需要把内容先读出来,再写到应用的沙箱路径,参考:

import { webview } from '@kit.ArkWeb'
import fs from '@ohos.file.fs';

@Entry @Component struct Index { scrollerForScroll: Scroller = new Scroller() webviewController: webview.WebviewController = new webview.WebviewController() @State url:string = ‘’ aboutToAppear() { webview.WebviewController.setWebDebuggingAccess(true); getContext(this).resourceManager.getRawFileContent(‘local.html’, (err, value) => { let myBuffer: ArrayBufferLike = value.buffer let context = getContext(this); //沙箱路径 let filePath = context.filesDir + ‘/local.html’; console.log(‘testTag-filePath:’ + filePath); let file = fs.openSync(filePath, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE); let writeLen = fs.writeSync(file.fd, myBuffer); console.info(‘testTag-write data to file succeed and size is:’ + writeLen); fs.closeSync(file); this.url = ‘file://’ + filePath }) } build() { Column() { Text(‘hello world’) Web({ src: ‘’, controller: this.webviewController, }) .overScrollMode(OverScrollMode.NEVER) .javaScriptAccess(true) .databaseAccess(true) .domStorageAccess(true) .onControllerAttached(() => { this.webviewController.loadUrl(this.url); }) } .width(“100%”) .height(“100%”) } }

更多关于HarmonyOS 鸿蒙Next webview怎么使用file协议加载项目中 rawfile下的文件的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


加载rawfile中的html $rawfile("index.html") 

加载本地的html 

将html文件存在context.filesDir + '/index.html' 路径下

然后加载这个路径 'file://' + context.filesDir + '/index.html'  

在HarmonyOS鸿蒙Next中,使用webview加载项目中rawfile下的文件通过file协议,可以通过以下方式实现:

  1. 获取文件路径: 首先,确保rawfile资源已正确放置在项目目录中。接着,在代码中获取该文件在项目打包后的实际路径。通常,鸿蒙系统提供资源管理器接口来获取资源文件的路径。

  2. 配置Webview: 使用Webview组件并设置其加载URL。这个URL应基于步骤1中获取的文件路径,并使用file://协议格式。例如:

    String filePath = "file:///" + getRawFilePath("your_file_name");
    webview.loadUrl(filePath);
    

    其中getRawFilePath是一个自定义方法,用于获取rawfile下的文件路径,你需要根据鸿蒙提供的API来实现这个方法。

  3. 权限处理: 确保应用具有读取资源文件的权限。虽然通常加载项目内部资源不需要额外权限,但如果有安全策略限制,需要处理相应的权限请求。

示例代码片段:

String filePath = "file:///" + getRawResourceFilePath("path/to/your_file_name");
webview.loadUrl(filePath);

注意:getRawResourceFilePath为示意方法,需根据鸿蒙API实现。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部