静态文件 express/react 的相对路径答案

【问题标题】：Relative path of static files express/react静态文件 express/react 的相对路径
【发布时间】：2019-08-19 09:18:53
【问题描述】：

我在 localhost:3000 上运行我的 react 客户端，在 localhost:4000 上运行我的 express 服务器，并且我的服务器中有一个包含图片的静态文件夹。

我正在尝试将图像路径保存到 MySQL 数据库，并在 React 中将其用作 img src，但如果不对路径进行硬编码，我无法弄清楚如何做到这一点。例如，localhost:4000/images/img1.jpg 有效，但如果我明天更改主机名，我的所有数据库数据都变得无关紧要。

【问题讨论】：

【解决方案1】：

三个答案：

在 react 中，您可以通过连接常量字符串和变量来填充道具。只需将/images/img1.jpg 保存在数据库中，而不是完整的 URL。然后反应做<img src={'http://localhost:4000/' + imagePathFromDB} />。当您更改服务器时，只需更改一次。
您可以创建一个简单的 SQL 查询来更新您的数据库以使其具有相关性，这就是 SQL 数据库的美妙之处。

例如

update images set path=replace(path,'localhost:4000','newdomain.com')

瞧！

如果您使用create-react-app，您可以使用proxy parameter 为同一域的前端和后端提供服务。然后只需保存在数据库中 /myimage.jpg 和 React <img src={myVariable} />

【讨论】：