【发布时间】:2017-12-12 22:45:48
【问题描述】:
我尝试使用 Laravel(作为后端)和 angularjs(作为前端)构建一个简单的 api 基础应用程序。 一开始,我遇到了这个错误:
XMLHttpRequest 无法加载 http://127.0.0.1:8000/api/myroute。回复 预检请求未通过访问控制检查:否 请求中存在“Access-Control-Allow-Origin”标头 资源。 Origin 'http://localhost' 因此不允许访问。
-
http://127.0.0.1:8000/api/myroute是我获取一些数据的路径,在 Laravel 中定义为 POST 路径。
那是我以这种方式在我的路由上添加了 CORS 中间件(根据this sample): Cors 中间件:
public function handle($request, Closure $next)
{
return $next($request)
->header('Access-Control-Allow-Origin', '*')
->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
->header('Access-Control-Allow-Headers', 'x-requested-with, Content-Type, origin, authorization, accept, client-security-token');
}
下面的代码是我在 Angularjs 中发送请求的 $http 代码:
$http({
method: 'POST',
url: 'http://127.0.0.1:8000/api/myroute',
headers: {
'Content-Type': 'application/json'
}
}).then(function (response) {
console.log(response);
}, function (reject) {
console.log(reject);
});
我应该补充一点,当我在主机上上传我的项目时,这个 Cors 工作正常!
我的问题只是http://localhost。
我也在 Firefox 中尝试过,但结果是一样的,只是 Firefox 没有显示跨域错误,这是唯一的区别。
这段时间我无法在主机上开发我的项目,我需要在本地工作。 所以我需要帮助!
【问题讨论】:
-
奇怪的是,您看到的是带有环回 ip 的 url,但原始的是本地主机。你试过`url:'localhost:8000/api/myroute',`吗?
-
我在本地开发(我在 Windows 上)时使用的另一种解决方法是将 FQDN 添加到我的主机文件中。该行将如下所示
dev.somesite.local 127.0.0.1然后我可以使用 `url: 'dev.somesite.local/api/myroute' -
感谢您的 cmets,关于第一,是的!我都试过了,没有区别。关于第二条评论,我也这样做了,但它与 localhost 或 127.0.0.1 相同
-
你能加载127.0.0.1:8000/api/myroute。在网络浏览器中?当你使用没有 AJAX 的 PostMan 或 CURL 时会发生什么。您可以验证响应中的 cors 标头吗?
标签: php angularjs laravel cors