create-react-app:我在哪里放置动态上传的图片?

时间:2018-05-22 23:15:19

标签: image reactjs express upload create-react-app

您好我正在使用create-react-app,我已经设置了一个文件上传,允许将图像发送到后端并保存在本地(到项目构建目录)。我能够通过localhost:4000 / image.png动态引用图像,这样就已经可以工作了(即:我有一个博客,可以上传我之后通过blogList访问的图像)。

但是我认为这可能不是动态上传图像的最佳位置。我已经阅读了关于create-react-app的文档,并且提到图像的位置似乎都不适用于我的用例,我觉得我肯定做错了但我不确定是什么。

docs im指的是: 说使用“导入”,但我动态加载,所以我不知道这将如何工作? https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-images-fonts-and-files

说使用公共,但不需要重建?因为im动态加载是不可能的:https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#when-to-use-the-public-folder

注意:我有一个图像上传器和后端工作正常它已经使用/ build目录工作。我可以上传和动态参考图像。我只是在寻找做这样事情的最佳实践。谢谢! (如果你提到“只使用nginx”,请你详细说明一下实施情况)

1 个答案:

答案 0 :(得分:1)

作为一名学习者,我一直在努力解决这个问题,并尝试过不同的方法。对于很少使用的资产,使用/ public for client可能很有用但我有一个应用程序,客户端上传图像并管理它们。和你一样,我不喜欢这些方法,最终得到了这个设置。

  • 在后端创建/ public目录并将图像上传到/ public / images
  • 使用Express静态服务/公共目录。
  • 对图像路径使用动态路径变量(通过配置设置)。 http://localhost:backend_port/public/images用于开发和/ public / images用于生产。

我不知道这是最好的方法,但它对我有用。除了在我设置之前上传图像时最好的方法CRA在每次上传图像后刷新(热重新加载)我的应用程序。