关于前端:JS-实现图片文件视频时直接下载而不是打开预览

52次阅读

共计 3059 个字符,预计需要花费 8 分钟才能阅读完成。

//  下载办法 download.js

function download(data, strFileName, strMimeType) {
  var self = window, // this script is only for browsers anyway...
    u = 'application/octet-stream', // this default mime also triggers iframe downloads
    m = strMimeType || u,
    x = data,
    D = document,
    a = D.createElement('a'),
    z = function(a) {return String(a)
    },
    B = self.Blob || self.MozBlob || self.WebKitBlob || z,
    BB = self.MSBlobBuilder || self.WebKitBlobBuilder || self.BlobBuilder,
    fn = strFileName || 'download',
    blob,
    b,
    ua,
    fr

  //if(typeof B.bind === 'function'){B=B.bind(self); }

  if (String(this) === 'true') {//reverse arguments, allowing download.bind(true, "text/xml", "export.xml") to act as a callback
    x = [x, m]
    m = x[0]
    x = x[1]
  }

  //go ahead and download dataURLs right away
  if (String(x).match(/^data\:[\w+\-]+\/[\w+\-]+[,;]/)) {return navigator.msSaveBlob // IE10 can't do a
  文件名称:
  文件大小:
  下载声明:本站部分资源来自于网络收集,若侵犯了你的隐私或版权,请及时联系我们删除有关信息。
下载地址:
, only Blobs: ? navigator.msSaveBlob(d2b(x), fn) : saver(x) // everyone else can save dataURLs un-processed } //end if dataURL passed? try {blob = x instanceof B ? x : new B([ x], {type: m}) } catch (y) {if (BB) {b = new BB() b.append([x]) blob = b.getBlob(m) // the blob } } function d2b(u) {var p = u.split(/[:;,]/), t = p[1], dec = p[2] == 'base64' ? atob : decodeURIComponent, bin = dec(p.pop()), mx = bin.length, i = 0, uia = new Uint8Array(mx) for (i; i < mx; ++i) uia[i] = bin.charCodeAt(i) return new B([uia], {type: t}) } function saver(url, winMode) {if ('download' in a) {//html5 A
  文件名称:
  文件大小:
  下载声明:本站部分资源来自于网络收集,若侵犯了你的隐私或版权,请及时联系我们删除有关信息。
下载地址:
a.href = url a.setAttribute('download', fn) a.innerHTML = 'downloading...' D.body.appendChild(a) setTimeout(function() {a.click() D.body.removeChild(a) if (winMode === true) {setTimeout(function() {self.URL.revokeObjectURL(a.href) }, 250) } }, 66) return true } //do iframe dataURL download (old ch+FF): var f = D.createElement('iframe') D.body.appendChild(f) if (!winMode) { // force a mime that will download: url = 'data:' + url.replace(/^data:([\w\/\-\+]+)/, u) } f.src = url setTimeout(function() {D.body.removeChild(f) }, 333) } //end saver if (navigator.msSaveBlob) {// IE10+ : (has Blob, but not a
  文件名称:
  文件大小:
  下载声明:本站部分资源来自于网络收集,若侵犯了你的隐私或版权,请及时联系我们删除有关信息。
下载地址:
or URL) return navigator.msSaveBlob(blob, fn) } 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 === z) { try {return saver('data:' + m + ';base64,' + self.btoa(blob)) } catch (y) {return saver('data:' + m + ',' + encodeURIComponent(blob)) } } // Blob but not URL: fr = new FileReader() fr.onload = function(e) {saver(this.result) } fr.readAsDataURL(blob) } return true } /* end download() */ export default download

utils 引入

import download from './download'

/*
        * 应用 download.js 强制浏览器下载图片、视频等文件
        * @param {any} url url 链接地址
        * @param {any} strFileName 文件名
        * @param {any} strMimeType 文件类型
        * dzl
        * 2020 年 5 月 8 日
         */
export function downloadfile(url, strFileName, strMimeType) {
  var xmlHttp = null
  if (window.ActiveXObject) {
    // IE6, IE5 浏览器执行代码
    xmlHttp = new ActiveXObject('Microsoft.XMLHTTP')
  }
  else if (window.XMLHttpRequest) {
    // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    xmlHttp = new XMLHttpRequest()}
  //2. 如果实例化胜利,就调用 open()办法:if (xmlHttp != null) {xmlHttp.open('get', url, true)
    xmlHttp.responseType = 'blob' // 要害
    xmlHttp.send()
    xmlHttp.onreadystatechange = doResult // 设置回调函数
  }
  function doResult() {if (xmlHttp.readyState == 4) {
      // 4 示意执行实现
      if (xmlHttp.status == 200) {
        //200 示意执行胜利
        download(xmlHttp.response, strFileName, strMimeType)
      }
    }
  }
}

// 调用

 import {downloadfile} from './utils'
 downloadfile(url, name)
//url 必传 

正文完
 0