Question 72746 in Reactjs Question posted in
The new location for the React Documentation can be found here.

What is the best way to store the images for the website the uses MERN stack . Is it on the server, DB, or cloud? – Reactjs

The backend is built with node js and the frontend React. The number of images is not very low not very high.
Should I store the images in the database (MongoDB)? , on the cloud like Amazon?, or in the server?

Note: one of the functionalities on the website is : the admin can add a product with the image from his desktop , and this product with the uploaded image should appear on the products page

please explain which is the best choice with the code, Thank you.

i don’t try any thing yet.

Tags:

2

Answers


  1. 0

    The usual method is to upload them to a bucket, for instance by using AWS’ S3.

    You should not use your server nor your database for this. It would be too heavy for your database, and allowing users to upload files to your server is a risky path.

    Login or Signup to reply.
  2. 0

    Initial approach:

    1. Begin by creating a POST/PUT API for the admin panel to add products, including images. You can use buffer streams for handling large files.
    2. Save the files in cloud storage and store the path in the database.
    3. To retrieve the files, create an API that gets the files from cloud storage as octet/streams.

    Some important points to consider:

    1. Returning files as simple buffers may result in issues with large files, so streams are a better option for such cases.
    2. Depending on the nature of the files, you may need to consider encrypting the files upon upload and decrypting them upon retrieval. You can also utilize cloud storage auto-encryption features.

    More advanced second approach:

    1. Set up a CDN that is linked to cloud storage.
    2. When a user wants to access the files, the server sends the CDN URL of the file to the frontend application.
    3. The frontend application can access the file directly via the CDN.
    4. To ensure that the files remain secure and not public, you can restrict public access on the CDN. You can create an API to generate cookies for the frontend application to access the files in a safe manner, and you can whitelist the domains used by the frontend application.
    5. You can even fine-tune access control of the S3 bucket structure based on user tokens, so that users only have access to their own files in the bucket. You can find extensive documentation for all of these configurations on the AWS console.
    6. However, this approach depends on several factors such as long-term plans, resource counts, and costs.
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search