Upload Image

We are using the AWS - S3 bucket to store all the media of the website. Our bucket name is urban-fits. Please refer to the AWS documentation as well for the context.
There are different ways to upload the images on AWS S3 but here we're using the most suitable way which involves 2 steps:

First we'll get a presigned url from AWS which will be signed for a limited time for securely upload the image.
Secondly we will upload the actual image by sending it to that Presigned URL, using it as an API.

So, it comes to 2 APIs:

Get Presigned URL
Upload image file on Presigned URL

1. Get Presigned URL

Endpoint

GET /S3/signed-url

Payload

It will require you a mandatory query nameed file_key.
You need to enter the relative path within the bucket file system where you want to host the respected file. For example the path for uploading the user profile pictures is specific and should be strictly followed i.e user-profiles/[user_id].
In this previous mentioned path, the user id should suffixed e.g the user id is 651ab014f10bff23784dd8e8 then the path will look like this: user-profiles/651ab014f10bff23784dd8e8. And finally the API URL will be like this:

/S3/signed-url?file_key=user-profiles/651ab014f10bff23784dd8e8

So in this case we have requested a presigned url from AWS S3 service which will automatically host the file on the specified path for which we requested it.

Response

{
    "success": true,
    "uploadUrl": "https://urban-fits.s3.ap-south-1.amazonaws.com/user-profiles/651ab014f10bff23784dd8e8?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIAWXH553KR4CPX7D3R%2F20240625%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20240625T220903Z&X-Amz-Expires=900&X-Amz-Signature=735f613109b33c6f1fc16c7b8ae3062c318fdab683a39facf22aa0bc9d3e0930&X-Amz-SignedHeaders=host&x-id=PutObject"
}

2. Upload image on Presigned URL

Endpoint

PUT https://urban-fits.s3.ap-south-1.amazonaws.com/user-profiles/651ab014f10bff23784dd8e8...

Payload

Now in the body of request, simply put the file as payload and upload the file. The API will return the confirmation of file being successfully uploaded. And after the confirmation, you can just update the file url wherever you need to update in our server as you know the file url was what we have already requested the presigned url for which in this case will be user-profiles/651ab014f10bff23784dd8e8 .

And for using the image in application, you can prepend the base image url to our actual file url just as mentioned in the API Prerequisites : Images Usage