时间戳

首页 > 解决方案 > 从 React 前端调用 PHP Lumen 后端并解决 CORS 问题

javascript - 从 React 前端调用 PHP Lumen 后端并解决 CORS 问题

问题描述

所以基本上我使用 Lumens 作为我的后端 api（在 localhost:8000）。现在在我的前端 React 应用程序（在 localhost:3000）上，我向后端发出请求，如下所示：

fetch(`http://localhost:8000/feedback/add`, {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                feedback: this.state.feedback,
                email: this.state.email,
            }),
        })

但是，当我向/从不同的服务器发出请求时，我一直遇到 cors 问题。我一直在谷歌搜索并试图找出解决方案，但似乎有很多不同的想法，例如在 Lumens 中使用中间件（许多不同的解决方案）或设置模式：no-cors 前端。但我真的不知道该怎么办，因为它们似乎仍然会导致进一步的问题。

有没有人有类似的设置？什么是一劳永逸地解决这个问题的方法？

标签： javascriptphplaravelcorslumen

解决方案

我开发了一些以 Laravel 作为后端的 SPA。默认情况下，Laravel 保护您免受未经授权的 API 调用，这听起来就像您遇到的那样。

我建议您允许从第三方域调用后端的方法是使用 composer 安装 Spatie CORS 包：

composer require spatie/laravel-cors

该软件包与 Laravel 和 Lumen 兼容。自述文件包含您需要的所有安装说明。

正确安装后，您将能够指定哪些第三方域可以访问您的 API：

'allow_origins' => [

    '*', // all domains are allowed... or set them up individually:

    'https://my-site-1.com',
    'https://my-site-2.com', 
],

Spatie CORS 包：https ://github.com/spatie/laravel-cors

推荐阅读