在Safari浏览器中，替代FileReader的方法是什么？

Question

我是一个新手网页编程，如有基础知识的缺乏还请见谅。

我的页面允许用户选择一个文件，然后在该页面上通过客户端读取并在文本框中显示。我发现最简单的方法是使用FileReader对象，在Firefox和Chrome中运行良好。

但是这种方法在Safari中不起作用（至少目前不支持），那么我该怎么办呢？

//When the eventlistener detects a change in the input file...
var file = evt.target.files[0]
var reader = new FileReader();
reader.onload = function (e){document.getElementById('data').value = e.target.result};
reader.readAsText(file);

相关说明：

• 我正在使用Safari for windows浏览器
• 现在这个页面是本地的，要读取的文件也是本地的。Chrome浏览器在这种情况下遇到了问题，直到我使用了--allow-file-access-from-files选项。

- Emma

Answer 1

很遗憾，我能想到的唯一答案需要额外消耗一些带宽。

首先，对于支持FileReader的浏览器，可以使用类似if (typeof FileReader !== "undefined"或Modernizr这样的工具来跟随正常流程。否则，通过AJAX将文件POST到一些服务器端脚本，然后回显内容。

因此，对于符合规范的浏览器，您可以节省一些带宽，而对于不符合规范的浏览器，则需要为团队做出贡献。

- Quickredfox

---

也许这个可以满足你的需求：https://github.com/dcneiner/Downloadify - Quickredfox

谢谢！感觉有点傻，但我只是不知道其他可能性是什么（当你还是新手时，这种情况经常发生！） - Emma

我真的很喜欢你的回答，看起来是处理这种情况的一种负责任的方式。谢谢。 - Gaston Sanchez

@Quickredfox 兄弟，我也有同样的问题，我已经理解了第一部分并且它完美地运行了。但是 Ajax 部分让我感到困惑。我需要在 Ajax 中发送整个输入文件吗？请详细解释一下，以下是我的代码。function showimagepreview(input) { if(input.files && input.files[0]) { if (window.FileReader){ var fr=new FileReader(); fr.onload=function(e) { $("#image").attr('src',e.target.result); $("#storedProfileImage").attr('value',e.target.result); } fr.readAsDataURL(input.files[0]); } else{ alert(); console.log(input.files); } } } - user5292425

Answer 2

另一种解决方案是使用“使用Flash的Internet Explore和Safari的FileReader polyfill”。

请参见：https://github.com/Jahdrien/FileReader

- Tony