Angular IO 与 Laravel Lumen PHP API CORS 问题

Posted 2023-03-04

【中文标题】Angular IO 与 Laravel Lumen PHP API CORS 问题

【英文标题】：Angular IO with Laravel Lumen PHP API CORS issue

【发布时间】：2020-07-21 00:59:46

【问题描述】：

我使用 Laravel Lumen 作为 php REST 服务 API，与 Angular IO 应用程序集成。从 Postman 测试端点，效果很好。当使用暂存实时域并尝试将端点从 Angular 应用程序调用到 API 时，我得到了 CORS 错误，尽管标头是从 Lumen 端使用中间件类设置的。

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://sub-domain.ext (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://api.sub-domain.ext. (Reason: CORS request did not succeed).

Access to XMLHttpRequest at 'http://api.sub-domain.ext' from origin 'http://sub-domain.ext' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

CORS 标头已使用以下中间件从 Lumen 设置：

//Http/Middleware/CorsMiddleware.php

class CorsMiddleware

    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    
        return $next($request)
            ->header('Access-Control-Allow-Origin', '*')
            ->header('Access-Control-Allow-Methods', 'GET, POST, DELETE, OPTIONS')
            ->header('Access-Control-Allow-Headers', 'Origin, Content-Type, Authorization, X-Requested-With');        
    


//bootstrap/app.php

 $app->middleware([
     App\Http\Middleware\CorsMiddleware::class
 ]);

当直接从浏览器点击端点时，没有错误并且输出正确呈现。但是当从实时域/子域（外部）进行调用时，我得到了 CORS 错误。

不确定是否可以从 Angular 端设置任何东西（不使用 ExpressJS），或者它肯定只是服务器端的问题。

感谢您的建议。

【问题讨论】：

在访问暂存域时，您是否还在使用 Postman 或其他浏览器？

@GeorgeKoniaris 是的。实际上两者都是。集成后，我使用登台实时服务器。

你在 Laravel 前面使用了某种代理吗？也许登台代理没有将标头传递给客户端。

@GeorgeKoniaris 在 Laravel Lumen 前没有使用代理，使用 AWS Elastic BeansTalk 实例和 Apache 和 PHP 7 作为 API。

【参考方案1】：

问题肯定来自 Laravel 方面，在 .htaccess 文件中，

# Redirect Trailing Slashes If Not A Folder..

如果不是文件夹，它不接受端点末尾的“/”，即<URL/URI>/?Query_Parameters应该是<URL/URI>?Query_Parameters。