JavaScript如何在不同瀏覽器中讀取本機檔案內容？

在各種瀏覽器中使用JavaScript 在客戶端讀取檔案內容

在嘗試使用瀏覽器從客戶端電腦讀取檔案內容時，僅使用腳本已為Firefox 和Internet Explorer 開發了解決方案。該解決方案利用了 Firefox 的檔案 API 和 Internet Explorer 的 ActiveXObject。

Firefox 的檔案 API

function getFileContents() {
    var fileForUpload = document.forms[0].fileForUpload;
    var fileName = fileForUpload.value;

    if (fileForUpload.files) {
        var fileContents = fileForUpload.files.item(0).getAsBinary();
        document.forms[0].fileContents.innerHTML = fileContents;
    }
}

Internet Explorer 的 ActiveXObject

function ieReadFile(filename) 
{
    try
    {
        var fso  = new ActiveXObject("Scripting.FileSystemObject"); 
        var fh = fso.OpenTextFile(filename, 1); 
        var contents = fh.ReadAll(); 
        fh.Close();
        return contents;
    }
    catch (Exception)
    {
        return "Cannot open file :(";
    }
}

跨瀏覽器支援

但是，沒有已知的方法可以使用上述方法在其他瀏覽器（例如​​Safari 和Chrome）中執行此任務。這些瀏覽器中實現的文件 API 僅提供對文件名和文件大小的訪問，缺乏讀取內容的能力。

檔案 API 更新

檔案此後，API 已標準化並在大多數現代瀏覽器中實現，包括 IE 10 以上版本。此 API 支援非同步檔案讀取、二進位檔案處理和文字編碼解碼。

var file = document.getElementById("fileForUpload").files[0];
if (file) {
    var reader = new FileReader();
    reader.readAsText(file, "UTF-8");
    reader.onload = function (evt) {
        document.getElementById("fileContents").innerHTML = evt.target.result;
    }
    reader.onerror = function (evt) {
        document.getElementById("fileContents").innerHTML = "error reading file";
    }
}

WebKit 和HTML 5 提案

或者，如果需要，可以提交打補丁或建議Mozilla API 包含在HTML 5 中，增加未來跨瀏覽器兼容性的可能性。

以上是JavaScript如何在不同瀏覽器中讀取本機檔案內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！