javascript - 如何让 React setupProxy 与 express.js 一起正常工作
问题描述
我目前在尝试从快递中提供图像以做出反应时遇到问题。我的 express.static 设置正确,所以当我访问时,localhost:5000/public/images/me.jpeg
我会在浏览器中收到图像。但是,当我做出反应并尝试使用时,<img src="/public/images/me.jpeg"
我什么也没收到。我认为这与设置代理进行反应有关,但我不太确定。任何帮助都是极好的!谢谢!
资产的快速文件夹结构:
public --
images --
me.jpeg
快递中的 app.js:
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'}));
}
谢谢你们的帮助!
也忘了提及**所有代码都在生产中工作,我收到了我的图片,这仅用于开发
解决方案
将此行添加到 react package.json 文件中 script 标签之后或最后。
"proxy": "http://localhost:4000"
推荐阅读
- python - 在python中初始化对角矩阵
- glsl - Alpha 通道淡入淡出动画
- node.js - 错误:在 Dialogflow 中的新有效负载处平台不能为空
- java - 来自新 CSVReaderHeaderAware 的 FileNotFoundException
- java - 使用 jgoodies-looks WindowsLookAndFeel 时 JMenu 看起来很奇怪
- java - HttpUrlConnection 忽略输入的值
- javascript - 在 window.onload 之外定义时,Javascript“clearInterval”方法无法停止计时器
- javascript - 致命错误:接近堆限制的无效标记压缩分配失败 - 使用 fs 处理大文件时 JavaScript 堆内存不足
- r - 强制对 R 包进行串行编译
- node.js - 超级账本结构调用注册端点失败并出现错误