Question

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

我收到此错误：

从原点>'http://api.test/api/events/1/'开始对'http://localhost:8080'处XMLHttpRequest的访问已被CORS策略阻止：在所请求的资源上没有'Access-Control-> Allow-Origin'标头。

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

我试图创建一个名为here的名为'cors'的中间件，但是它对我不起作用，或者我做得不好？

奇怪的事情？与Postman合作吗？

感谢您的帮助！：）

Answer 1

您面临的问题是使用相同的原始策略。您可以在Mozilla网站（https://developer.mozilla.org/en-US/docs/Web/HTTP/Server-Side_Access_Control）上进行阅读。基本上是基于未经授权的对Web服务器的访问。您可以更改Web服务器的反应方式，我也可以在其中包含的链接中更改。

Answer 2

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

同源政策非常严格。根据这项政策，   服务器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和allowedMethods可以设置为array('*')以接受任何值。

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

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

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

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

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

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

Answer 3

如果有新朋友过来帮助我，我会提供更多细节。

我正在使用Laragon作为使用Apache的本地服务。我试图修改httpd.conf，它没有任何改变。

当我将URI放入导航器中时，例如：

http://api.test/api/events/返回好的json。

我的错误已更改：

从原点“ http://api.test/api/events/0”到“ http://localhost:8080”的XMLHttpRequest的访问已被CORS策略阻止：“ Access-Control-Allow-Origin”标头包含多个值“ *，{{3 }}'，但只允许一个。

重新编辑，正在运行。我已经删除了cors中间件，并在httpd.conf

中放置了Access-Control-Allow-Origin集合。

CORS Laravel VueJS

3 个答案: