浏览器端文件保存器FileSaver.js

FileSaver.js

主要解决在客户端保存文件的问题，特别是WEB应用中，在浏览器内生成文件并下载。

支持的浏览器：

Browser	Constructs as	Filenames	Max Blob Size	Dependencies
Firefox 20+	Blob	Yes	800 MiB	None
Firefox < 20	data: URI	No	n/a	Blob.js
Chrome	Blob	Yes	2GB	None
Chrome for Android	Blob	Yes	RAM/5	None
Edge	Blob	Yes	?	None
IE 10+	Blob	Yes	600 MiB	None
Opera 15+	Blob	Yes	500 MiB	None
Opera < 15	data: URI	No	n/a	Blob.js
Safari 6.1+*	Blob	No	?	None
Safari < 6	data: URI	No	n/a	Blob.js
Safari 10.1+	Blob	Yes	n/a	None

检测浏览器是否支持：

try {

    var isFileSaverSupported = !!new Blob;

} catch (e) {}

Node.JS 安装

npm install file-saver --save

bower install file-saver

TypeScript类型定义安装:

npm install @types/file-saver --save-dev

​

TypeScript示例

import * as FileSaver from 'file-saver';

// 保存文本文件
const blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
FileSaver.saveAs(blob, "hello world.txt");

//保存URL
FileSaver.saveAs("https://httpbin.org/image", "image.jpg");

//保存canvas
const canvas = document.getElementById("my-canvas");
canvas.toBlob(function(blob) {
    saveAs(blob, "pretty image.png");
});