如何让 React setupProxy 与 express.js 一起正常工作

Question

我目前在尝试提供来自 express 的图像以做出反应时遇到问题。我的 express.static 设置正确，所以当我访问 localhost:5000/public/images/me.jpeg 时，我会在浏览器中收到图像。但是，当我做出反应并尝试使用 <img src="/public/images/me.jpeg" 时，我什么也没收到。我认为这与设置代理进行反应有关，但我不太确定。任何帮助都是极好的！谢谢！

资产的表达文件夹结构：

public --
   images --
      me.jpeg

app.js in express:

const express = require('express');
const path = require('path');
const bodyParser = require('body-parser');
const app = express();

const contactRouter = require('./routes/contact');

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.use('/public', express.static(__dirname + "/public"));
app.use(express.static(path.join(__dirname, 'client/build')));

//route handlers

app.use('/contact', contactRouter);

app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname + '/client/build/index.html'));
});


module.exports = app;

我在 src 中的 setupProxy.js 文件（反应）

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

module.exports = function (app) {
    app.use(proxy('/public', {target: 'http:localhost:5000'}));
}

感谢大家的帮助！

另外忘了提及**所有代码都在生产中工作，我收到了我的图片，这仅用于开发

Answer 1

在 react package.json 文件的 script 标签后或末尾添加这一行。

"proxy": "http://localhost:4000"