http-proxy-middleware 不适用于 Heroku

如何解决http-proxy-middleware 不适用于 Heroku

我使用 create-react-app 制作了一个前端 SPA。我实现了 http-proxy-middleware 来解决通过 api 调用 https://api.deezer.com 的 CORS 问题。代理在本地完美运行，但在部署到 Heroku 后无法添加标头，并且 api 调用中的 res.data 在控制台中未定义。

这是我的 /src 文件夹中的 setupProxy.js。

const proxy = require('http-proxy-middleware');

module.exports = function(app) {

    app.use(
        proxy("/chart",{
            target: "https://api.deezer.com",changeOrigin: true
        })
    )

    app.use(
        proxy("/artist",changeOrigin: true
        })
    )

    app.use(
        proxy("/search",changeOrigin: true
        })
    )

    app.use(
        proxy("/album",changeOrigin: true
        })
    )
}

我的 api 调用看起来像这样（一个例子）：

getTopHits() {
        return(
            axios.get('/chart')
        )
    }

这是我的 package.json：

{
  "homepage": "https://secret-hamlet-05097.herokuapp.com/","name": "client","version": "0.1.0","private": true,"dependencies": {
    "@testing-library/jest-dom": "^4.2.4","@testing-library/react": "^9.5.0","@testing-library/user-event": "^7.2.1","axios": "^0.21.1","fetch-jsonp": "^1.1.3","react": "^16.13.1","react-dom": "^16.13.1","react-router-dom": "^5.2.0","react-scripts": "3.4.3"
  },"scripts": {
    "predeploy": "npm run build","deploy": "gh-pages -d build","dev": "react-scripts start","start": "react-scripts start","build": "react-scripts build","test": "react-scripts test --env=jsdom","eject": "react-scripts eject","heroku-postbuild": "npm run build"
  },"eslintConfig": {
    "extends": "react-app"
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  },"devDependencies": {
    "gh-pages": "^3.1.0","http-proxy-middleware": "^0.19.1"
  }
}

可能有什么问题？