蓝桉云顶

FileSaver.js简介

基本使用

安装与引入

npm install file-saver --save

在Vue项目中：

import { saveAs } from 'file-saver'

在HTML中：

<script src="https://cdn.bootcdn.net/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>

示例代码

保存文本

function saveText() {
    let blob = new Blob(['保存一个文本'], { type: 'text/plain;charset=utf-8' });
    saveAs(blob, 'a.txt');
}

结果：保存一个名为“a.txt”的文本文件。

保存URL

function saveUrl() {
    saveAs('https://ppt.1ppt.com/uploads/soft/2202/1-2202231A334.zip', 'a.zip');
}

注意：对于图片、视频等可以在浏览器打开的文件，不会下载而是会在新窗口中打开，可以通过设置文件类型或将文件转成二进制流来解决此问题。

保存Canvas

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

保存文件

function saveFile() {
    let file = new File(['保存一个文件'], 'a.txt', { type: 'text/plain;charset=utf-8' });
    saveAs(file);
}

CDN引入方式

<script src="//cdn.bootcdn.net/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<script src="//cdn.bootcdn.net/ajax/libs/FileSaver.js/2.0.5/FileSaver.js"></script>

在使用CDN引入时，如果遇到FileSaver.saveAs is not a function的问题，可以尝试将FileSaver.saveAs改为window.saveAs。

FileSaver.js是一个强大的工具，可以方便地在客户端实现文件保存功能，适用于各种Web应用程序，通过简单的API调用，可以轻松地将不同类型的数据保存为文件，并且支持大多数主流浏览器。

以上内容就是解答有关“filesaver cdn”的详细内容了，我相信这篇文章可以为您解决一些疑惑，有任何问题欢迎留言反馈，谢谢阅读。