Images not pulled from AWS S3 to heroku nodejs app - node.js

I have a sails nodejs app running on heroku. I have several images that need to be pulled onto the page i.e. logo. When I had images pulled from photobucket everything works. I moved images to AWS S3. Followed https://devcenter.heroku.com/articles/s3. Images are accessible by their link i.e.:https://s3.amazonaws.com/kenguru/main/kglogoweb.png. But not being pulled when page is loaded.
Any suggestions will be greatly appreciated.

Related

Hosting images when deployed

I'm beginner and using MERN. I've successfully deployed frontend and backend separately on render for testing purposes and when a user signs up they can choose a profile picture, now on localhost this works fine and it successfully adds to mongodb and shows in the web application. However when deployed I get an error that I can't 'GET' the image from the specific path.
Now I'm trying to workout with this is the case but could someone explain in ELI5 terms? Also would I need to host my images such as cloudinary? Thank you.
Tried to upload images when deployed but not being fetched.
You should consider using cloudinary or an S3 bucket to store images in production.
First of all, call your /upload api route
Generate a uuid + .extension (png or jpg)
Upload this key as the name with your image file to cloudinary (for exemple)
Then save this key into your database to be able to access it later on.
If you consider using an S3 bucket, you should always configure a CDN between your client and your bucket to avoid billing’s surprises

NodeJS deploy Heroku image upload error displayed

I have deployed a Nodejs application to Heroku, the cloud I use cloud mongoDB. The problem is that every time I upload a photo to post a post, the app only shows up for about 1 hour, then I re-download it, and the website fails to display the image again? Is it because I use the free Heroku package, everyone? Everyone help me please. This is my website https://myblog-nodejs-mongoose.herokuapp.com/

Send images from EC2 container in API to a front app

I have an API maded with express allowed in a EC2 container.
Also theres an app that use this API to get some post or users data.
When they upload images i use multer to save them in a folder in the project, and save the name of image in a MySQL databa, but i dont know how to send the image to front app, o how they can get the image from container.
This is my folders arch:
use express-static on images directory https://expressjs.com/en/starter/static-files.html on images directory or installing nginx or apache and serve images directory

Path where I store profile pictures is unreachable in production mode

My goal is to upload a profile picture. I did this in development mode using multer in Node.js. Multer asks for a path where to save the new picture.
In development mode, my Angular frontend and my Node.js backend were in the same file (see below for the project structure). The destination path used in Multer worked for development mode.
I then deployed my backend and frontend separately and now this path doesn't work. How can I make sure that the uploaded profile pictures end up in the same map as it did in development?
This is the structure in development mode. SRC map contains the Angular frontend code and backend contains the Node.js backend.
This is the path I used to store uploaded profile pictures with Multer. The problem now is that I deployed my backend and frontend separately to Heroku and so this path doesn't work anymore.
How can I change my path so that my uploaded profile pictures still get added to this assets/images/profile-pictures map?
The filesystem that Heroku provides is ephemeral: any changes you make to it will be lost the next time your dyno restarts. This happens frequently (at least once per day).
Instead of storing uploaded files on the local filesystem, Heroku recommends storing them on a third-party service like Amazon S3. The multer-s3 library should let you do that fairly easily.
Once the files have been stored you can access them via Amazon's SDK or, if you've configured your uploads accordingly, via HTTP. Regular HTTP access can be authenticated or anonymous.

using backend files nodejs

Sorry, It might be very novice problem but I am new to node and web apps and just have been stuck on this for couples of days.
I have been working with a API called "Face++" that requires user to upload images to detect faces. So basically users needed to upload images to my webapps backend and my backend would do an API request with that image. I somehow managed to upload the files at my node's backend using tutorial provided below but now I am struggling how to use those image files. I really don't know how to have access to those files. I thought writing just the filepath/filename would help but it did not. I am really new at webapps.
I used tutorial from here: https://coligo.io/building-ajax-file-uploader-with-node/
to upload my files at back-end.
thanks
You can also use the Face++ REST API node client
https://www.npmjs.com/package/faceppsdk
As per in documentation it requires a live URL on web. Then you have to upload your files into remote location (You may upload files to a Amazon S3 Bucket)
And also you check the sample codes from Documentation where you can upload directly to Face++

Resources