CORS Laravel VueJS



我正在尝试使用从VueJS到Laravel的axios,这是我的API。

我收到此错误:

CORS 策略阻止了从源>"http://localhost:8080"访问"http://api.test/api/events/1/"处的 XMLHttpRequest:请求的资源上不存在"访问控制>允许源"标头。

未捕获(承诺)错误:网络错误 at createError (createError.js?2d83:16) at XMLHttpRequest.handleError (xhr.js?b50d:87)

我试图像这里一样创建一个名为"cors"的中间件,但它对我不起作用,或者我做得不好?

奇怪的是,这是与邮递员合作的。

感谢您的帮助! :)

服务器用于托管网页、应用程序、图像、字体和 多。当您使用 Web 浏览器时,您可能会尝试 访问不同的网站(托管在服务器上)。网站经常要求 这些托管资源来自不同位置(服务器)上的 互联网。服务器上的安全策略可降低相关风险 请求资产托管在不同的服务器上。一起来看看吧 在安全策略的示例中:同源。

同源策略非常严格。根据此政策,a 托管在服务器 A 上的文档(即,如网页)只能交互 与服务器 A 上的其他文档一起使用。简而言之, 同源策略强制与每个文档交互的文档 其他具有相同的起源。


检查这个为Laravel使用而制作的CORS库。 安装简单:

$ composer require barryvdh/laravel-cors
$ php artisan vendor:publish --provider="BarryvdhCorsServiceProvider"

默认值在config/cors.php中设置

return [
/*
|--------------------------------------------------------------------------
| Laravel CORS
|--------------------------------------------------------------------------
|
| allowedOrigins, allowedHeaders and allowedMethods can be set to array('*')
| to accept any value.
|
*/
'supportsCredentials' => false,
'allowedOrigins' => ['*'],
'allowedHeaders' => ['Content-Type', 'X-Requested-With'],
'allowedMethods' => ['*'], // ex: ['GET', 'POST', 'PUT',  'DELETE']
'exposedHeaders' => [],
'maxAge' => 0,
];

allowedOrigins, allowedHeadersallowedMethods可以设置为array('*')以接受任何值。

要允许所有路由使用 CORS,请在类的$middleware属性中添加 HandleCors 中间件app/Http/Kernel.php

protected $middleware = [
// ...
BarryvdhCorsHandleCors::class,
];

如果要在特定中间件组或路由上允许 CORS,请将 HandleCors 中间件添加到您的组:

protected $middlewareGroups = [
'web' => [
// ...
],
'api' => [
// ...
BarryvdhCorsHandleCors::class,
],
];

https://www.codecademy.com/articles/what-is-cors

尝试将 Axios 请求从 Vue 应用程序发送到 Laravel 后端。

我遇到了 CORS 错误,但找不到解决方案。

vendor文件中执行请求后,我发现我只是测试错了。

我正在 url:http://localhost/api上进行测试,但在config/cors.php中有:

'paths' => ['api/*', 'sanctum/csrf-cookie'],

所以我所要做的就是将请求更改为http://localhost/api/...然后它开始工作。 另一种解决方案是将'api'添加到config/cors中的paths数组中.php如果您想使用http://localhost/api

您面临的问题是同源策略。 您可以在Mozilla网站(https://developer.mozilla.org/en-US/docs/Web/HTTP/Server-Side_Access_Control)上阅读有关它的信息。 它基本上是经过验证的联合国授权访问 Web 服务器。您可以更改Web服务器的反应方式,我也包含在该链接中。

最新更新