用JS读取本地XML

Question

用JS读取本地XML

目前，由于安全策略，Chromium无法通过ajax读取本地文件--allow-file-access-from-files。但我目前需要创建一个Web应用程序，其中数据库是一个xml文件（在极端情况下为json），位于一个带有index.html的目录中。可以理解，用户可以在本地运行该应用程序。是否有解决xml-（json-）文件的解决方法，而不将其包装在函数中并更改为js扩展名？

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);
             */
        }

    }
}

Answer 1

默认情况下，未启用在铬实例启动时file:使用铬XMLHttpRequest()或使用<link>无--allow-file-access-from-files标记设置访问协议。--allow-file-access-from-files默认情况下，file：// URIs无法读取其他file：// URI。这是对需要旧行为进行测试的开发人员的覆盖。目前，由于安全策略，Chromium无法通过ajax读取本地文件--allow-file-access-from-files。但我目前需要创建一个Web应用程序，其中数据库是一个xml文件（在极端情况下为json），位于一个带有index.html的目录中。可以理解，用户可以在本地运行该应用程序。是否有解决xml-（json-）文件的解决方法，而不将其包装在函数中并更改为js扩展名？如果用户知道应用程序将使用本地文件，则可以使用<input type="file">元素供用户从用户本地文件系统上载文件，使用处理文件FileReader，然后继续应用程序。否则，建议用户使用应用程序需要启动带有--allow-file-access-from-files标志集的铬&nbsp;，这可以通过为此目的创建启动器来完成，为chrome实例指定不同的用户数据目录。例如，发射器可以是/usr/bin/chromium-browser&nbsp;--user-data-dir="/home/user/.config/chromium-temp"&nbsp;--allow-file-access-from-files另请参阅如何使Google Chrome标记“ - allow-file-access-from-files”永久保留？上面的命令也可以在&nbsp;terminal$&nbsp;/usr/bin/chromium-browser&nbsp;--user-data-dir="/home/user/.config/chromium-temp"&nbsp;--allow-file-access-from-files没有创建桌面启动器;&nbsp;当铬的实例关闭时$&nbsp;rm&nbsp;-rf&nbsp;/home/user/.config/chromium-temp删除chrome实例的配置文件夹。设置标志后，用户可以包含<link>带rel="import"属性的元素并href指向本地文件并type设置为"application/xml"，XMLHttpRequest以获取除获取文件之外的选项。访问XML&nbsp;document使用const&nbsp;doc&nbsp;=&nbsp;document.querySelector("link[rel=import]").import;请参阅有没有办法知道链接/脚本是否仍处于挂起状态或是否已失败。另一个替代方案，即更多涉及，将requestFileSystem用于存储文件LocalFileSystem。看到如何在file：protocol中使用webkitRequestFileSystemjQuery文件上传插件：是否可以保留上传文件夹的结构？如何使用JavaScript写入文件（用户目录）？或者创建或修改Chrome应用程序并使用chrome.fileSystem请参阅GoogleChrome / chrome-app-samples / filesystem-access。最简单的方法是通过肯定的用户动作提供文件上传的手段;&nbsp;处理上传的文件，然后继续申请。const&nbsp;reader&nbsp;=&nbsp;new&nbsp;FileReader;const&nbsp;parser&nbsp;=&nbsp;new&nbsp;DOMParser;const&nbsp;startApp&nbsp;=&nbsp;function&nbsp;startApp(xml)&nbsp;{ &nbsp;&nbsp;return&nbsp;Promise.resolve(xml&nbsp;||&nbsp;doc)};const&nbsp;fileUpload&nbsp;=&nbsp;document.getElementById("fileupload");const&nbsp;label&nbsp;=&nbsp;document.querySelector("label[for=fileupload]");const&nbsp;handleAppStart&nbsp;=&nbsp;function&nbsp;handleStartApp(xml)&nbsp;{ &nbsp;&nbsp;console.log("xml&nbsp;document:",&nbsp;xml); &nbsp;&nbsp;label.innerHTML&nbsp;=&nbsp;currentFileName&nbsp;+&nbsp;"&nbsp;successfully&nbsp;uploaded"; &nbsp;&nbsp;//&nbsp;do&nbsp;app&nbsp;stuff}const&nbsp;handleError&nbsp;=&nbsp;function&nbsp;handleError(err)&nbsp;{ &nbsp;&nbsp;console.error(err)}let&nbsp;doc;let&nbsp;currentFileName;reader.addEventListener("loadend",&nbsp;handleFileRead);reader.addEventListener("error",&nbsp;handleError);function&nbsp;handleFileRead(event)&nbsp;{ &nbsp;&nbsp;label.innerHTML&nbsp;=&nbsp;""; &nbsp;&nbsp;currentFileName&nbsp;=&nbsp;""; &nbsp;&nbsp;try&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;doc&nbsp;=&nbsp;parser.parseFromString(reader.result,&nbsp;"application/xml"); &nbsp;&nbsp;&nbsp;&nbsp;fileUpload.value&nbsp;=&nbsp;""; &nbsp;&nbsp;&nbsp;&nbsp;startApp(doc) &nbsp;&nbsp;&nbsp;&nbsp;.then(function(data)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;handleAppStart(data) &nbsp;&nbsp;&nbsp;&nbsp;}) &nbsp;&nbsp;&nbsp;&nbsp;.catch(handleError); &nbsp;&nbsp;}&nbsp;catch&nbsp;(e)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;handleError(e); &nbsp;&nbsp;}}function&nbsp;handleFileUpload(event)&nbsp;{ &nbsp;&nbsp;let&nbsp;file&nbsp;=&nbsp;fileUpload.files[0]; &nbsp;&nbsp;if&nbsp;(/xml/.test(file.type))&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;reader.readAsText(file); &nbsp;&nbsp;&nbsp;&nbsp;currentFileName&nbsp;=&nbsp;file.name; &nbsp;&nbsp;}}fileUpload.addEventListener("change",&nbsp;handleFileUpload)<input&nbsp;type="file"&nbsp;name="fileupload"&nbsp;id="fileupload"&nbsp;accept=".xml"&nbsp;/><label&nbsp;for="fileupload"></label>

Answer 2

使用&nbsp;document.implementation.createDocument("", "", null)而不是new ActiveXObject('Microsoft.XMLDOM')。您可以通过GOOGLE找到API。祝好运。

Answer 3

如果我理解正确，那么可交付成果将在本地运行，因此您将无法在用户的计算机上设置任何本地文件访问标志。我在紧要关头做的事情就是把它打包成一个像nw.js这样的可执行文件并保存外部数据文件。否则，您可能正在使用JS文件中的JSON模式来加载脚本。