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

我试图加载一个3D模型，存储在我的电脑本地，到Three.js与JSONLoader, 3D模型是在同一目录下，作为整个网站。

我得到了“跨起源请求只支持HTTP.”错误，但我不知道是什么原因导致它也不知道如何修复它。

当前回答

我将列出3种不同的方法来解决这个问题:

Using a very lightweight npm package: Install live-server using npm install -g live-server. Then, go to that directory open the terminal and type live-server and hit enter, page will be served at localhost:8080. BONUS: It also supports hot reloading by default. Using a lightweight Google Chrome app developed by Google: Install the app, then go to the apps tab in Chrome and open the app. In the app point it to the right folder. Your page will be served! Modifying Chrome shortcut in windows: Create a Chrome browser's shortcut. Right-click on the icon and open properties. In properties, edit target to "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="C:/ChromeDevSession" and save. Then using Chrome open the page using ctrl+o. NOTE: Do NOT use this shortcut for regular browsing.

注意:使用类似http://localhost:8080的http://以防出错。

2017-11-29 06:54:00

其他回答

如果您坚持在本地运行.html文件，而不是将其与web服务器一起提供，那么您可以通过使有问题的资源内联可用来防止这些跨起源请求的发生。

当我试图通过file://来提供.js文件时，我遇到了这个问题。我的解决方案是更新我的构建脚本，以取代<script src="…">标签与<script>…</script>. " 这里有一个吞咽的方法:

1. 运行NPM install——save-dev来安装gulp、gulp-inline和del包。

2. 在根目录中创建gulpfile.js后，添加以下代码(只需更改文件路径以适合自己):

let gulp = require('gulp');
let inline = require('gulp-inline');
let del = require('del');

gulp.task('inline', function (done) {
    gulp.src('dist/index.html')
    .pipe(inline({
        base: 'dist/',
        disabledTypes: 'css, svg, img'
    }))
    .pipe(gulp.dest('dist/').on('finish', function(){
        done()
    }));
});

gulp.task('clean', function (done) {
    del(['dist/*.js'])
    done()
});

gulp.task('bundle-for-local', gulp.series('inline', 'clean'))

要么运行gulp bundle-for-local，要么更新构建脚本以自动运行它。

您可以在这里看到我的案例的详细问题和解决方案。

2020-05-04 15:38:37

它只是说应用程序应该在web服务器上运行。我在chrome上也有同样的问题，我启动tomcat并将我的应用程序移动到那里，它工作了。

2016-10-13 16:06:33

为java安装本地web服务器，例如Tomcat，对于php，您可以使用lamp等将json文件放到公共可访问的应用服务器目录中启动应用程序服务器，您应该能够从localhost访问该文件

2018-06-08 11:05:11

在Chrome中，你可以使用这个标志: