CORS策略已阻止从原始位置访问XMLHttpRequest（Vue.JS应用程序调用Lumen App）

Question

我正在使用Vue.JS应用程序，该应用程序调用使用Lumen构建的API。 每当Vue.JS应用调用Lumen API时，我总是收到以下错误消息。

以下是Lumen中用于CORS的中间件。

<?php

namespace App\Http\Middleware;

use Closure;

class CorsMiddleware
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        //Intercepts OPTIONS requests
        if($request->isMethod('OPTIONS')) {
            $response = response('', 200);
        } else {
            // Pass the request to the next middleware
            $response = $next($request);
        }

        // Adds headers to the response
        $response->header('Access-Control-Allow-Methods', 'HEAD, GET, POST, PUT, PATCH, DELETE');
        $response->header('Access-Control-Allow-Headers', $request->header('Access-Control-Request-Headers'));
        $response->header('Access-Control-Allow-Origin', '*');

        // Sends it
        return $response;
    }
}

我在 public 文件夹中的lumen的.htaccess文件中添加了此文件

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

更新1 chrome的“网络”标签中的ajax请求标头：-

我正在使用：

  

PHP版本：5.6

     

开发环境：Homestead（Apache）

Answer 1

---

添加

后已解决

header('Access-Control-Allow-Headers: *'); 

代替

header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token'); 

在CORS中间件中。