首页 > 解决方案 > 我应该在哪里存储我的电子商务 React 应用程序的图像?

问题描述

我有一个电子商务反应应用程序,所以你知道每个产品至少有三个或四个图像,所以为了在我的网站上显示产品的图像,我在公共文件夹中创建了一个名为“images”的文件夹,所以每次我想展示我可以获得的特定产品的图像并非常简单地展示它们,现在这非常非常棒。
问题
我们知道每个电子商务网站都应该有一个管理员,他可以发布新产品和上传新图片,所以到时候我的网站上可能会有数千张图片。
质疑 存储我的 React 应用程序图像的最佳做法是什么?
我需要使用 AWS 或 Firebase 等第三方吗?
谢谢你。

标签: reactjs

解决方案


将图像存储在代码库资产文件夹中并不是大量图像的最佳选择。处理更新、插入是一个大问题。所以你有以下选择。

选项:云/本地

  • 您可以像 AWS S3 一样存储在云中
  • 如果你想在本地存储,你可以存储在 MongoDB 网格中,甚至存储在文件系统中,文件路径存储在数据库中。

领先一步

但是继续前进,您可能需要根据图像占位符的响应式图像。例如,您可能需要不同大小的缩略图,例如列出页面、Android 应用程序、iOS 应用程序。您可能还需要压缩图像,以防它们对于 Web 目的来说很重。

  • 在这种情况下,您可以选择以所需的分辨率存储图像。为此,您必须在图像上存储多个版本。例如 product1/original.jpg、product1/compressed.jpg、product1/300x300.jpg 等
  • 您可以即时调整/裁剪图像的大小。如果您想编写调整大小的系统,您可以编写基于 ImageMagick/vips/PIL 等的代码。您可以尝试搜索现成的基于 nginx 的插件来服务器响应图像。
  • 如果您不想自己调整大小,您可以使用提供 CDN + 图像操作的 imgix、cloudinary、akamai 等图像存储服务。其中一些提供存储+操作,而一些仅提供操作。

推荐阅读