React 下的 http-proxy-middleware 转发错误

最近写了一个前后端分离的框架，因为涉及到多个 API 的调用，存在跨域的问题，所以使用了 http-proxy-middleware （以下称为 HPM ）

版本:

1. React 18.2.0
2. HPM 版本 2.0.6 npm 最新版本 使用 Typescript

目标: "/map_services/v1/getVersion" -> "http://localhost:8810/v1/getVersion"

问题: 1. /map_services 确实被代理了，但后端服务器显示请求的是"http://localhost:8810/map_services/v1/getVersion" 即 PathRewrite 并没有生效 2. 我发起的是 POST 请求，但后端服务器显示收到的是 GET 请求

后端请求

export const getVersion = async (): Promise<string> => { return await http("/map_services/v1/getVersion", { method: HTTP_METHODS.POST, data: {} }).then((response) => { if (response.data !== "") { return response.data; } return "null"; }) } const http = async (url: string, {data, headers, ...customConfig}: ICOnfig= {})=>{ 数据处理就不写了 return await window.fetch(url, config).then(async (res) => { let dataRes: IRemoteRespOnse= await res.json(); if (dataRes.info !== SUCCESS_FLAG) { return Promise.reject({message: "Bad Request!"}); } if (dataRes.info) { return dataRes; } else { return Promise.reject(dataRes); } }); } 

setupProxy.js

 const {createProxyMiddleware} = require('http-proxy-middleware'); module.exports = function (app) { app.use( '/map_services', createProxyMiddleware({ target: 'http://localhost:8810', PathRewrite: { '^/map_services': '/' } }) ); }