Angular和Laravel CORS访问控制允许原点问题

Angular和Laravel CORS访问控制允许原点问题,angular,laravel,cors,laravel-passport,laravel-5.7,Angular,Laravel,Cors,Laravel Passport,Laravel 5.7,过去几个月,我一直在我的开发机器上本地开发Angular(客户端)和Laravel(API)应用程序,没有任何问题。几天前,我将应用程序(客户端和api)上传到服务器上,突然发现CORS错误: 从访问“”处的XMLHttpRequest 源“”已被CORS阻止 策略:对飞行前请求的响应未通过访问控制 检查:上不存在“访问控制允许原点”标题 请求的资源 在开发之初,我也遇到了这些错误,因为我对客户端和api(client.localhost和api.localhost)使用了不同的本地域,并最终解

过去几个月,我一直在我的开发机器上本地开发Angular(客户端)和Laravel(API)应用程序,没有任何问题。几天前,我将应用程序(客户端和api)上传到服务器上,突然发现CORS错误:

从访问“”处的XMLHttpRequest 源“”已被CORS阻止 策略:对飞行前请求的响应未通过访问控制 检查:上不存在“访问控制允许原点”标题 请求的资源

在开发之初,我也遇到了这些错误,因为我对客户端和api(client.localhost和api.localhost)使用了不同的本地域,并最终解决了将CORS中间件添加到我的Laravel api中的问题:

public function handle($request, Closure $next)
{
    //apply cors only to api routes
    if (Request::segment(1) == 'api') {

        header("Access-Control-Allow-Origin: *"); 

        $headers = [
            'Access-Control-Allow-Methods' => 'POST, GET, OPTIONS, PUT, DELETE',
            'Access-Control-Allow-Headers' => 'X-Requested-With, X-Auth-Token, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding, X-Login-Origin',
            'Access-Control-Allow-Credentials' => 'true'
        ];

        if ($request->isMethod("OPTIONS")) {
            // The client-side application can set only headers allowed in Access-Control-Allow-Headers
            return Response::make('OK', 200, $headers);
        }

        $response = $next($request);

        foreach ($headers as $key => $value) {
            $response->header($key, $value);
        }
    } else {
        $response = $next($request);
    }

    return $response;
}
所有路由都使用CORS中间件。当应用程序试图发布到登录api(/api/login)时,它甚至不会进入CORS中间件


为什么它在本地工作而不在服务器上工作?

我已经设法解决了我的问题。由于没有调用我的自定义CORS中间件,我将自定义头添加到我的web.config文件中:

<configuration>
  <system.webServer>        
    <!-- SOLVES CORS ISSUES -->
    <httpProtocol>
     <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="X-Requested-With, X-Auth-Token, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding, X-Login-Origin" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
     </customHeaders>
   </httpProtocol>
   <!-- /SOLVES CORS ISSUES -->
  </system.webServer>
</configuration>

请按照以下帮助和参考链接获取帮助:

您可以检查CORS中间件的Laravel包或以下链接:


您是如何注册此中间件的?路由方式还是全局?全局和路由方式。我绝望了:-\
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "X-Requested-With, X-Auth-Token, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding, X-Login-Origin, responseType"
Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"