H5调用原生客户端接口下载附件

在移动前端开发过程中,需要实现附件下载功能。如果具有附件下载功能的页面是通过webview嵌入到原生客户端(IOS或者Android)中的二级页面(即H5),则需要间接调用原生方法实现此功能。

本文封装了一个方法用来实现此功能:

js 复制代码
const downloadResource = (url, name, type) => {
  if(window.locationjs) window.locationjs.downloadFile({
    downloadUrl: `${resourceBaseURL}${url}`,
    fileName:`${name}.${type}`
  });
};
html 复制代码
<div
  className="detail-attachment"
  onClick={() => void downloadResource(attachmentUrl, name, type)}
>

其中resourceBaseURL需要后端提供,url是附件的相对地址,使用后端接口返回的值即可。

相关推荐
我是大头鸟16 分钟前
SpringMVC 内容协商处理
前端
Humbunklung17 分钟前
Visual Studio 2022 中添加“高级保存选项”及解决编码问题
前端·c++·webview·visual studio
墨水白云33 分钟前
nestjs[一文学懂nestjs中对npm功能包的封装,ioredis封装示例]
前端·npm·node.js
低代码布道师36 分钟前
第五部分:第一节 - Node.js 简介与环境:让 JavaScript 走进厨房
开发语言·javascript·node.js
满怀10151 小时前
【Vue 3全栈实战】从响应式原理到企业级架构设计
前端·javascript·vue.js·vue
luckywuxn1 小时前
使用gitbook 工具编写接口文档或博客
前端
梅子酱~2 小时前
Vue 学习随笔系列二十三 -- el-date-picker 组件
前端·vue.js·学习
伟笑2 小时前
elementUI 循环出来的表单,怎么做表单校验?
前端·javascript·elementui
辣辣y2 小时前
React中useMemo和useCallback的作用:
前端·react
Alice-YUE2 小时前
【HTML5学习笔记1】html标签(上)
前端·笔记·学习·html·html5