0

嗨，我正在使用 create-react-app 创建一个 Web 应用程序，它使用在 laravel 5 中开发的端点。

当我使用 axios 向服务器发出删除请求时，我收到此错误 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1:8000/api/carts/7?api_token= {api_token}。（原因：在 CORS 标头“Access-Control-Allow-Methods”中未找到方法）然而，当我在 Insomnia（HTTP Rest 客户端）上发送相同的请求时，我没有收到任何错误。

这是反应代码

handleDelete = ( cartId ) => {
    const api_token = localStorage.getItem('jbs_user_api_token');

    console.log("Delete cart item: ", cartId);

    axios.delete(`carts/${cartId}?api_token=${api_token}`)
        .then( res => {
             console.log(res);
        })
       .catch( err => {
             console.log(err);
        });
    }

以下是 Laravel 5 中的端点，react 应用程序正在发出上述请求

Route::resource('carts', 'API\CartAPIController');

这是处理删除请求的方法（laravel）

public function destroy($id)
{
    $cart = $this->cartRepository->findWithoutFail($id);

    if (empty($cart)) {
        return $this->sendError('Cart not found');

    }

    $cart = $this->cartRepository->delete($id);

    return $this->sendResponse($cart, __('lang.deleted_successfully', ['operator' => __('lang.cart')]));

}

毫无疑问，API（后端）没有错误，因为请求在失眠状态下工作正常。此外，这两个应用程序（react 和 laravel）都是从 localhost 提供的。

请帮忙

4

2 回答 2

0

在前端/客户端文件夹的 package.json 文件中，尝试像这样添加代理

  "name": "app_name",
  "proxy": "http://127.0.0.1:8000"
于 2020-11-13T15:46:52.893 回答
0

通过在 laravel App（API Provider）中添加 Laravel Cors 包解决了这个问题。

以下是 Laravel Cors 包的链接

https://github.com/fruitcake/laravel-cors

于 2020-11-26T14:21:42.390 回答