Javascript 从chrome打开本地文件

是否可以在文件系统/网络驱动器上打开本地文件（

c:\abc.xlsx

或

p:\abc.xlsx

）

---

如果是这样，是否可以通过我为Google Chrome创建的自定义扩展名执行此操作？

可以通过设置

--允许从文件访问文件

标志来执行此操作

运行以下命令，而不是正常打开Chrome：

path\to\your\chrome\installation\chrome.exe --allow-file-access-from-files

---

HTML5最终通过文件API规范提供了与本地文件交互的标准方式

该规范提供了几个用于从“本地”文件系统访问文件的接口：

文件-单个文件；提供只读信息，例如名称、文件大小、mimetype和对文件句柄的引用

FileList—类似数组的文件对象序列。（思考或从桌面拖动文件目录）

Blob-允许将文件切片为字节范围

当与上述数据结构结合使用时，FileReader接口可用于通过熟悉的JavaScript事件处理异步读取文件。因此，可以监视读取的进度、捕获错误并确定加载何时完成。在许多方面，API类似于XMLHttpRequest的事件模型

首先要做的是检查浏览器是否完全支持文件API：

// Check for the various File API support.
if (window.File && window.FileReader && window.FileList && window.Blob) {
  // Great success! All the File APIs are supported.  
} else {
  alert('The File APIs are not fully supported in this browser.');
}

接下来，处理文件选择：

<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>

<script>
function handleFileSelect(evt) {
  var files = evt.target.files; // FileList object

  // files is a FileList of File objects. List some properties.
  var output = [];
  for (var i = 0, f; f = files[i]; i++) {
    output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
                f.size, ' bytes, last modified: ',
                f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
                '</li>');
  }
  document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
}

document.getElementById('files').addEventListener('change', handleFileSelect, false);

功能手柄文件选择（evt）{
var files=evt.target.files；//文件列表对象
//文件是文件对象的文件列表。请列出一些属性。
var输出=[]；
for（var i=0，f；f=files[i]；i++）{
output.push（“
”，escape（f.name），“（”，f.type | | |“n/a”，“）-”，
f、 大小，'字节，上次修改：'，
f、 lastModifiedDate？f.lastModifiedDate.toLocaleDateString（）：“不适用”，
“
”）；
}
document.getElementById（'list'）.innerHTML='
'+output.join（''）+'
'；
}
document.getElementById（'files'）.addEventListener（'change'，handleFileSelect，false）；

要读取文件，请扩展handleFileSelect，如下所示：

function handleFileSelect(evt) {
  var files = evt.target.files; // FileList object

  // Loop through the FileList and render image files as thumbnails.
  for (var i = 0, f; f = files[i]; i++) {

    // Only process image files.
    if (!f.type.match('image.*')) {
      continue;
    }

    var reader = new FileReader();

    // Closure to capture the file information.
    reader.onload = (function(theFile) {
      return function(e) {
        // Render thumbnail.
        var span = document.createElement('span');
        span.innerHTML = ['<img class="thumb" src="', e.target.result,
                          '" title="', escape(theFile.name), '"/>'].join('');
        document.getElementById('list').insertBefore(span, null);
      };
    })(f);

    // Read in the image file as a data URL.
    reader.readAsDataURL(f);
  }
}

document.getElementById('files').addEventListener('change', handleFileSelect, false);

功能手柄文件选择（evt）{
var files=evt.target.files；//文件列表对象
//循环浏览文件列表并将图像文件渲染为缩略图。
for（var i=0，f；f=files[i]；i++）{
//仅处理图像文件。
如果（！f.type.match（'image.*'））{
继续；
}
var reader=new FileReader（）；
//闭包以捕获文件信息。
reader.onload=（函数（文件）{
返回函数（e）{
//渲染缩略图。
var span=document.createElement（'span'）；
span.innerHTML=[''）.join（''）；
document.getElementById（'list'）.insertBefore（span，null）；
};
})（f） )；
//作为数据URL读入图像文件。
reader.readAsDataURL（f）；
}
}
document.getElementById（'files'）.addEventListener（'change'，handleFileSelect，false）；

---

最后，这里是文件规范：

不是没有更多的工作。您必须编写一个后端，从您创建的某个网页中获取新数据并将其写回文件。在Ubuntu 16.04上使用Chrome 63.0.3239.132（64位）时，此功能不再有效。