CODEWITHSUNDEEP
node.jsangularmongodbfile-uploadimage-uploading
Arsen Galloghlyan
Arsen Galloghlyan

Reputation: 161

What is the best practice when uploading images using Angular 8 as a front-end framework, nodejs as a back-end and MongoDB as a database (MEAN)?

In my project I need to add image uploading functionality to let users to upload images they wanted. What is the best practice to organize the uploading?

I tried to save the images (using Node.js) in the local folder (that is the 'assets' folder of my Angular project).

The problem is when I add images from my project's 'add' page and navigating back to my main page Angular can't find the images by their's paths (from 'assets' folder) without project rebuilding (ng serve). How can I solve this?

Upvotes: 0

Views: 698

Answers (1)

cklimowski
cklimowski

Reputation: 601

I'm not as familiar with mongoDB as I am with SQL server, but if Mongo has a datatype similar to a byte-array, you could have users upload the image to the DB as a byte-array, and then call a "get" of that resource, save the image to assets, this should prevent you from having to re-serve that project. You could call the get as part of the end of the upload function, or just upon home page load.

I've also had luck NOT saving images to assets folder but their own images folder in the project root. NodeJS should have a function to create a folder if one doesn't exist and save the byte-array image to that folder as a jpeg or png or whatever. You would call this conversion from byte array/save method AFTER doing your get of the byte-array image from MongoDB. Once you have the byte-array, use the built in libraries (again, I'm more familiar with .Net) but I'm sure there's a way in Node to deserialize the byte-array from the database and save that image to an image folder.

Upvotes: 1

Related Questions