在HTML页面上打开客户端的纯文本文件

Question

你怎么能用HTML在客户端机器上以明文（即.cpp，.txt甚至.html文件）打开文件？我想从用户的计算机中将纯文本文件解压缩为HTML <textarea>。仅供参考，我正在使用hiccup，clojure和webnoir来生成HTML和服务器，因此这些都是用于帮助整个过程的所有其他选项。

Answer 1

快速而肮脏的选择就是简单地slurp：

(slurp "mycode.cpp")

Answer 2

您有两个主要选项：将文件上传到服务器以作为HTML内容提供，或使用HTML 5 File API。 This question还提供了更多选项（例如applet，使用File API启用拖放等）。

---

上传文件

1. 让用户在一个页面上使用<input type="file" .../>选择文件
2. 将文件内容上传到您的服务器。
3. 重定向到其他页面以显示文件内容
4. 将上传文件的内容提供给该页面上的文本区域。

<强>赞成：

• 这种方法非常简单明了。
• 您可以扫描文件并在服务器上进行繁重的处理

缺点：

• 到服务器的旅行可能非常耗时。

---

HTML 5解决方案

1. 让用户使用<input type="file" .../>
选择文件
2. 使用JavaScript将文件加载到HTML 5本地存储中，而不是发布内容（请参阅下面的代码）
3. 使用JavaScript将文件内容插入DOM。

<强>赞成：

• 没有去服务器（更快）

缺点：

• 任何和所有验证/处理必须在JavaScript中在客户端完成。这使您的客户端更重，并允许用户查看/修改您的代码（您可能不需要关心）。

我从this site抓取了这段代码片段，其中有一些使用文件API的好例子：

function onInitFs(fs) {

  fs.root.getFile('log.txt', {}, function(fileEntry) {

    // Get a File object representing the file,
    // then use FileReader to read its contents.
    fileEntry.file(function(file) {
       var reader = new FileReader();

       reader.onloadend = function(e) {
           // Do something with the contents, which are stored in 'this.result'
       };

       reader.readAsText(file);
    }, errorHandler);

  }, errorHandler);

}

window.requestFileSystem(window.TEMPORARY, 1024*1024, onInitFs, errorHandler);