使用 Axios 到 Laravel API 發出刪除請求會引發錯誤，但在失眠時工作正常

Question

嗨，我正在使用 create-react-app 創建一個 Web 應用程序，它使用在 laravel 5 中開發的端點。

當我使用 axios 向服務器發出刪除請求時，出現此錯誤跨域請求被阻止：同源策略不允許讀取http://127.0.0.1:8000/api/carts/7?api_token= 上的遠程資源{api_token} 。 （原因：未在 CORS 標頭“Access-Control-Allow-Methods”中找到方法）然而，當我在 Insomnia（HTTP Rest Client）上發送相同的請求時，我沒有收到任何錯誤。

這是反應代碼

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 中的端點，反應應用程序正在向

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 提供的。

請幫忙

Answer 1

在前端/客戶端文件夾的 package.json 文件中嘗試添加這樣的代理

  "name": "app_name",
  "proxy": "http://127.0.0.1:8000"

Answer 2

通過在 Laravel 應用程序（API 提供程序）中添加 Laravel Cors 包解決了該問題。

以下是 Laravel Cors 包的鏈接

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