我们正在使用 fusioncharts，它能够在客户端使用 javascript 导出 csv 数据，我们希望能够获取该数据并在浏览器中动态创建文件。那可能吗？怎么样？
【问题讨论】：
标签： javascript html
尝试下面的代码允许您访问客户端文件系统，但这仅适用于 IE 浏览器
<html>
<body>
<script language="JScript">
<!--
function getsize()
{
var myObject, afile, size;
myObject = new ActiveXObject("Scripting.FileSystemObject");
afile = myObject.GetFile("c:\\test.txt")
size = afile.Size;
alert("The size of the test.txt file is:" + size);
}
-->
</script>
Get the size for the file "test.txt"
<form name="myForm">
<input type="Button" value="Get Size" onClick='getsize()'>
</form>
</body>
</html>
【讨论】：
看看filesaver.js。只要您对 IE10+ 没问题，这是一个非常可靠的解决方案，可以根据浏览器使用最佳方法优雅地处理。
【讨论】：
由于 Marc 的答案（愚蠢地）被转换为评论，而其他答案都没有真正回答这个问题，所以答案如下：
<a id="a">Click me to DL something</a>
<script>
setupDownloadLink(document.getElementById("a"), "moose.txt", "ok")
function setupDownloadLink(element, filename, text) {
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text))
element.setAttribute('download', filename)
}
</script>
这源自 Marc 引用的答案，这在您没有专门点击链接标签的情况下很有用：https://stackoverflow.com/a/3665147/279255
// must be called in a click handler or some other user action
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);
}
【讨论】：
设计使您无法使用 Javascript 访问本地磁盘。
我认为您可以将整个数据从 javascript 传递到服务器端代码（php、asp.net、java...），然后您可以以某种方式将其流式传输到浏览器。
【讨论】：
我建议您不要在客户端本地创建文件，而是提示用户（另存为对话框）在他想要的位置下载客户端生成的数据。
通过 javascript 下载本地/客户端内容的解决方案并不简单。我已经使用 smartclient-html-jsp 实现了一种解决方案。
解决办法如下：
<%@ page import="java.util.*,java.io.*,java.util.Enumeration"%>
<%
response.setContentType ("text/csv");
//set the header and also the Name by which user will be prompted to save
response.setHeader ("Content-Disposition", "attachment;filename=\"data.csv\"");
String contents = request.getParameter ("text");
if (!(contents!= null && contents!=""))
contents = "No data";
else
contents = contents.replaceAll ("NEW_LINE", "\n");
//Open an input stream to the file and post the file contents thru the
//servlet output stream to the client m/c
InputStream in = new ByteArrayInputStream(contents.getBytes ());
ServletOutputStream outs = response.getOutputStream();
int bit = 256;
int i = 0;
try {
while ((bit) >= 0) {
bit = in.read();
outs.write(bit);
}
//System.out.println("" +bit);
} catch (IOException ioe) {
ioe.printStackTrace(System.out);
}
outs.flush();
outs.close();
in.close();
%>
<HTML>
<HEAD>
</HEAD>
<BODY>
<script type="text/javascript">
try {window.close ();} catch (e) {alert (e);}
</script>
</BODY>
</HTML>
此代码在生产环境中经过测试和部署/工作，这也是跨浏览器的功能。
【讨论】：