当前位置: 首页 > article >正文

vue下载后端提供的文件/播放音频文件

下载文件

doc
接口js文件里加一行这个responseType: ‘arraybuffer’,
js文件

export function (data) {
  return request({
    url: "XXX",
    method: "post",
    data: data,
    baseURL: " ",
    responseType: 'arraybuffer',
  });
}

vue文件

const time={
    "datetime_start": start1.value,
    "datetime_end": end1.value,
  }
  ( time ).then((response) => {
    const data = response.data;
    let blob = new Blob([response], {type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=UTF-8'});
    let objectUrl = window.URL.createObjectURL(blob) // 创建URL
    const a=document.createElement('a');
    a.style.display='none';
    a.href=objectUrl;
    a.download='报告.docx';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    objectUrl.revokeObjectURL(objectUrl); // 释放内存

});

播放音频

js文件

export function XXX(data) {
  return request({
    url: "XXX",
    method: "post",
    data: data,
    baseURL: " ",
    responseType: 'blob',
  });
}

vue文件

 const time = {
    audio_type: "2",
  };
  XXX(time).then((res) => {
   const blob = new Blob([res], { type: 'audio/wav' });
   const localUrl = (window.URL || webkitURL).createObjectURL(blob);
   const audio = document.createElement('audio');
   audio.style.display = 'none'; // 防止影响页面布局
   audio.controls = true;
   document.body.appendChild(audio);
   audio.src = localUrl;
   audio.playbackRate = 1.3; // 语速
   audio.play();
   
    // 语音播放完毕后,需要手动释放内存
    audio.onended = function () {
      document.body.removeChild(audio);
      URL.revokeObjectURL(localUrl);
    };

})

http://www.kler.cn/a/400448.html

相关文章:

  • ([LeetCode仓颉解题报告] 661. 图片平滑器
  • fpga 同步fifo
  • 远程jupyter lab的配置
  • Kotlin return与return@forEachIndexed
  • ATmaga8单片机Pt100温度计源程序+Proteus仿真设计
  • Java基础-内部类与异常处理
  • Redis的缓存穿透、缓存雪崩、缓存击穿问题及有效解决方案
  • 初始Python篇(3)—— 列表
  • 大数据新视界 -- 大数据大厂之 Impala 性能优化:集群资源动态分配的智慧(上)(23 / 30)
  • 使用弹性方法的 BP 网络学习改进算法详解
  • 【操作系统】Linux之线程同步二(头歌作业)
  • Git 常用命令大全与详解
  • 请求响应入门
  • element ui table进行相同数据合并单元格
  • Web搭建入门教程:基于ssh向服务器推送文件
  • 了解存储过程
  • c#————委托Action使用例子
  • 【泛型 Plus】Kotlin 的加强版类型推断:@BuilderInference
  • LM2 : A Simple Society of Language Models Solves Complex Reasoning
  • MyBatis XML一个方法执行插入或更新操做(PostgreSQL)
  • Java Collection的使用
  • Jaskson处理复杂的泛型对象
  • (Linux 入门) 基本指令、基本权限
  • 动态规划 之 子序列系列 算法专题
  • 脚手架vue-cli,webpack模板
  • 资源管理功能拆解——如何高效配置和管理项目资源?