axios.post給出了CORS問題，而GET在使用Laravel API的React中工作正常

Question

我正在嘗試使用React應用程序使用LARAVEL 5.7本地REST API創建帖子。 我正在使用帶有crossOrigin：true的axios.post方法。 我不明白為什么get起作用而post不起作用。 Laravel API在基於wamp的本地主機上，React應用程序在本地主機上運行：3000我的action / index.js如下，相關的動作創建者是addPost（）：-

 import axios from 'axios'; export const FETCH = 'FETCH_POSTS'; export const ADD = 'ADD_POST'; const URL = 'http://postsapi.test/api/v1'; export function fetchPosts(){ const url = `${URL}/posts`; const request = axios.get(url, { crossDomain: true }); //console.log(request); return{ type: FETCH, payload: request } } export function addPost(post){ const url = `${URL}/posts`; console.log(url); const request = axios.post(url,post); //console.log(request); return{ type: ADD, payload: request } } 

這是來自瀏覽器的快照，顯示在預檢請求中，Access-Control-Allo-Origin也設置了兩次

在控制台中，我遇到了這個問題

跨域請求被阻止：同源策略禁止讀取位於http：//postsapi.test/api/v1/posts的遠程資源。 （原因：不允許使用多個CORS標頭“ Access-Control-Allow-Origin”）。

Answer 1

發生這種情況是因為服務器和客戶端位於不同的來源。

為了解決這個問題，您必須在Laravel服務器中啟用跨域資源共享作為中間件。 該線程可能會對您有所幫助。