HarmonyOS 鸿蒙Next web组件加载沙箱pdf文件

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

HarmonyOS 鸿蒙Next web组件加载沙箱pdf文件

import { webview } from '@kit.ArkWeb'
controller: webview.WebviewController = new webview.WebviewController();
Web({
  src: '/data/storage/el2/base/haps/entry/files/downloadPdf/4507678.pdf',
  controller: this.controller
})
  .domStorageAccess(true)
  .fileAccess(true)

web组件加载沙箱文件 无法显示

黑屏 官方下载的demo中也无法显示


更多关于HarmonyOS 鸿蒙Next web组件加载沙箱pdf文件的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

参考以下demo:

@Entry
@Component
struct GetFile {
@State message: string = 'Hello World';
@State url: string = GlobalContext.getContext().getObject("filesDir") + '/2023_PDF.pdf'
// 获取应用文件路径
context = this as common.UIAbilityContext;
webviewController: webview.WebviewController = new webview.WebviewController();
responseweb: WebResourceResponse = new WebResourceResponse()

aboutToAppear() {
// 配置Web开启调试模式
webview.WebviewController.setWebDebuggingAccess(true);
this.getFile('https://www.gov.cn/zhengce/pdfFile/2023_PDF.pdf')
}

hasFile(filePath: string) {
let b = fs.accessSync(filePath)
return b
}

async getFile(url: string) {
const fileName = url.split("/").pop();
console.log(fileName + " 123456")
const filePath = GlobalContext.getContext().getObject("filesDir") + '/' + fileName;
// const filePath = 'file:///data/storage/el1/bundle/entry/resources/resfile' + '/' + fileName;
console.log(filePath + ' 123456')

const flag = this.hasFile(filePath);
console.log(flag + "A 123456")
if (!flag) {
await this.downloadImage(url, filePath);
console.log(flag + "ABC 123456")
}
return '123'
}

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() {
Button('MainTest')
.margin({top:20})
.onClick(() => {
try {
this.webviewController.loadUrl('file://' + this.url + '?#toolbar=0&navpanes=0')
// src: 'resource://rawfile/1.pdf?#toolbar=0&navpanes=0',
// console.log('123')
} catch (error) {
console.log('error')
}
})
Web({ src: 'resource://rawfile/1.pdf', controller: this.webviewController })
.domStorageAccess(true)
.javaScriptAccess(true)
.zoomAccess(true)
.fileAccess(false)
}
}
}

更多关于HarmonyOS 鸿蒙Next web组件加载沙箱pdf文件的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


针对帖子标题“HarmonyOS 鸿蒙Next web组件加载沙箱pdf文件”的问题,以下是专业且简洁的回答:

在HarmonyOS鸿蒙系统中,Next web组件提供了强大的Web应用开发能力。若要在Next web组件中加载沙箱内的PDF文件,需确保以下几点:

  1. 文件路径正确:确保PDF文件的路径在沙箱中是可访问的,且路径格式符合HarmonyOS的文件系统规范。

  2. 权限配置:检查应用是否已获取读取沙箱内文件的权限,以及是否配置了正确的沙箱访问策略。

  3. Web组件支持:确认Next web组件支持PDF文件的加载和显示。通常,这可以通过嵌入PDF.js等库来实现,该库可以在Web环境中渲染PDF文件。

  4. 沙箱安全策略:确保沙箱的安全策略允许Web组件访问和加载PDF文件,避免潜在的安全风险。

  5. 代码实现:在Web组件的代码中,使用适当的HTML和JavaScript代码来加载和显示PDF文件。例如,可以使用<iframe>标签或PDF.js提供的API来加载PDF。

如果以上步骤均正确无误,但问题依旧存在,可能是由于HarmonyOS版本差异、Web组件的特定限制或其他未知因素导致的。此时,请联系官网客服以获取进一步的帮助。官网地址是:https://www.itying.com/category-93-b0.html

回到顶部