如何通过原生端调用JS代码处理文件？

本问答帖原创发布在华为开发者联盟社区，欢迎开发者前往论坛提问交流。

更多与该问题相关的讨论，请点击原帖查看：

如何通过原生端调用 JS 代码处理文件？

【背景知识】xlsx 插件可以把 html 中的 table 元素或者 json 数据转换成表格后进行导出，也可以解析表格文件，将其转换成 json 格式的数据，更多可参考官方文档。【解决方案】xlsx 是 H5 的插件，只能在 H5 页面使用，具体实现步骤如下：

1.getRawFileContent 获取 rawfile 文件下的 excel 文件，将其转换为 base64：

async readExcel(fileName:string) {

try {

const resource: Uint8Array = await getContext().resourceManager.getRawFileContent(fileName)

const uint8Array = new Uint8Array(resource.buffer)

let base64Helper = new util.Base64Helper();

let base64 = base64Helper.encodeToStringSync(uint8Array, util.Type.MIME);

return base64

} catch (e) {

console.error(`读取文件失败：${e}`)

return []

}

2.registerJavaScriptProxy 注入对象：

this.controller.registerJavaScriptProxy(this.testObjtest, 'ExcelBridge', ['readExcel'])

3.在 H5 页面调用 HarmonyOS 方法，接收传递的 base64，并调用 xlsx 库解析：

async function readXlsContent(){

const b64 = await ExcelBridge.readExcel('text.xlsx')

//使用 SheetJS 解析

const workbook = XLSX.read(b64, {type: 'base64'})

//获取第一个工作表

const sheet = workbook.Sheets[workbook.SheetNames[0]]

//使用 xlsx 的 utils.sheet_to_json 等方法将工作表转换为 JSON

const outdata = XLSX.utils.sheet_to_json(sheet)

console.log('outdata------:',outdata) // [{name:'张三'，gender:'男'},{name:'李四'，gender:'男'}]

}

4.在应用侧的消息端口上注册回调函数，接收 H5 侧发送过来的消息，具体可参考：应用与网页互发消息的示例。

如何通过原生端调用 JS 代码处理文件？