VUE前端导出文件之file-saver插件安装使用教程

npm install file-saver --save
# 如使用TS开发，可安装file-saver的TypeScript类型定义
npm install @types/file-saver --save-dev

Content-Type: 'application/octet-stream; charset=utf-8'
Content-Disposition: attachment; filename="filename.jpg"; filename*="filename.jpg"
Content-Length: <size in bytes>

import { saveAs } from 'file-saver'

const blob = new Blob([fileStream])		// fileStream 是文件流，一般从后台获取
saveAs(blob, fileName)					// fileName 保存文件的名称，需要带后缀

var FileSaver = require('file-saver');
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
FileSaver.saveAs(blob, "hello world.txt");

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

FileSaver.saveAs("https://wwww.xxxx.org/image", "image.jpg");
在同一源中使用 URL 将只使用 . 否则，它将首先检查它是否支持具有同步头请求的 cors 标头。 如果是这样，它将下载数据并使用 blob URL 进行保存。 如果没有，它将尝试使用 .a[download]a[download]

标准 W3C 文件 API Blob 接口并非在所有浏览器中都可用。Blob.js 是一种跨浏览器实现，可以解决此问题。Blob

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