XMLHttpRequest 是否接受文件协议？答案

【问题标题】：Does XMLHttpRequest accept the file protocol?XMLHttpRequest 是否接受文件协议？
【发布时间】：2020-07-31 15:12:52
【问题描述】：

我正在尝试制作一个反应本机应用程序，该应用程序需要将本地设备上的文件转换为 javascript File 对象或 Blob，但它具有使用 file:// 协议的地址。根据Medium article,，您可以使用 XMLHttpRequest 将 URI 转换为 Blob：

uriToBlob = (uri) => {
   return new Promise((resolve, reject) => {
      const xhr = new XMLHttpRequest();
      xhr.onload = function() {
         // return the blob
         resolve(xhr.response);
      };

      xhr.onerror = function() {
      // something went wrong
      reject(new Error('uriToBlob failed'));
   };

   // this helps us get a blob
   xhr.responseType = 'blob';
   xhr.open('GET', uri, true);

   xhr.send(null);
   });
}

我想知道这怎么可能，如果有人可以给出解释，考虑到 URI 不使用 HTTP 协议？根据我能找到的任何文档，XMLHttpRequest 仅用于对服务器的 HTTP 请求？

【问题讨论】：

你试过了吗？它失败了吗？如果是，什么错误？

标签： javascript react-native

【解决方案1】：

文档： https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest

参考“处理二进制数据”部分

您可以对文件使用它：但不支持进度侦听器...因此您只能在加载、错误和中止时触发

【讨论】：

文件位于本地设备上，而不是服务器上。我的问题归结为 XMLHttpRequest 是否/如何可以采用 File:// URI 而不是 HTTP URL，因为它似乎从未在文档中提及。我不关心它是被读取为二进制数据还是文本数据。

【解决方案2】：

XHR 将 request 的模式设置为“CORS”^{[ permalink, templink ]}

所以只允许^(permalink)

same-origin 请求（包括blob:// 方案）。 ^[templink]
data:// 方案 ^[templink]
HTTP(s)-schemes ^[templink]

现在，浏览器并不都同意file:// 起源应该如何相互关联。像 Chrome 之类的会认为它是一个 opaque-origin，因此永远不会将其视为 same-origin，您将无法在此浏览器中从该方案中获取*.
在 Firefox 中，他们会认为 FileSystem 中相同目录或更深的任何资源都是same-origin，因此您可以在那里获取它。
此外，有些提供了安全提升，它们可能会特别允许脚本访问它，例如使用 --allow-file-access-from-files 启动 Chrome 将允许来自 file:// 方案的请求执行此类请求。

【讨论】：