用JS讀取本地XML

此刻，由於security policy Chromium無法通過ajax讀取本地文件而沒有--allow-file-access-from-files。但是我現在需要創建一個Web應用程序，其中的數據庫是一個xml文件（極端情況下，json），位於一個帶有index.html的目錄中。據瞭解，用戶可以在本地運行此應用程序。是否有解決方法來讀取xml-（json-）文件，而不是將其封裝在函數中並更改爲js擴展名？用JS讀取本地XML

loadXMLFile('./file.xml').then(xml => { 
    // working with xml 
}); 

function loadXMLFile(filename) { 
    return new Promise(function(resolve, reject) { 
     if('ActiveXObject' in window) { 
      // If is IE 
      var xmlDoc = new ActiveXObject('Microsoft.XMLDOM'); 
      xmlDoc.async = false; 
      xmlDoc.load(filename); 

      resolve(xmlDoc.xml); 
     } else { 
      /* 
      * how to read xml file if is not IE? 
      * ... 
      * resolve(something); 
      */ 
     } 

    } 
}

來源

2016-12-22 Vasya Shmarovoz

如果cookie無法爲預期用途存儲足夠的數據，那麼[local storage]（https://developer.mozilla.org/en -US /文檔/網絡/ API /窗/ localStorage的）？ –

目前我還不清楚你需要什麼，'通過插件或其他東西在Chrome中加載xml/json沒有函數？'請詳細說明一下。 –

可能的重複http://stackoverflow.com/questions/7949752/cross-browser-javascript-xml-parsing –

使用document.implementation.createDocument("", "", null)

，而不是new ActiveXObject('Microsoft.XMLDOM')。

您可以通過GOOGLE找到API。祝你好運。

來源

2016-12-29 14:09:38

如果我理解正確，可交付物旨在在本地運行，因此您將無法爲用戶計算機上的本地文件訪問設置任何標誌。我捏的東西是把它打包成一個可執行文件，如nw.js，並保留外部數據文件。否則，你可能會考慮在JS文件中使用JSON模式加載腳本。

來源

2016-12-30 08:35:59 0x736a64

我以前有類似的問題。我通過使用PHP將XML文件嵌入到HTML中解決了這個問題。由於應用程序是從磁盤本地加載的，因此大小，緩存等都不是問題。

如果您使用的是Webpack，則可以使用像this或this這樣的加載器直接導入文件，在這種情況下，該文件將包含在生成的捆綁JavaScript中。

來源

2016-12-30 17:40:22

訪問file:協議在鉻使用XMLHttpRequest()或<link>元素沒有--allow-file-access-from-files標記設置在鉻實例啓動默認情況下未啓用。

--allow-file-access-from-files

默認情況下，文件：//的URI無法讀取其他文件：//的URI。對於需要舊測試行爲的開發人員，這是一個覆蓋。

目前，由於安全策略鉻離不開--allow-file-access-from-files讀通過AJAX本地文件。但我當前需要創建一個Web應用程序，其中數據庫是一個 xml文件（極端情況下，json），位於一個目錄 index.html。據瞭解，用戶可以在本地運行該應用程序。是否有解決方法來讀取xml-（json-）文件，而不包括將其封裝在函數中並更改爲js擴展名？

如果用戶知道本地文件是由應用程序使用，您可以利用用戶<input type="file">元素上傳用戶從本地文件系統中，使用FileReader工藝文件的文件，然後繼續操作。

否則，建議用戶使用應用程序需要啓動鉻設置標誌，可以通過爲此創建啓動程序來完成，爲鉻實例指定不同的用戶數據目錄。發射器可以是，例如

/usr/bin/chromium-browser --user-data-dir="/home/user/.config/chromium-temp" --allow-file-access-from-files

參見How do I make the Google Chrome flag 「--allow-file-access-from-files」 permanent?

上面的命令也可以在terminal

$ /usr/bin/chromium-browser --user-data-dir="/home/user/.config/chromium-temp" --allow-file-access-from-files

而不創建桌面啓動程序運行;當鉻的實例關閉時運行

$ rm -rf /home/user/.config/chromium-temp

刪除鉻的實例的配置文件夾。

一旦設置了標誌，用戶可以包括與rel="import"屬性<link>元素和href指向本地文件和type設置爲"application/xml"，比XMLHttpRequest其他選項來獲取文件。使用

const doc = document.querySelector("link[rel=import]").import;

見Is there a way to know if a link/script is still pending or has it failed訪問XMLdocument。

另一種選擇，雖然更多地參與，是使用requestFileSystem向文件存儲在LocalFileSystem。

見

或者創建或修改Chrome應用和使用

chrome.fileSystem

硒e GoogleChrome/chrome-app-samples/filesystem-access。

最簡單的方法是通過肯定的用戶操作提供文件上傳的方法;處理上傳的文件，然後繼續應用程序。

const reader = new FileReader; 
 

 
const parser = new DOMParser; 
 

 
const startApp = function startApp(xml) { 
 
    return Promise.resolve(xml || doc) 
 
}; 
 

 
const fileUpload = document.getElementById("fileupload"); 
 

 
const label = document.querySelector("label[for=fileupload]"); 
 

 
const handleAppStart = function handleStartApp(xml) { 
 
    console.log("xml document:", xml); 
 
    label.innerHTML = currentFileName + " successfully uploaded"; 
 
    // do app stuff 
 
} 
 

 
const handleError = function handleError(err) { 
 
    console.error(err) 
 
} 
 

 
let doc; 
 
let currentFileName; 
 

 
reader.addEventListener("loadend", handleFileRead); 
 

 
reader.addEventListener("error", handleError); 
 

 
function handleFileRead(event) { 
 
    label.innerHTML = ""; 
 
    currentFileName = ""; 
 
    try { 
 
    doc = parser.parseFromString(reader.result, "application/xml"); 
 
    fileUpload.value = ""; 
 

 
    startApp(doc) 
 
    .then(function(data) { 
 
     handleAppStart(data) 
 
    }) 
 
    .catch(handleError); 
 
    } catch (e) { 
 
    handleError(e); 
 
    } 
 
} 
 

 
function handleFileUpload(event) { 
 
    let file = fileUpload.files[0]; 
 
    if (/xml/.test(file.type)) { 
 
    reader.readAsText(file); 
 
    currentFileName = file.name; 
 
    } 
 
} 
 

 
fileUpload.addEventListener("change", handleFileUpload)

<input type="file" name="fileupload" id="fileupload" accept=".xml" /> 
 
<label for="fileupload"></label>

來源

2016-12-30 19:06:04 guest271314

@VasyaShmarovoz另請參見[使用DevTools工作區設置持久性]（https://developers.google.com/web/tools/setup/setup -workflow）。 – guest271314

您可以通過使用DOMParser文本字符串加載XML，只需加載你的文件，然後使用.parseFromString分析文本。您可以使用包含(window.DOMParser)的if語句來檢查DOMParser是否受支持

來源

2016-12-31 03:10:43

用JS讀取本地XML

回答

相關問題