客户端保存文件组件FileSaver.js的简单使用
FileSaver.js 是在客户端保存文件的解决方案,非常适合需要生成文件
语法:
FileSaver saveAs(Blob/File data, optional DOMString filename, optional Boolean disableAutoBOM)
示例:
<canvas id="example" width="600" height="300" style="border: solid 1px #ccc"></canvas> <script src="./plugins/FileSaver.js"></script> <script> // 保存文本 saveAs( new Blob([JSON.stringify({ aa: 1 })], { type: "text/plain;charset=utf-8", }), "file.txt" ); saveAs( new Blob(["Hello, world!"], { type: "text/plain;charset=utf-8", }), "file2.txt" ); //保存画布 var canvas = document.getElementById("example"); const context = canvas.getContext("2d"); context.moveTo(0, 0); context.lineTo(100, 0); context.lineTo(100, 100); context.lineTo(0, 100); context.lineTo(0, 0); context.stroke(); canvas.toBlob(function (blob) { saveAs(blob, "img.png"); }); //保存文件 var file = new File(["Hello, world222!"], { type: "text/plain;charset=utf-8" }); saveAs(file, "file3.txt"); </script>