ios的safari下载文件 文件名乱码

当使用nginx代理文件并下载文件时,返回的协议头Content-Dispositionfilename=%E9%9B%AA%E5%B1%B1.jpg中文内容会是URL编码的形式,当客户端在safari浏览器下载下载文件时,文件名不会转换(URL解码)为正常的中文。

应该使用js进行下载,即可解决问题。

js 复制代码
       axios({
          method: 'get',
          url: 'http://xxxxxxxx.com/files/年终总结模板.docx',
          responseType: 'blob'
        }).then((response) => {
          const contentDisposition = response.headers['content-disposition'];
          let fileName = ''; // 如果没获取到文件名,设置默认文件名
          if (contentDisposition) {
            const matches = contentDisposition.match(/filename="?([^"]+)"?/);
            if (matches && matches.length > 1) {
              fileName = matches[1];
            }
          }
          const blob = new Blob([response.data], { type: response.headers['content-type'] });
          const link = document.createElement('a');
          link.href = URL.createObjectURL(blob);
          link.download = decodeURIComponent(fileName);
          document.body.appendChild(link);
          link.click();
          document.body.removeChild(link);
          URL.recycleObjectURL(link.href);
        })
相关推荐
王同学JavaNotes7 分钟前
React 基础:剖析 UI 描述之道
前端·react.js·ui
东离与糖宝10 分钟前
React 事件机制和原生 DOM 事件流有什么区别
前端·javascript·react.js
理想不理想v13 分钟前
JSX和vue模版哪个更好?
前端·javascript·vue.js·性能优化
等一场春雨14 分钟前
react Moment.js 是一个流行的 JavaScript 库,用于处理日期和时间。它提供了丰富的功能,包括日期格式化、解析、操作和国际化
前端·javascript·react.js
不爱说话郭德纲1 小时前
基于uniapp使用websocket进行实时通讯
开发语言·前端·javascript·vue.js
鱼樱前端2 小时前
抽风【HbuilerX-Bug】终端无法显示打印信息,也无法输入
前端·开源
多客软件佳佳2 小时前
便捷的线上游戏陪玩、线下家政预约以及语音陪聊服务怎么做?系统代码解析
前端·游戏·小程序·前端框架·uni-app·交友
_Feliz3 小时前
vue2实现word在线预览
前端·javascript·vue.js·elementui·vue-office
huoyueyi3 小时前
超详细Chatbot UI的配置及使用
前端·ui·chatgpt
Qlittleboy3 小时前
vue的elementUI 给输入框绑定enter事件失效
前端·vue.js·elementui