有什么方法可以在客户端创建一个文本文件,并提示用户下载它,而不与服务器进行任何交互? 我知道我不能直接写到他们的机器上(安全等),但是我可以创建并提示他们保存它吗?
当前回答
如果文件包含文本数据,我使用的一种技术是将文本放入textarea元素中,并让用户选择它(在textarea中单击,然后按ctrl-A),然后复制,然后粘贴到文本编辑器。
其他回答
下载文件扩展或没有扩展的例子中,我使用的是JSON。您可以添加数据和扩展。你可以使用mac地址。Json在这里,如你所愿。如果你想添加一个扩展名,在那里添加,否则,只写没有扩展名的文件名。
let myJson = JSON.stringify(yourdata);
let element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(myJson));
element.setAttribute('download', 'MAC-Addresses.json');
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
如前所述,filesaver是在客户端处理文件的一个很棒的包。但是,它不能很好地处理大文件。streamsave .js是一个可以处理大文件的替代解决方案(在FileServer.js中指向):
const fileStream = streamSaver.createWriteStream('filename.txt', size);
const writer = fileStream.getWriter();
for(var i = 0; i < 100; i++){
var uint8array = new TextEncoder("utf-8").encode("Plain Text");
writer.write(uint8array);
}
writer.close()
来自github.com/kennethjiang/js-file-download的js-file-download包处理浏览器支持的边缘情况:
查看源代码以查看它如何使用本页中提到的技术。
安装
yarn add js-file-download
npm install --save js-file-download
使用
import fileDownload from 'js-file-download'
// fileDownload(data, filename, mime)
// mime is optional
fileDownload(data, 'filename.csv', 'text/csv')
function download(filename, text) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}
// Start file download.
download("hello.txt","This is the content of my file :)");
原文:https://ourcodeworld.com/articles/read/189/how-to-create-a-file-and-generate-a-download-with-javascript-in-the-browser-without-a-server
对我来说,这工作得很完美,下载了相同的文件名和扩展名
<a href={“数据:应用程序/ octestream;charset=utf-16le;base64]下载= =
'title'是带扩展名的文件名,例如sample.pdf, waterfall.jpg等。
'file64'是base64内容,例如,ww6idewndasifnsawrpbmdty2fszudyb3vwoiair3jvdxagqiisie1lzgljywxwaxnpdezsyxrgwu6idm1lcbezw50ywxqyvvyy2vudgfnztogmjusifbyb2nlzhvyzvblcmnlbnq6idcwlkcffsb7ikdyywjoir3jvdxagqinsawrpbmdty2fszudyb3vwijir3jvdxagqiisik1lzgljyw50ywxqyxlwuiojm1lcjzw50ywxqyxljuvgvycnkgtgliiwiugf0awvudexpc3qiolt7ilbhdglbnro