“仅HTTP支持跨源请求。” 加载本地文件时出错

首先关闭所有chrome实例。

之后，遵循此步骤。

我在mac上使用了此命令。

“ / Applications / Google Chrome.app/Contents/MacOS/Google Chrome” --allow-file-access-from-files

对于Windows：

如何在“ --allow-file-access-from-files”模式下使用Chrome启动HTML？

没有服务器就无法加载静态本地文件（例如：svg）。如果您的计算机上安装了NPM / YARN，则可以使用“ http-server ” 设置简单的http服务器

npm install http-server -g
http-server [path] [options]

或在该项目文件夹中打开终端，然后键入“ hs”。它将自动启动HTTP活动服务器。

科尔多瓦实现了这一目标。我仍然不知道科尔多瓦的表现。它甚至没有通过shouldInterceptRequest。

后来我发现从本地加载任何文件的关键是：myWebView.getSettings（）。setAllowUniversalAccessFromFileURLs（true）;。

而且，当您要访问任何http资源时，Web视图将使用OPTIONS方法进行检查，您可以通过返回响应来通过WebViewClient.shouldInterceptRequest授予访问权限，对于以下GET / POST方法，您可以仅返回null。

使用具有以下href的锚标记时，我也能够重新创建此错误消息：

<a href="javascript:">Example a tag</a>

在我的情况下，一个标签被用于获取“指针光标”，并且该事件实际上是由一些jQuery on click事件控制的。我删除了href并添加了一个适用的类：

cursor:pointer;

这样做有很多问题，我的问题缺少'/'示例：jquery-1.10.2.js：8720 XMLHttpRequest无法加载http：// localhost：xxxProduct / getList_tagLabels / 必须是：http：// localhost：xxx / Product / getList_tagLabels /

希望对遇到这个问题的人有所帮助。

• 为Java安装本地Web服务器，例如Tomcat，对于php，您可以使用lamp等
• 将json文件拖放到公共可访问的应用服务器目录中

• 

• 启动应用服务器，您应该能够从本地主机访问文件

所有人MacOS...设置一个简单的LaunchAgent以在您自己的Chrome副本中启用这些迷人的功能...

保存plist，命名什么（launch.chrome.dev.mode.plist在，例如）~/Library/LaunchAgents具有相似的内容...

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Label</key>
    <string>launch.chrome.dev.mode</string>
    <key>ProgramArguments</key>
    <array>
        <string>/Applications/Google Chrome.app/Contents/MacOS/Google Chrome</string>
        <string>-allow-file-access-from-files</string>
    </array>
    <key>RunAtLoad</key>
    <true/>
</dict>
</plist>

它应该在启动时启动..但是您可以随时使用terminal命令强制它启动。

launchctl load -w ~/Library/LaunchAgents/launch.chrome.dev.mode.plist

TADA！😎💁🏻🙊🙏🏾

嗯 我刚刚发现一些官方用语：“由于跨域安全限制，尝试加载使用dojo / text插件的未构建的远程AMD模块将失败。（AMD模块的内置版本不受影响，因为通过以下方式消除了对dojo / text的调用：构建系统。）” https://dojotoolkit.org/documentation/tutorials/1.10/cdn/

它加载本地文件的一种方法是在项目文件夹中而不是在项目文件夹外部使用它们。在您的项目示例文件下创建一个文件夹，类似于我们为图像创建的方式，并替换其中使用项目路径以外的完整本地路径并在项目文件夹下使用文件的相对URL的部分。对我有用

我建议您使用小型服务器在本地主机上运行此类应用程序（如果您未使用某些内置服务器）。

这是一个非常简单的设置和运行方法：

https://www.npmjs.com/package/tiny-server

它只是说该应用程序应该在Web服务器上运行。我在chrome上遇到了同样的问题，我启动了tomcat并将我的应用程序移到那里，并且它可以正常工作。

我怀疑在某些答案中已经提到了它，但是我将对其稍作修改以得到完整的工作答案（更易于查找和使用）。

1. 转到：https : //nodejs.org/en/download/。安装nodejs。

2. 通过从命令提示符运行命令来安装http-server npm install -g http-server。

3. 切换到index.html/ yoursome.html所在的工作目录。

4. 通过运行命令启动您的http服务器 http-server -c-1

打开Web浏览器到http://localhost:8080 或http://localhost:8080/yoursome.html -取决于您的html文件名。

在使用本地目录中的json文件的浏览器中加载HTML文件时，出现了确切的错误。就我而言，我能够通过创建一个简单的节点服务器来解决此问题，该服务器可以处理静态内容。我在另一个答案中为此保留了代码。

使用VS Code的人的简单解决方案

我已经有一段时间了这个错误。大多数答案有效。但是我找到了另一种解决方案。如果您不想node.js在这里处理任何其他解决方案，并且正在使用HTML文件（从另一个js文件调用函数或获取json api的功能），请尝试使用Live Server扩展。

它使您可以轻松打开实时服务器。并且由于它创建了localhost服务器，因此问题得以解决。您只需localhost打开HTML文件并在编辑器上单击鼠标右键，然后单击，即可开始Open with Live Server。

它基本上使用http://localhost/index.html而不是使用加载文件file://...。

编辑

不需要.html文件。您可以使用快捷方式启动Live Server。

点击(alt+L, alt+O)打开服务器，然后(alt+L, alt+C)停止服务器。[在MAC上，cmd+L, cmd+O和cmd+L, cmd+C]

希望它能帮助某人:)

如果您使用Mozilla Firefox，它将按预期运行，没有任何问题。

PS出人意料的是，IntenetExplorer_Edge绝对可以正常工作！！！

对我而言，最快的方法是：对于Windows用户，在Firefox上运行文件已解决问题；或者，如果您要使用chrome，对我而言，最简单的方法是安装Python 3，然后从命令提示符处运行命令，python -m http.server 然后转到http：// localhost：8000 / 然后导航到您的文件

python -m http.server

使用http://或https://创建网址

错误：localhost:8080

解决方案：http://localhost:8080

对于Windows上没有Python或Node.js的用户，仍然有一个轻量级的解决方案：Mongoose。

您要做的就是将可执行文件拖到服务器根目录下的任意位置，然后运行它。图标将出现在任务栏中，它将在默认浏览器中导航到服务器。

另外，Z-WAMP是100％便携式WAMP，可在单个文件夹中运行，真棒。如果您需要快速的PHP和MySQL服务器，这是一个选择。

我将列出3种解决此问题的方法：

1. 使用非常轻便npm包：安装实时服务器使用npm install -g live-server。然后，转到该目录，打开终端并live-server输入，然后按Enter，将在处提供页面localhost:8080。奖励：默认情况下，它还支持热重装。
2. 使用Google 开发的轻量级Google Chrome 应用：安装该应用，然后转到Chrome中的“应用”标签，然后打开该应用。在应用程序中，将其指向正确的文件夹。您的页面将被投放！
3. 在Windows中修改Chrome快捷方式：创建Chrome浏览器的快捷方式。右键单击图标，然后打开属性。在性能，编辑target到"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="C:/ChromeDevSession"和保存。然后使用Chrome使用打开页面ctrl+o。注意：请不要使用此快捷方式定期浏览。

在一个Android应用程序-例如，允许JavaScript必须通过获得资产file:///android_asset/-使用setAllowFileAccessFromFileURLs(true)的WebSettings，你从调用获得getSettings()的WebView。

只要将URL更改为http://localhost代替localhost。如果您从本地打开html文件，则应创建一个本地服务器来提供该html文件，最简单的方法是使用Web Server for Chrome。这样可以解决问题。

明确地说-是的，错误是说您不能直接将浏览器指向 file://some/path/some.html

Here are some options to quickly spin up a local web server to let your browser render local files

Python 2

If you have Python installed...

1. Change directory into the folder where your file some.html or file(s) exist using the command cd /path/to/your/folder

2. Start up a Python web server using the command python -m SimpleHTTPServer

This will start a web server to host your entire directory listing at http://localhost:8000

3. You can use a custom port python -m SimpleHTTPServer 9000 giving you link: http://localhost:9000

This approach is built in to any Python installation.

Python 3

Do the same steps, but use the following command instead python3 -m http.server

Node.js

Alternatively, if you demand a more responsive setup and already use nodejs...

1. Install http-server by typing npm install -g http-server

2. Change into your working directory, where yoursome.html lives

3. Start your http server by issuing http-server -c-1

This spins up a Node.js httpd which serves the files in your directory as static files accessible from http://localhost:8080

Ruby

If your preferred language is Ruby ... the Ruby Gods say this works as well:

ruby -run -e httpd . -p 8080

PHP

Of course PHP also has its solution.

php -S localhost:8000

在Chrome中，您可以使用以下标志：

--allow-file-access-from-files

在这里阅读更多。

我的水晶球说您正在使用file://或加载模型C:/，这对错误消息保持正确，因为它们不是http://

因此，您既可以在本地PC上安装Web服务器，也可以将模型上传到其他地方，然后使用jsonp并将URL更改为http://example.com/path/to/model

起源在RFC-6454中定义为

   ...they have the same
   scheme, host, and port.  (See Section 4 for full details.)

因此，即使您的文件来自同一主机（localhost），但是只要方案不同（http/ file），它们都将被视为不同的来源。