亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

使用JS?的download庫在瀏覽器直接下載文件

 更新時(shí)間:2022年12月22日 09:20:20   投稿:yin  
一般情況下web項(xiàng)目的瀏覽器下載文件,都是使用form表單或者ajax向后端提交數(shù)據(jù),發(fā)送請(qǐng)求,后端文件的URL地址或者二進(jìn)制文件流。這篇文章主要介紹了使用JS?的download庫在瀏覽器直接下載文件。

一般情況下web項(xiàng)目的瀏覽器下載文件,都是使用form表單或者ajax向后端提交數(shù)據(jù),發(fā)送請(qǐng)求,后端文件的URL地址或者二進(jìn)制文件流。這篇文章主要介紹了使用JS 的download庫在瀏覽器直接下載文件。

HTML5 a 標(biāo)簽可以使用 download 屬性來設(shè)置資源的下載,但需要是同源,如果瀏覽器可以解析也會(huì)直接打開。

這時(shí)我們可以通過第三方庫 download 來實(shí)現(xiàn)更完整的下載功能。

download.js

download.js 獲取來源:

  • Github 地址:https://github.com/rndme/download
  • 本站下載地址:https://static.runoob.com/download/download-master.zip
  • CDN 庫:https://cdn.staticfile.org/downloadjs/1.4.8/download.min.js
  • NPM 安裝:npm install downloadjs

使用說明

download.js 庫提供了 download() 函數(shù)用于下載文件。下載內(nèi)容可以是 URL、字符串、Blob 或類型化的數(shù)據(jù)數(shù)組,或者通過將文件數(shù)據(jù)表示為 base64 或 url 編碼字符串的 dataURL。

無論輸入格式如何,download() 都使用指定的文件名和 mime 信息以與使用 Content-Disposition HTTP 標(biāo)頭的服務(wù)器相同的方式保存文件。

download(data, strFileName, strMimeType);
  • data - 下載的數(shù)據(jù)內(nèi)容,可以是 Blob、File、String 或 dataURL。
  • strFileName - 要?jiǎng)?chuàng)建的文件的名稱。
  • strMimeType - 要下載的文件的 MIME 內(nèi)容類型。

用法示例

文本

將字符串存儲(chǔ)到 dlText.txt 文件中并下載:

download("hello world", "dlText.txt", "text/plain");

dataURL 文本實(shí)例:

download("data:text/plain,hello%20world", "dlDataUrlText.txt", "text/plain");

blob 文本實(shí)例:

download(new Blob(["hello world"]), "dlTextBlob.txt", "text/plain");

url 實(shí)例:

download("/robots.txt");

UInt8 文本數(shù)組實(shí)例:

var str= "hello world",????arr= new Uint8Array(str.length);
str.split("").forEach(function(a,b){
  arr[b]=a.charCodeAt();
});

download( arr, "textUInt8Array.txt", "text/plain" );

HTML

html 字符串實(shí)例:

download(document.documentElement.outerHTML, "dlHTML.html", "text/html");

html Blob 實(shí)例:

download(new Blob(["hello world".bold()]), "dlHtmlBlob.html", "text/html");

ajax 回調(diào)實(shí)例:

$.ajax({
????????url: "/download.html",
????????success: download.bind(true, "text/html", "dlAjaxCallback.html")
});

二進(jìn)制文件

圖片 URL:

download("/diff6.png");

異步下載圖片:

var x=new XMLHttpRequest();
x.open( "GET", "/diff6.png" , true);
x.responseType="blob";
x.onload= function(e){download(e.target.response, "awesomesauce.png", "image/png");};
x.send();

到此這篇關(guān)于使用JS 的download庫在瀏覽器直接下載文件的文章就介紹到這了,更多相關(guān)download.js下載文件內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • TypeScript 基本數(shù)據(jù)類型實(shí)例詳解

    TypeScript 基本數(shù)據(jù)類型實(shí)例詳解

    這篇文章主要為大家介紹了TypeScript 基本數(shù)據(jù)類型實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-01-01
  • TS中Array.reduce提示沒有與此調(diào)用匹配的重載解析

    TS中Array.reduce提示沒有與此調(diào)用匹配的重載解析

    這篇文章主要為大家介紹了TS中Array.reduce提示沒有與此調(diào)用匹配的重載解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-06-06
  • rollup?cli開發(fā)全面系統(tǒng)性rollup源碼分析

    rollup?cli開發(fā)全面系統(tǒng)性rollup源碼分析

    這篇文章主要為大家介紹了rollup?cli開發(fā)全網(wǎng)系統(tǒng)性rollup源碼分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-01-01
  • 前端輕量級(jí)MVC框架CanJS詳解

    前端輕量級(jí)MVC框架CanJS詳解

    你可能聽說了這個(gè)新MVC框架: CanJS。還有什么比用它來創(chuàng)建一個(gè)聯(lián)系人Web App更能深入了解它的辦法呢?當(dāng)看完這篇教程,你將全面了解用它的什么工具來創(chuàng)建你自己的Web App。
    2014-09-09
  • 數(shù)據(jù)結(jié)構(gòu)TypeScript之鏈表實(shí)現(xiàn)詳解

    數(shù)據(jù)結(jié)構(gòu)TypeScript之鏈表實(shí)現(xiàn)詳解

    這篇文章主要為大家介紹了數(shù)據(jù)結(jié)構(gòu)TypeScript之鏈表實(shí)現(xiàn)詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-01-01
  • TypeScript前端上傳文件到MinIO示例詳解

    TypeScript前端上傳文件到MinIO示例詳解

    這篇文章主要為大家介紹了TypeScript前端上傳文件到MinIO示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2022-10-10
  • 移動(dòng)設(shè)備web開發(fā)首選框架:zeptojs介紹

    移動(dòng)設(shè)備web開發(fā)首選框架:zeptojs介紹

    這篇文章主要介紹了移動(dòng)設(shè)備web開發(fā)首選框架:zeptojs介紹,他兼容jquery的API,所以學(xué)起來或用起來并不吃力,需要的朋友可以參考下
    2015-01-01
  • 使用three.js 畫漸變的直線

    使用three.js 畫漸變的直線

    這篇文章主要介紹了使用three.js 畫漸變的直線的相關(guān)資料以及具體的實(shí)例代碼,有需要的小伙伴可以參考下
    2016-06-06
  • Underscore.js常用方法總結(jié)

    Underscore.js常用方法總結(jié)

    這篇文章主要介紹了Underscore.js常用方法總結(jié),本文講解了Underscore.js概述、在node.js下安裝、與集合有關(guān)的方法、與對(duì)象有關(guān)的方法、與函數(shù)相關(guān)的方法等內(nèi)容,需要的朋友可以參考下
    2015-02-02
  • TypeScript快速上手—html中使用ts的兩種方法

    TypeScript快速上手—html中使用ts的兩種方法

    TypeScript使用命令行編譯器tsc或其他工具手動(dòng)執(zhí)行編譯,在html使用s時(shí)編譯為JavaScript,那么有沒有辦法簡化過程,不編譯直接使用,本文介紹html中使用TypeScript的兩種方法
    2024-07-07

最新評(píng)論