CORS Laravel VueJS

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

我收到这个错误：

访问 XMLHttpRequest 位于 'http://api.test/api/events/1/'从原点>'http://本地主机:8080' 已被 CORS 策略阻止：请求的资源上不存在“Access-Control->Allow-Origin”标头。

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

我尝试创建一个名为“cors”的中间件，例如here但这对我不起作用，或者也许我做得很糟糕？

奇怪的事情 ？是与 Postman 合作的。

感谢您的帮助！ :)

服务器用于托管网页、应用程序、图像、字体和 多得多。当您使用网络浏览器时，您可能会尝试 访问不同的网站（托管在服务器上）。网站经常要求 这些托管资源来自不同位置（服务器） 互联网。服务器上的安全策略减轻了相关风险 请求资产托管在不同的服务器上。让我们来看看 安全策略示例：同源。

同源策略的限制非常严格。根据这项政策， 服务器 A 上托管的文档（即，像网页）只能交互 以及服务器 A 上的其他文档。简而言之， 同源策略强制执行与每个文档交互的文档 其他同源。

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

$ composer require barryvdh/laravel-cors
$ php artisan vendor:publish --provider="Barryvdh\Cors\ServiceProvider"

默认值设置在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, allowedHeaders and allowedMethods可以设置为array('*')接受任何值。

要允许所有路由使用 CORS，请将 HandleCors 中间件添加到$middleware的财产app/Http/Kernel.php class:

protected $middleware = [
    // ...
    \Barryvdh\Cors\HandleCors::class,
];

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

protected $middlewareGroups = [
    'web' => [
       // ...
    ],

    'api' => [
        // ...
        \Barryvdh\Cors\HandleCors::class,
    ],
];

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