Howto Upload small profile image/avatar to mongodb?


Cant find a example on howto upload a image to the mongodb, that the user want to use for his profile image/avatar.

Is it not okay to upload small images to the db? i’m making a hybrid app so the image have to work offline and I dont know it will work offline if I use Cloudinary, S3 og other online media storage services


If you have an input field with the id ‘upload’ something like the following should work.

if (window.File && window.FileReader && window.FileList && window.Blob)
    for file in template.find('#upload').files
        reader = new FileReader()
        reader.onload = (e) =>
                type: file.type,
                size: file.size
                dataUrl: reader.result

If it’s a good idea depends an the number of users and how big the files are.


Is it posibble to auto resize the image to eg. width 300px?


You can use HTML canvas to resize the image.


Do you have a link for a simple example where it uses HTML canvas on the jpg image before upload?