HTML5是否允許您與瀏覽器內的本地客戶端文件進行交互

Question

我看過一些關於訪問客戶機上的文件的網頁，即question。

我試圖跳過一些算法的「雲中不斷更新」範例，因此我的用戶只需訪問網頁即可訪問最新版本。這要求程序/網頁可以從一個目錄開始，遞歸地檢查其中的文件並根據找到的結果計算結果。最後，它也應該能夠將結果文件寫入客戶端的文件系統。

上一個問題中的答案之一提到了Google Gears，但之後已停止使用HTML5。 訪問HTML5中可能的客戶目錄嗎？怎麼樣？

我知道爲什麼通過任何網頁訪問本地文件是一種安全風險，但爲了我的目的，我沒有問題要求用戶提供適當的權限。

Answer 1

不，至少不是。但是，您在這裏有許多選擇。

目前您最好的選擇是：

• 拖動並從桌面拖放文件，請參閱a tutorial。
• 使用輸入類型文件。
  • 使用File API讀取內容或提交表單。有關動態讀取文件的更多信息，請參見Mozilla Developer Center。
  • 您可以指定multiple屬性來一次讀取和打開多個文件，而不必具有單獨的字段。
  • 你可以有一個不可見的輸入和「觸發點擊」來打開文件打開對話框。有關詳細信息，請參閱以前的Mozilla Developer Center鏈接。
• 使用FileSystem API它允許您創建，刪除，讀取，修改文件系統上的文件。注意：你會得到一個沙盒目錄，你不能像這樣訪問整個系統。
• 使用Java與signed applets來訪問整個文件系統。這要求用戶接受簽名。

Answer 2

的Chrome 6也將支持文件API

Answer 3

正如前面提到的，FileSystem和File的API，與FileWriter API一起，可用於從瀏覽器選項卡中的上下文讀取和寫入文件/窗口到客戶機。

有關於文件系統和FileWriter的API的，你應該知道，其中一些被提及的幾件事情，但值得重複：

這些API的

• 實現目前只存在鉻基（Google瀏覽器&歌劇）
• 無論是原料藥帶下的W3C標準跟蹤2014年4月24日，但截至目前是專有的（現在的專利）的API
• 脫除實現瀏覽器的未來是可能性
• 甲沙箱（在磁盤外哪些文件可以產生沒有影響的位置）用於存儲與所述的API創建的文件
• 甲虛擬文件系統（一個目錄結構，其並不一定存在於磁盤上以與從瀏覽器訪問時相同的形式）被使用表示使用API​​創建的文件

下面是簡單的例子，說明如何直接或間接地使用API​​來做這些事情：

BakedGoods *

寫入文件：

bakedGoods.set({ 
    data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}], 
    storageTypes: ["fileSystem"], 
    options: {fileSystem:{storageType: Window.PERSISTENT}}, 
    complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){} 
}); 

讀文件：

bakedGoods.get({ 
     data: ["testFile"], 
     storageTypes: ["fileSystem"], 
     options: {fileSystem:{storageType: Window.PERSISTENT}}, 
     complete: function(resultDataObj, byStorageTypeErrorObj){} 
}); 

使用RAW文件，FileWriter的，和文件系統的API

寫入文件：

function onQuotaRequestSuccess(grantedQuota) 
{ 

    function saveFile(directoryEntry) 
    { 

     function createFileWriter(fileEntry) 
     { 

      function write(fileWriter) 
      { 
       var dataBlob = new Blob(["Hello world!"], {type: "text/plain"}); 
       fileWriter.write(dataBlob);    
      } 

      fileEntry.createWriter(write); 
     } 

     directoryEntry.getFile(
      "testFile", 
      {create: true, exclusive: true}, 
      createFileWriter 
     ); 
    } 

    requestFileSystem(Window.PERSISTENT, grantedQuota, saveFile); 
} 

var desiredQuota = 1024 * 1024 * 1024; 
var quotaManagementObj = navigator.webkitPersistentStorage; 
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess); 

讀文件：

function onQuotaRequestSuccess(grantedQuota) 
{ 

    function getfile(directoryEntry) 
    { 

     function readFile(fileEntry) 
     { 

      function read(file) 
      { 
       var fileReader = new FileReader(); 

       fileReader.onload = function(){var fileData = fileReader.result}; 
       fileReader.readAsText(file);    
      } 

      fileEntry.file(read); 
     } 

     directoryEntry.getFile(
      "testFile", 
      {create: false}, 
      readFile 
     ); 
    } 

    requestFileSystem(Window.PERSISTENT, grantedQuota, getFile); 
} 

var desiredQuota = 1024 * 1024 * 1024; 
var quotaManagementObj = navigator.webkitPersistentStorage; 
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess); 

鑑於當前狀態的文件系統和FileWriter的的API，其利用讀取和寫入文件目前不構成做這些事情的「HTML5的方式」。儘管如此，從未實施的瀏覽器供應商對API的重新興趣可能會使它們重新回到標準軌道上。這加上基於Chromium的瀏覽器的高市場滲透率以及谷歌（Chromium的主要貢獻者）未向API提供和報廢日期的事實應該足以證明其在某些情況下的使用。

* BakedGoods是不是別人這傢伙就在這裏:)