js下载文件的几种方式

一、此方法火狐有些版本是不支持的
window.location.href = 'https://*****.oss-cn-**.aliyuncs.com/*********';
二、为了解决火狐有些版本不支持,可以改成这种方式
window.location='https://*****.oss-cn-**.aliyuncs.com/*********';
三、该方法IE和火狐都可以,url表示要下载的文件路径:
function(url){try {var elemIF = document.createElement("iframe");elemIF.src = url;elemIF.style.display = "none";document.body.appendChild(elemIF);} catch (e) {alert("下载异常！");}
}
四、form表单的形式
downloadFile(url){var form=$("<form>");form.attr("style","display:none");form.attr("target","");form.attr("method","get"); form.attr("action",url);$("body").append(form);form.submit();//表单提交}
}
五、a标签的方式
function(url,name){var a = document.createElement("a");a.download = name + ".xls";a.href = url;$("body").append(a); // 修复firefox中无法触发clicka.click();$(a).remove();
}
六、假如后台给的文件流
function (formData, url, name) {return new Promise((resolve, reject) => {var xhr = new XMLHttpRequest();xhr.open("POST", url, true); // 也可以使用POST方式，根据接口xhr.responseType = "blob"; // 返回类型blob// 定义请求完成的处理函数，请求前也可以增加加载框/禁用下载按钮逻辑xhr.onload = function () {// 请求完成if (this.status === 200) {// 返回200var blob = this.response;var reader = new FileReader();reader.readAsDataURL(blob); // 转换为base64，可以直接放入a表情hrefreader.onload = function (e) {// 转换完成，创建一个a标签用于下载var a = document.createElement("a");a.download = name + ".xls";a.href = e.target.result;$("body").append(a); // 修复firefox中无法触发clicka.click();resolve(200)$(a).remove();};}};// 发送ajax请求xhr.send(formData);})
};
七、download.js
我粘贴一下download的源码//download.js v4.2, by dandavis; 2008-2016. [CCBY2] see http://danml.com/download.html for tests/usage
// v1 landed a FF+Chrome compat way of downloading strings to local un-named files, upgraded to use a hidden frame and optional mime
// v2 added named files via a[download], msSaveBlob, IE (10+) support, and window.URL support for larger+faster saves than dataURLs
// v3 added dataURL and Blob Input, bind-toggle arity, and legacy dataURL fallback was improved with force-download mime and base64 support. 3.1 improved safari handling.
// v4 adds AMD/UMD, commonJS, and plain browser support
// v4.1 adds url download capability via solo URL argument (same domain/CORS only)
// v4.2 adds semantic variable names, long (over 2MB) dataURL support, and hidden by default temp anchors
// https://github.com/rndme/download(function (root, factory) {if (typeof define === 'function' && define.amd) {// AMD. Register as an anonymous module.define([], factory);} else if (typeof exports === 'object') {// Node. Does not work with strict CommonJS, but// only CommonJS-like environments that support module.exports,// like Node.module.exports = factory();} else {// Browser globals (root is window)root.download = factory();}
}(this, function () {return function download(data, strFileName, strMimeType) {var self = window, // this script is only for browsers anyway...defaultMime = "application/octet-stream", // this default mime also triggers iframe downloadsmimeType = strMimeType || defaultMime,payload = data,url = !strFileName && !strMimeType && payload,anchor = document.createElement("a"),toString = function(a){return String(a);},myBlob = (self.Blob || self.MozBlob || self.WebKitBlob || toString),fileName = strFileName || "download",blob,reader;myBlob= myBlob.call ? myBlob.bind(self) : Blob ;if(String(this)==="true"){ //reverse arguments, allowing download.bind(true, "text/xml", "export.xml") to act as a callbackpayload=[payload, mimeType];mimeType=payload[0];payload=payload[1];}if(url && url.length< 2048){ // if no filename and no mime, assume a url was passed as the only argumentfileName = url.split("/").pop().split("?")[0];anchor.href = url; // assign href prop to temp anchorif(anchor.href.indexOf(url) !== -1){ // if the browser determines that it's a potentially valid url path:var ajax=new XMLHttpRequest();ajax.open( "GET", url, true);ajax.responseType = 'blob';ajax.οnlοad= function(e){ download(e.target.response, fileName, defaultMime);};setTimeout(function(){ ajax.send();}, 0); // allows setting custom ajax headers using the return:return ajax;} // end if valid url?} // end if url?//go ahead and download dataURLs right awayif(/^data\:[\w+\-]+\/[\w+\-]+[,;]/.test(payload)){if(payload.length > (1024*1024*1.999) && myBlob !== toString ){payload=dataUrlToBlob(payload);mimeType=payload.type || defaultMime;}else{            return navigator.msSaveBlob ?  // IE10 can't do a[download], only Blobs:navigator.msSaveBlob(dataUrlToBlob(payload), fileName) :saver(payload) ; // everyone else can save dataURLs un-processed}}//end if dataURL passed?blob = payload instanceof myBlob ?payload :new myBlob([payload], {type: mimeType}) ;function dataUrlToBlob(strUrl) {var parts= strUrl.split(/[:;,]/),type= parts[1],decoder= parts[2] == "base64" ? atob : decodeURIComponent,binData= decoder( parts.pop() ),mx= binData.length,i= 0,uiArr= new Uint8Array(mx);for(i;i<mx;++i) uiArr[i]= binData.charCodeAt(i);return new myBlob([uiArr], {type: type});}function saver(url, winMode){if ('download' in anchor) { //html5 A[download]anchor.href = url;anchor.setAttribute("download", fileName);anchor.className = "download-js-link";anchor.innerHTML = "downloading...";anchor.style.display = "none";document.body.appendChild(anchor);setTimeout(function() {anchor.click();document.body.removeChild(anchor);if(winMode===true){setTimeout(function(){ self.URL.revokeObjectURL(anchor.href);}, 250 );}}, 66);return true;}// handle non-a[download] safari as best we can:if(/(Version)\/(\d+)\.(\d+)(?:\.(\d+))?.*Safari\//.test(navigator.userAgent)) {url=url.replace(/^data:([\w\/\-\+]+)/, defaultMime);if(!window.open(url)){ // popup blocked, offer direct download:if(confirm("Displaying New Document\n\nUse Save As... to download, then click back to return to this page.")){ location.href=url; }}return true;}//do iframe dataURL download (old ch+FF):var f = document.createElement("iframe");document.body.appendChild(f);if(!winMode){ // force a mime that will download:url="data:"+url.replace(/^data:([\w\/\-\+]+)/, defaultMime);}f.src=url;setTimeout(function(){ document.body.removeChild(f); }, 333);}//end saverif (navigator.msSaveBlob) { // IE10+ : (has Blob, but not a[download] or URL)return navigator.msSaveBlob(blob, fileName);}if(self.URL){ // simple fast and modern way using Blob and URL:saver(self.URL.createObjectURL(blob), true);}else{// handle non-Blob()+non-URL browsers:if(typeof blob === "string" || blob.constructor===toString ){try{return saver( "data:" +  mimeType   + ";base64,"  +  self.btoa(blob)  );}catch(y){return saver( "data:" +  mimeType   + "," + encodeURIComponent(blob)  );}}// Blob but not URL support:reader=new FileReader();reader.οnlοad=function(e){saver(this.result);};reader.readAsDataURL(blob);}return true;}; /* end download() */
}));
用法：download(fileUrl,name,"video/mp4");
具体更多的用法请参考官网，
注意 download.js第一个参数 是数据流，不是像oss那样的文件地址

原文地址：https://www.cnblogs.com/zlq92/p/13390610.html?utm_source=tuicool

js下载文件的几种方式相关推荐

java 文件下载详解_Java 从网上下载文件的几种方式实例代码详解
废话不多说了,直接给大家贴代码了,具体代码如下所示: package com.github.pandafang.tool; import java.io.BufferedOutputStream; i ...
python 下载文件-Python下载文件的11种方式
原标题:Python下载文件的11种方式在本教程中,你将学习如何使用不同的Python模块从web下载文件.此外,你将下载常规文件.web页面.Amazon S3和其他资源. 最后,你将学习如何克服 ...
前端下载文件的几种方式
前端下载文件的几种方式前言 1. window.open 2. window.location.href 3. a标签 4. iframe 5. blob 前言总结下载文件的几种方式,文件都是通过 ...
Java下载文件的几种方式
public HttpServletResponse download(String path, HttpServletResponse response) {try {// path是指欲下载的文件 ...
Windows从web下载文件的几种方式
最近搞app自动化测试,需要自动从网页上下载apk用于测试,顺便学习了几种从web下载文件的方式. 一.PowerShell DownloadFile 命令 PowerShell 是一种winodws ...
springboot Java实现多文件的zip压缩操作 + 通过浏览器下载文件的两种方式
注只适配utf-8的场景,待完善! 压缩为zip文件通过java程序输出文件 /*** 功能:压缩多个文件成一个zip文件* @param srcfile:源文件列表* @param zipfile ...
vue前端下载文件的2种方式
以下两种方式下载适用于后端返回了文件的url下载地址 var x = new XMLHttpRequest();x.open("GET", url, true);//url为文件的 ...
【Linux】部署Springboot项目到Linux服务器以及linux服务器下载文件的三种方式详解
Linux学习之路初识Linux Linux内核由芬兰人林纳斯·托瓦兹(Linus Torvalds)在赫尔辛基大学上学时出于个人爱好而编写 Linux 是一套免费使用和自由传播的类Unix操作系 ...
angualr2 下载文件的两种方式
根据小编我目前的了解,angualr2中可以使用一下两种方式导出文件第一种 export(){let url ="自己下载文件的路径";// var objectUrl = UR ...

js下载文件的几种方式

js下载文件的几种方式相关推荐

最新文章

热门文章