laravel 仅在 FireFox 中使用 AngularJS 帖子的 CORS 错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31908050/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CORS error with AngularJS post only in FireFox
提问by shauno
I am having issues only with FireFox when making a cross origin request in an Ionic app (so it's using AngularJS). The js app is doing a $http.post() to a Laravel 5.1 API, and I get the following error only in FireFox (39.0.3):
在 Ionic 应用程序中发出跨源请求时，我只遇到 FireFox 问题（因此它使用的是 AngularJS）。js 应用程序正在对 Laravel 5.1 API 执行 $http.post()，我仅在 FireFox (39.0.3) 中收到以下错误：
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://blah.dev/endpoint. (Reason: missing token 'content-type' in CORS header 'Access-Control-Allow-Headers' from CORS preflight channel).
跨域请求被阻止：同源策略不允许在http://blah.dev/endpoint读取远程资源。（原因：CORS 预检通道的 CORS 标头“Access-Control-Allow-Headers”中缺少令牌“content-type”）。
This is on my localhost (OSX Mavericks). and works fine in Chrome and Safari, only FireFox is given the error. I have cleared the cache, and tried in a "private window", with the same results.
这是在我的本地主机（OSX Mavericks）上。并且在 Chrome 和 Safari 中运行良好，只有 FireFox 出现错误。我已经清除了缓存，并在“私人窗口”中进行了尝试，结果相同。
Here is the Laravel route defined to handle the OPTIONS request:
这是定义用于处理 OPTIONS 请求的 Laravel 路由：
Route::options('endpoint', function() {
return response('OK')
->header('Access-Control-Allow-Headers ', 'Origin, Authorization, X-Requested-With, Content-Type, Accept')
->header('Access-Control-Allow-Methods', 'POST, GET, OPTIONS')
->header('Access-Control-Allow-Origin', '*')
->header('Cache-Control', 'no-store, no-cache, must-revalidate, post-check=0, pre-check=0')
;
});
Route::post('endpoint', array('uses' => '\Path\To\Controller@endpoint'));
I did find this questionthat seems to have a similar issue only in FireFox, but the solution was to comma separate the Allow-Methods, which I already am.
我确实发现这个问题似乎只在 FireFox 中有类似的问题，但解决方案是用逗号分隔Allow-Methods，我已经是。
回答by Igor Greg
The message " missing token 'content-type' " is about the client. For a http request to be a valid post one, it must have a header
消息“缺少令牌'内容类型'”是关于客户端的。要使 http 请求成为有效的 post 请求，它必须有一个标头
'Content-Type': 'application/x-www-form-urlencoded'
or
或者
'Content-Type': 'multipart/form-data'
The first content-type is the most common one.
第一种内容类型是最常见的。
In angularjs one way to do a CORS post request is
在 angularjs 中，执行 CORS 发布请求的一种方法是
$http.post(
'http://external-domain.ext/the/rest/url',
'param_name=param_value',
{headers:{'Content-Type': 'application/x-www-form-urlencoded'}}
).
then(function successCallback(response) {
$scope.something = response;
}, function errorCallback(response) {
// not good
});
If the server is configured with
header('Access-Control-Allow-Origin', '*'), the CORS post must succeed without authentication and credentials.
如果服务器配置了
header('Access-Control-Allow-Origin', '*')，则 CORS 发布必须在没有身份验证和凭据的情况下成功。
回答by user12121234
on the back end try putting
在后端尝试放置
->header('Access-Control-Allow-Credentials', 'true')
and on the front end try putting
并在前端尝试放置
.config(function($locationProvider, $httpProvider) {
// CORS requests with credentials
$httpProvider.defaults.withCredentials = true;
})
