Открытие локальных файлов из Chrome

Можно ли открыть локальный файл на файловой системе / сетевом диске (c:\abc.xlsx или же p:\abc.xlsx)?

Если это так, возможно ли сделать это через собственное расширение, которое я создаю для Google Chrome?

2 ответа

Это можно сделать, установив --allow-file-access-from-files флаг.

Вместо того, чтобы нормально открывать Chrome, запустите:

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

Источник.

Наконец, HTML5 предоставляет стандартный способ взаимодействия с локальными файлами через спецификацию File API.

Спецификация предоставляет несколько интерфейсов для доступа к файлам из "локальной" файловой системы:

  1. Файл - отдельный файл; предоставляет информацию только для чтения, такую ​​как имя, размер файла, mimetype и ссылку на дескриптор файла.
  2. FileList - массивоподобная последовательность объектов File. (Подумайте или перетащите каталог файлов с рабочего стола).
  3. Blob - позволяет разбивать файл на байтовые диапазоны.

При использовании в сочетании с вышеуказанными структурами данных интерфейс FileReader может использоваться для асинхронного чтения файла с помощью привычной обработки событий JavaScript. Таким образом, можно отслеживать ход чтения, отлавливать ошибки и определять, когда загрузка завершена. Во многом API-интерфейсы напоминают модель событий XMLHttpRequest.

Первое, что нужно сделать, это убедиться, что ваш браузер полностью поддерживает File 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);

Чтобы прочитать файл, расширьте 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);

Наконец, вот спецификация файла: http://www.w3.org/TR/file-upload/

Другие вопросы по тегам