React：跨源请求在没有本地服务器的情况下加载文件

Question

我有两个模块——一个在 React JSX 中，另一个在 JavaScript 中。

define(function (require) {
    var ExternalJSInterface = require("./../../utils/ExternalJSInterface");
    var ExternalJSXInterface = require("jsx!ExternalJSXInterface");
}

加载 ExternalJSXInterface 时出现此错误：

XMLHttpRequest cannot load file:///Users/.../../ExternalJSXInterface.jsx. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

我认为 ExternalJSInterface 也应该出现同样的错误。但加载它工作正常。

我正在使用带有标志设置 allow-file-access-from-files 的 Chrome。

Answer 1

正如 Felix 所指出的，问题确实出在模块加载器中。如果我们使用 require 调用，我的模块加载器是 jsx-requirejs-plugin which was using requirejs-text 在内部加载 jsx 文件。

正如配置部分 requirejs-text 文档中提到的，如果我们使用 "file://" 访问文件，它会受到 XHR 限制，这会限制它的使用。

解决方案在此 link。

希望对大家有所帮助。

React：跨源请求在没有本地服务器的情况下加载文件

React: Cross origin requests on loading file without local server

javascript

google-chrome

reactjs

requirejs

react-jsx