Javascript:跨浏览器无服务器文件上传和下载

问题描述:

所以我正在开发一个用户需要的网络应用:

So I'm working on a web app where a user will need to:

  • 提供一个充满数据的文件以供处理
  • 将结果保存到文件中

所有操作都是在 javascript 中完成的,所以我真的不需要服务器端代码(只是静态托管),我喜欢这种方式.

All the manipulation is done in javascript, so I don't really have a need for server-side code yet (just static hosting), and I like it that way.

在 Firefox 中,我可以使用他们的 文件操作 api 来允许用户上传文件直接进入客户端代码(使用标准 <input type=file/>)并从文件中创建一个对象 URL,以便用户可以保存由客户端创建的文件代码.

In Firefox, I can use their file manipulation api to allow a user to upload a file directly into the client-side code (using a standard <input type=file/>) and create an object URL out of a file so a user can save a file created by the client-side code.

<input type="file" id="input" onchange="handleFiles(this.files)">
<a download="doubled" id="ex">right-click and save as</a>
<script>
  function handleFiles(fileList){
    var builder = new MozBlobBuilder();
    var file = fileList[0];
    var text = file.getAsBinary();
    builder.append(text);
    builder.append(text);
    document.getElementById('ex').href = window.URL.createObjectURL( builder.getBlob() );
  }
</script>

所以这很棒.现在我想在其他浏览器中做同样的事情——或者至少是其他浏览器的现代版本.Chrome 和 IE 是否存在类似的 API?如果是这样,是否有人已经构建了一个我应该使用的跨浏览器包装器?

So this is great. Now I want to do the same in other browsers - or, at least, modern versions of other browsers. Do similar APIs exist for Chrome and IE? If so, has anyone already built a cross-browser wrapper that I should be using?

它主要适用于 Firefox 3.6+、Chrome 10+、Opera 11.1+,并希望适用于 Safari 6 和 IE 10.

It's mostly available on Firefox 3.6+, Chrome 10+, Opera 11.1+, and hopefully Safari 6 and IE 10.

请参阅:http://caniuse.com/#search=FileReader.