jquerymp3文件下载_前端实现文件下载所有方式

一.a标签完成

二.js实现下载

const a = document.createElement('a');

a.setAttribute('href', '文件链接'); //a.href='文件链接'

a.setAttribute('download', '文件名'); //a.download='文件名'

a.click();

三.js中ajax实现音频或者视频不跳转进行文件下载

写代码的思路

先请求音频的链接,再把返回值转换成二进制,再根据他二进制对象生成新链接,再创建a标签,点击a标签

//这是vue里面的写的普通页面也差不多

this.$axios({

method: 'get',

url: row.src,

responseType: 'blob' //这个不能少,让response二进制形式,如果你按照网上教程不设置这个将返回值进行BLOB([])进行处理可能会出现解析错误

}).then(response => {

const href = URL.createObjectURL(response.data); //根据二进制对象创造新的链接

const a = document.createElement('a');

a.setAttribute('href', href);

a.setAttribute('download', row.title);

a.click();

URL.revokeObjectURL(href);

}

四.fetch实现

//原理和ajax一模一样

function request() {

fetch('', {

method: 'POST',

headers: {

'Content-Type': 'application/json',

body: '',

})

.then(res => res.blob())

.then(data => {

let blobUrl = window.URL.createObjectURL(data);

download(blobUrl);

});

}

function download(blobUrl) {

const a = document.createElement('a');

a.download = '';

a.href = blobUrl;

a.click();

}

request();

jquerymp3文件下载_前端实现文件下载所有方式相关推荐

vue 本地xlsx文件下载_前端vue下载导出excel和cvs文件
// 导出 exportData () { this.$confirm('确认导出XXXXXX?', { confirmButtonText: '导出', cancelButtonText: '取消' ...
0宽字符加密_前端AES加密方式分析，及其python实现
在前端常见的加密方式中AES很少使用,因为相对于非对称的RSA安全性很低,AES是典型的对称加密,密钥就在前端源码里. 案列网站是http://ewt360.com,一个并不复杂的网站,首先抓个包看看 ...
ie9无法获取未定义或 null 引用的属性“indexof”_前端JS基础篇（二）JS基本数据类型和引用数据类型及检测数据类型方法...
JS中的数据类型 (一).基本数据类型(值类型) 1.number:数字 -12.12.5.-12.5 0这些数字都是number: js中增加了一个number类型的数据:'NaN' typeof ...
人工智能实战小程序之语音_前端开发
1. 人工智能实战小程序之准备工作 2. 人工智能实战小程序之语音_前端开发今天这部分主要讲小程序前端功能的开发由于我偏后端,css是我的弱项,可能很多人和我一样开发小程序不知道如何下手,希望本篇 ...
JavaWeb全套教程笔记_前端技术
JavaWeb全套教程笔记第一阶段_前端技术自己整理一套详细的笔记资料,可以满足平时查阅复习,还能帮助别人学习JavaWeb知识.JavaWeb教程分为四个阶段前端技术 1.HTML.2.CSS. ...
现代软件工程_团队项目_阿尔法阶段_前端知识共享_2017.11.21
现代软件工程_团队项目_阿尔法阶段_前端知识分享更加舒适浏览格式 http://blog.csdn.net/bowean HTML基础(一) 本文参考了[http://www.w3school.co ...
「跨域」利用node.js实践前端各种跨域方式（上）
前言常言道,"读万卷书,不如行万里路".技术的学习也是如此,唯有实践才能更清楚的明白原理和加深印象,因此本文会利用node.js对前端的各种跨域方式进行实践,强烈建议一步一步跟着 ...
xss植入_前端安全之XSS攻击
XSS(cross-site scripting跨域脚本攻击)攻击是最常见的Web攻击,其重点是"跨域"和"客户端执行".有人将XSS攻击分为三种,分别是: 1 ...
前端实现3d效果_前端动画效果实现的简单比较
合适的动画不仅更能吸引人们的眼球,也能让你的应用体验更为流畅,而将动画的效果做到极致,才能让用户感到使用你的应用是一种享受,而不是觉得生硬和枯燥.本文旨在探讨各种前端动画效果实现方式的异同,具体应用中 ...
JS实现仿新浪微博大厅和腾讯微博首页滚动效果_前端开发
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

jquerymp3文件下载_前端实现文件下载所有方式

jquerymp3文件下载_前端实现文件下载所有方式相关推荐

最新文章

热门文章