CORS '*' 似乎不适用于 Chrome，但适用于 Postman答案

【问题标题】：CORS '*' doesn't seem to work for Chrome, it does for PostmanCORS '*' 似乎不适用于 Chrome，但适用于 Postman
【发布时间】：2020-01-12 15:23:10
【问题描述】：

我在 Laravel 中为我的项目创建了一个自定义中间件。它添加了以下标题：

return $next($request)
        ->header('Access-Control-Allow-Origin', '*')
        ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers',' Origin, Content-Type, Accept, Authorization, X-Request-With')
        ->header('Access-Control-Allow-Credentials',' true');

中间件似乎适用于 Postman。当我通过 Postman 触发 POST 请求时，您会注意到标头已添加到响应中：

但是，对于 Chrome，这似乎不起作用。查看从 Google Chrome 返回的标头（相同的请求，使用 axios 进行调用）：

这会导致 Google Chrome 控制台出现以下错误：

从源“http://localhost:3000”对“http://127.0.0.1:8000/auth/jwt/token”处的 XMLHttpRequest 的访问已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：没有“Access-Control-Allow-Origin”标头出现在请求的资源上。

我做错了什么/导致了这个奇怪的问题？

【问题讨论】：

Access-Control-Allow-Credentials 和 wilcarded 来源不兼容。
Postman 不受同源政策约束，因此不需要发出飞行前OPTIONS 请求，因此您的请求绝对不一样

标签： javascript php laravel axios

【解决方案1】：

我强烈推荐使用Laravel CORS Package，而不是创建自定义的 Laravel 中间件。无需重新发明轮子。

【讨论】：

谢谢，它有效。它并没有真正解释为什么我的解决方案不起作用，因为它应该将标头添加到任何类型的请求中。甚至 Chrome 的 OPTION 飞行前请求。我将深入研究这个 Laravel CORS 包的代码，找出我最初做错了什么。

【解决方案2】：

只需将类似的脚本放在文件的最顶部，使用 die()。

<?php
if (isset($_SERVER["REQUEST_METHOD"])) {
    if ($_SERVER["REQUEST_METHOD"] === "OPTIONS") {
        header("Access-Control-Allow-Origin: *");
        header("Access-Control-Allow-Methods: GET, POST, PUT, PATCH, DELETE");

        // header("Access-Control-Allow-Headers: X-Protection-Token");

        die();
    }
}

如果你能翻译成 laravel 就更好了。实现示例在here。

【讨论】：