前端实现视频或者图片直链下载

为了解决这一问题，我们可以通过以下方法，实现视频或者图片直链下载

downVideo (url, name){
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  xhr.responseType = 'arraybuffer';    // 返回类型blob
  xhr.onload = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
      let blob = this.response;
	  // 转换一个blob链接
      let u = window.URL.createObjectURL(new Blob([blob],{ type: 'video/mp4' })) // 视频的type是video/mp4，图片是image/jpeg
	  let a = document.createElement('a');
	  a.download = name; // 设置下载的文件名
	  a.href = u;
	  a.style.display = 'none'
	  document.body.appendChild(a)
	  a.click();
	  a.remove();
	}
  };
  xhr.send()
}

//调用  点击按钮实现mp4格式视频下载
downVideo(video.download_url,video.title)

index.html中加上这一句

<meta name=referrer content=no-referrer>

备注：blob 导出 的content-type 类型

1 Response.AddHeader(“content-type”, “application/x-msdownload;”);类型列表
2 “."=“application/octet-stream”
3 “.001”=“application/x-001”
4 “.301”=“application/x-301”
5 “.323”=“text/h323”
6 “.906”=“application/x-906”
7 “.907”=“drawing/907”
8 “.a11”=“application/x-a11”
9 “.acp”=“audio/x-mei-aac”
10 “.ai”=“application/postscript”
11 “.aif”=“audio/aiff”
12 “.aifc”=“audio/aiff”
13 “.aiff”=“audio/aiff”
14 “.anv”=“application/x-anv”
15 “.asa”=“text/asa”
16 “.asf”=“video/x-ms-asf”
17 “.asp”=“text/asp”
18 “.asx”=“video/x-ms-asf”
19 “.au”=“audio/basic”
20 “.avi”=“video/avi”
21 “.awf”=“application/vnd.adobe.workflow”
22 “.biz”=“text/xml”
23 “.bmp”=“application/x-bmp”
24 “.bot”=“application/x-bot”
25 “.c4t”=“application/x-c4t”
26 “.c90”=“application/x-c90”
27 “.cal”=“application/x-cals”
28 “.cat”=“application/vnd.ms-pki.seccat”
29 “.cdf”=“application/x-netcdf”
30 “.cdr”=“application/x-cdr”
31 “.cel”=“application/x-cel”
32 “.cer”=“application/x-x509-ca-cert”
33 “.cg4”=“application/x-g4”
34 “.cgm”=“application/x-cgm”
35 “.cit”=“application/x-cit”
36 “.class”="java/”
37 “.cml”=“text/xml”
38 “.cmp”=“application/x-cmp”
39 “.cmx”=“application/x-cmx”
40 “.cot”=“application/x-cot”
41 “.crl”=“application/pkix-crl”
42 “.crt”=“application/x-x509-ca-cert”
43 “.csi”=“application/x-csi”
44 “.css”=“text/css”
45 “.cut”=“application/x-cut”
46 “.dbf”=“application/x-dbf”
47 “.dbm”=“application/x-dbm”
48 “.dbx”=“application/x-dbx”
49 “.dcd”=“text/xml”
50 “.dcx”=“application/x-dcx”
51 “.der”=“application/x-x509-ca-cert”
52 “.dgn”=“application/x-dgn”
53 “.dib”=“application/x-dib”
54 “.dll”=“application/x-msdownload”
55 “.doc”=“application/msword”
56 “.dot”=“application/msword”
57 “.drw”=“application/x-drw”
58 “.dtd”=“text/xml”
59 “.dwf”=“Model/vnd.dwf”
60 “.dwf”=“application/x-dwf”
61 “.dwg”=“application/x-dwg”
62 “.dxb”=“application/x-dxb”
63 “.dxf”=“application/x-dxf”
64 “.edn”=“application/vnd.adobe.edn”
65 “.emf”=“application/x-emf”
66 “.eml”=“message/rfc822”
67 “.ent”=“text/xml”
68 “.epi”=“application/x-epi”
69 “.eps”=“application/x-ps”
70 “.eps”=“application/postscript”
71 “.etd”=“application/x-ebx”
72 “.exe”=“application/x-msdownload”
73 “.fax”=“image/fax”
74 “.fdf”=“application/vnd.fdf”
75 “.fif”=“application/fractals”
76 “.fo”=“text/xml”
77 “.frm”=“application/x-frm”
78 “.g4”=“application/x-g4”
79 “.gbr”=“application/x-gbr”
80 “.gcd”=“application/x-gcd”
81 “.gif”=“image/gif”
82 “.gl2”=“application/x-gl2”
83 “.gp4”=“application/x-gp4”
84 “.hgl”=“application/x-hgl”
85 “.hmr”=“application/x-hmr”
86 “.hpg”=“application/x-hpgl”
87 “.hpl”=“application/x-hpl”
88 “.hqx”=“application/mac-binhex40”
89 “.hrf”=“application/x-hrf”
90 “.hta”=“application/hta”
91 “.htc”=“text/x-component”
92 “.htm”=“text/html”
93 “.html”=“text/html”
94 “.htt”=“text/webviewhtml”
95 “.htx”=“text/html”
96 “.icb”=“application/x-icb”
97 “.ico”=“image/x-icon”
98 “.ico”=“application/x-ico”
99 “.iff”=“application/x-iff”
100 “.ig4”=“application/x-g4”
101 “.igs”=“application/x-igs”
102 “.iii”=“application/x-iphone”
103 “.img”=“application/x-img”
104 “.ins”=“application/x-internet-signup”
105 “.isp”=“application/x-internet-signup”
106 “.IVF”=“video/x-ivf”
107 “.java”=“java/*”
108 “.jfif”=“image/jpeg”
109 “.jpe”=“image/jpeg”
110 “.jpe”=“application/x-jpe”
111 “.jpeg”=“image/jpeg”
112 “.jpg”=“image/jpeg”
113 “.jpg”=“application/x-jpg”
114 “.js”=“application/x-javascript”
115 “.jsp”=“text/html”
116 “.la1”=“audio/x-liquid-file”
117 “.lar”=“application/x-laplayer-reg”
118 “.latex”=“application/x-latex”
119 “.lavs”=“audio/x-liquid-secure”
120 “.lbm”=“application/x-lbm”
121 “.lmsff”=“audio/x-la-lms”
122 “.ls”=“application/x-javascript”
123 “.ltr”=“application/x-ltr”
124 “.m1v”=“video/x-mpeg”
125 “.m2v”=“video/x-mpeg”
126 “.m3u”=“audio/mpegurl”
127 “.m4e”=“video/mpeg4”
128 “.mac”=“application/x-mac”
129 “.man”=“application/x-troff-man”
130 “.math”=“text/xml”
131 “.mdb”=“application/msaccess”
132 “.mdb”=“application/x-mdb”
133 “.mfp”=“application/x-shockwave-flash”
134 “.mht”=“message/rfc822”
135 “.mhtml”=“message/rfc822”
136 “.mi”=“application/x-mi”
137 “.mid”=“audio/mid”
138 “.midi”=“audio/mid”
139 “.mil”=“application/x-mil”
140 “.mml”=“text/xml”
141 “.mnd”=“audio/x-musicnet-download”
142 “.mns”=“audio/x-musicnet-stream”
143 “.mocha”=“application/x-javascript”
144 “.movie”=“video/x-sgi-movie”
145 “.mp1”=“audio/mp1”
146 “.mp2”=“audio/mp2”
147 “.mp2v”=“video/mpeg”
148 “.mp3”=“audio/mp3”
149 “.mp4”=“video/mpeg4”
150 “.mpa”=“video/x-mpg”
151 “.mpd”=“application/vnd.ms-project”
152 “.mpe”=“video/x-mpeg”
153 “.mpeg”=“video/mpg”
154 “.mpg”=“video/mpg”
155 “.mpga”=“audio/rn-mpeg”
156 “.mpp”=“application/vnd.ms-project”
157 “.mps”=“video/x-mpeg”
158 “.mpt”=“application/vnd.ms-project”
159 “.mpv”=“video/mpg”
160 “.mpv2”=“video/mpeg”
161 “.mpw”=“application/vnd.ms-project”
162 “.mpx”=“application/vnd.ms-project”
163 “.mtx”=“text/xml”
164 “.mxp”=“application/x-mmxp”
165 “.net”=“image/pnetvue”
166 “.nrf”=“application/x-nrf”
167 “.nws”=“message/rfc822”
168 “.odc”=“text/x-ms-odc”
169 “.out”=“application/x-out”
170 “.p10”=“application/pkcs10”
171 “.p12”=“application/x-pkcs12”
172 “.p7b”=“application/x-pkcs7-certificates”
173 “.p7c”=“application/pkcs7-mime”
174 “.p7m”=“application/pkcs7-mime”
175 “.p7r”=“application/x-pkcs7-certreqresp”
176 “.p7s”=“application/pkcs7-signature”
177 “.pc5”=“application/x-pc5”
178 “.pci”=“application/x-pci”
179 “.pcl”=“application/x-pcl”
180 “.pcx”=“application/x-pcx”
181 “.pdf”=“application/pdf”
182 “.pdf”=“application/pdf”
183 “.pdx”=“application/vnd.adobe.pdx”
184 “.pfx”=“application/x-pkcs12”
185 “.pgl”=“application/x-pgl”
186 “.pic”=“application/x-pic”
187 “.pko”=“application/vnd.ms-pki.pko”
188 “.pl”=“application/x-perl”
189 “.plg”=“text/html”
190 “.pls”=“audio/scpls”
191 “.plt”=“application/x-plt”
192 “.png”=“image/png”
193 “.png”=“application/x-png”
194 “.pot”=“application/vnd.ms-powerpoint”
195 “.ppa”=“application/vnd.ms-powerpoint”
196 “.ppm”=“application/x-ppm”
197 “.pps”=“application/vnd.ms-powerpoint”
198 “.ppt”=“application/vnd.ms-powerpoint”
199 “.ppt”=“application/x-ppt”
200 “.pr”=“application/x-pr”
201 “.prf”=“application/pics-rules”
202 “.prn”=“application/x-prn”
203 “.prt”=“application/x-prt”
204 “.ps”=“application/x-ps”
205 “.ps”=“application/postscript”
206 “.ptn”=“application/x-ptn”
207 “.pwz”=“application/vnd.ms-powerpoint”
208 “.r3t”=“text/vnd.rn-realtext3d”
209 “.ra”=“audio/vnd.rn-realaudio”
210 “.ram”=“audio/x-pn-realaudio”
211 “.ras”=“application/x-ras”
212 “.rat”=“application/rat-file”
213 “.rdf”=“text/xml”
214 “.rec”=“application/vnd.rn-recording”
215 “.red”=“application/x-red”
216 “.rgb”=“application/x-rgb”
217 “.rjs”=“application/vnd.rn-realsystem-rjs”
218 “.rjt”=“application/vnd.rn-realsystem-rjt”
219 “.rlc”=“application/x-rlc”
220 “.rle”=“application/x-rle”
221 “.rm”=“application/vnd.rn-realmedia”
222 “.rmf”=“application/vnd.adobe.rmf”
223 “.rmi”=“audio/mid”
224 “.rmj”=“application/vnd.rn-realsystem-rmj”
225 “.rmm”=“audio/x-pn-realaudio”
226 “.rmp”=“application/vnd.rn-rn_music_package”
227 “.rms”=“application/vnd.rn-realmedia-secure”
228 “.rmvb”=“application/vnd.rn-realmedia-vbr”
229 “.rmx”=“application/vnd.rn-realsystem-rmx”
230 “.rnx”=“application/vnd.rn-realplayer”
231 “.rp”=“image/vnd.rn-realpix”
232 “.rpm”=“audio/x-pn-realaudio-plugin”
233 “.rsml”=“application/vnd.rn-rsml”
234 “.rt”=“text/vnd.rn-realtext”
235 “.rtf”=“application/msword”
236 “.rtf”=“application/x-rtf”
237 “.rv”=“video/vnd.rn-realvideo”
238 “.sam”=“application/x-sam”
239 “.sat”=“application/x-sat”
240 “.sdp”=“application/sdp”
241 “.sdw”=“application/x-sdw”
242 “.sit”=“application/x-stuffit”
243 “.slb”=“application/x-slb”
244 “.sld”=“application/x-sld”
245 “.slk”=“drawing/x-slk”
246 “.smi”=“application/smil”
247 “.smil”=“application/smil”
248 “.smk”=“application/x-smk”
249 “.snd”=“audio/basic”
250 “.sol”=“text/plain”
251 “.sor”=“text/plain”
252 “.spc”=“application/x-pkcs7-certificates”
253 “.spl”=“application/futuresplash”
254 “.spp”=“text/xml”
255 “.ssm”=“application/streamingmedia”
256 “.sst”=“application/vnd.ms-pki.certstore”
257 “.stl”=“application/vnd.ms-pki.stl”
258 “.stm”=“text/html”
259 “.sty”=“application/x-sty”
260 “.svg”=“text/xml”
261 “.swf”=“application/x-shockwave-flash”
262 “.tdf”=“application/x-tdf”
263 “.tg4”=“application/x-tg4”
264 “.tga”=“application/x-tga”
265 “.tif”=“image/tiff”
266 “.tif”=“application/x-tif”
267 “.tiff”=“image/tiff”
268 “.tld”=“text/xml”
269 “.top”=“drawing/x-top”
270 “.torrent”=“application/x-bittorrent”
271 “.tsd”=“text/xml”
272 “.txt”=“text/plain”
273 “.uin”=“application/x-icq”
274 “.uls”=“text/iuls”
275 “.vcf”=“text/x-vcard”
276 “.vda”=“application/x-vda”
277 “.vdx”=“application/vnd.visio”
278 “.vml”=“text/xml”
279 “.vpg”=“application/x-vpeg005”
280 “.vsd”=“application/vnd.visio”
281 “.vsd”=“application/x-vsd”
282 “.vss”=“application/vnd.visio”
283 “.vst”=“application/vnd.visio”
284 “.vst”=“application/x-vst”
285 “.vsw”=“application/vnd.visio”
286 “.vsx”=“application/vnd.visio”
287 “.vtx”=“application/vnd.visio”
288 “.vxml”=“text/xml”
289 “.wav”=“audio/wav”
290 “.wax”=“audio/x-ms-wax”
291 “.wb1”=“application/x-wb1”
292 “.wb2”=“application/x-wb2”
293 “.wb3”=“application/x-wb3”
294 “.wbmp”=“image/vnd.wap.wbmp”
295 “.wiz”=“application/msword”
296 “.wk3”=“application/x-wk3”
297 “.wk4”=“application/x-wk4”
298 “.wkq”=“application/x-wkq”
299 “.wks”=“application/x-wks”
300 “.wm”=“video/x-ms-wm”
301 “.wma”=“audio/x-ms-wma”
302 “.wmd”=“application/x-ms-wmd”
303 “.wmf”=“application/x-wmf”
304 “.wml”=“text/vnd.wap.wml”
305 “.wmv”=“video/x-ms-wmv”
306 “.wmx”=“video/x-ms-wmx”
307 “.wmz”=“application/x-ms-wmz”
308 “.wp6”=“application/x-wp6”
309 “.wpd”=“application/x-wpd”
310 “.wpg”=“application/x-wpg”
311 “.wpl”=“application/vnd.ms-wpl”
312 “.wq1”=“application/x-wq1”
313 “.wr1”=“application/x-wr1”
314 “.wri”=“application/x-wri”
315 “.wrk”=“application/x-wrk”
316 “.ws”=“application/x-ws”
317 “.ws2”=“application/x-ws”
318 “.wsc”=“text/scriptlet”
319 “.wsdl”=“text/xml”
320 “.wvx”=“video/x-ms-wvx”
321 “.xdp”=“application/vnd.adobe.xdp”
322 “.xdr”=“text/xml”
323 “.xfd”=“application/vnd.adobe.xfd”
324 “.xfdf”=“application/vnd.adobe.xfdf”
325 “.xhtml”=“text/html”
326 “.xls”=“application/vnd.ms-excel”
327 “.xls”=“application/x-xls”
328 “.xlw”=“application/x-xlw”
329 “.xml”=“text/xml”
330 “.xpl”=“audio/scpls”
331 “.xq”=“text/xml”
332 “.xql”=“text/xml”
333 “.xquery”=“text/xml”
334 “.xsd”=“text/xml”
335 “.xsl”=“text/xml”
336 “.xslt”=“text/xml”
337 “.xwd”=“application/x-xwd”
338 “.x_b”=“application/x-x_b”
339 “.x_t”=“application/x-x_t”

文章参考：
https://blog.csdn.net/baidu_41457482/article/details/117106614
https://blog.csdn.net/antuo7251/article/details/101683763?spm=1001.2014.3001.5501