预检响应中的 Access-Control-Allow-Methods 不允许方法 PATCH

Question

我在 ReactJS 中使用 axios PATCH 方法来更新记录，但由于以下错误而失败

无法加载http://192.168.99.100:8080/adslots/883：预检响应中的 Access-Control-Allow-Methods 不允许方法 PATCH。

这是我的行动：

export const UPDATE_AD_SLOTS_REQUEST = 'UPDATE_AD_SLOTS_REQUEST';
export const UPDATE_AD_SLOTS_SUCCESS = 'UPDATE_AD_SLOTS_SUCCESS';
export const UPDATE_AD_SLOTS_ERROR = 'UPDATE_AD_SLOTS_ERROR';


export function updateAdslotsRequest(){
  return {
    type: UPDATE_AD_SLOTS_REQUEST
  }
}

export function updateAdslotsSuccess(data){
  return {
    type: UPDATE_AD_SLOTS_SUCCESS,
    data: data
  }
}

export function updateAdslotsError(errors){
  return {
    type: UPDATE_AD_SLOTS_ERROR,
    erros: errors
  }
}

export function updateAdslots(data, id) {
  return dispatch => {
    dispatch(updateAdslotsRequest());
    return axios.patch(`http://192.168.99.100:8080/adslots/${id}`, data)
      .then(res => {
        dispatch(updateAdslotsSuccess(res.data));      
      })
      .catch(errors => {
        dispatch(updateAdslotsError(errors));
      })
  }
}

我完全糊涂了。

Answer 1

您调用的 api 必须允许 PATCH 请求。他们可以通过将 Access-Control-Allow-Methods 标头设置为也包含 Patch 来实现此目的。了解如何使用您的 api 使用的任何服务器端语言来执行此操作。您也可以尝试将呼叫切换为 POST 请求，但这更多的是临时修复。

Answer 2

尝试这个解决方案：

1. 转到您定义了所有中间件的 app.js 文件。

2. 打开终端并输入命令“npm install cors”，然后按 Enter。

3. 现在在您的文件中写入以下代码：

   const cors = require("cors");
   
   const app = express();
   
   app.use(cors());
   

希望它能成功！

Answer 3

我认为这是与后端 CORS 设置相关的问题。您必须在 CORS 设置中允许 PATCH 请求。您使用什么样的后端服务器？