setupProxy.js 不适用于 React 应用程序中的 API 调用

问题描述

我有一个应用程序可以对 api 进行 api 调用。它不是本地服务器，而是提供体育数据的不同网站。最初，我收到了 CORS 错误，因为它的来源不同： cors error

我最初尝试在 package.json 中设置我的“代理”变量。

  "name": "whattowatch","version": "0.1.0","private": true,"proxy": "https://api.(apiWebsite).us/","dependencies": {
    "@testing-library/jest-dom": "^5.11.9","@testing-library/react": "^11.2.5","@testing-library/user-event": "^12.6.3","http-proxy-middleware": "^1.1.0","react": "^17.0.1","react-dom": "^17.0.1","react-loading": "^2.0.3","react-scripts": "4.0.2","web-vitals": "^1.1.0"
  },"scripts": {
    "start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"
  },"eslintConfig": {
    "extends": [
      "react-app","react-app/jest"
    ]
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  }
}

尽管如此，fetch 调用仍然在访问我的 localhost:3000 api call 最后，我尝试根据 React 文档设置代理服务器：

const { createProxyMiddleware } = require("http-proxy-middleware");

module.exports = function (app) {
  app.use(
    "/soccer-t3/",createProxyMiddleware({
      target: "https://api.sporTradar.us",changeOrigin: true,})
  );
};

我仍然收到以下请求：http://localhost:3000/tournaments/sr:tournament:17/standings.json?api_key=...

任何帮助将不胜感激！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）