How to remove image background while uploading and image should store in my S3 folder?

Durga Ganesh

July 11, 2019 12:40 Edited

Hi,

I have a new multipart file and I want to remove background image while uploading using Cloudinary API. I have already upgraded account which is activated auto-upload mapping from here. I already created a separate folder which is mapping into my own S3 bucket. I want to store my image into my S3 folder location which is ongoing to remove the background of an image using the cloudinary upload method.

Auto Upload mapping:

Folder: <test>

URL Profile : <s3://my-bucket>

My Sample code:

cloudinary.uploader().upload(imageFile.getBytes(), 
  ObjectUtils.asMap(
    "folder", "test/",
    "public_id", imageFile.getOriginalFileName(),
    "background_removal", "cloudinary_ai"));

Comments

9 comments

Stephen Doyle

July 11, 2019 13:05
Hi Durga,

When you upload with the specified options, the background removal add-on will run, and after it completes, it will replace the original file in your account with the results of the background removal - you can then use the URL for the image in your website or app, download it and save it to your server, or whatever other operations you need to perform.

If you specify a notification_url we'll send a notification to that URL to let you know the background removal has completed, so you can use that to trigger the process which updates the image details in your database, starts using it on your site or app, download it and make another copy locally, etc.

There's an example here: https://cloudinary.com/documentation/cloudinary_ai_background_removal_addon#asynchronous_handling

This doesn't require an auto-upload mapping, however, because you're uploading the file directly in this example- there's no need for the auto-upload mapping because you can just supply the image directly, or its S3 or HTTP URL in the upload() method

Please let me know if there's anything else I can help with
0
Durga Ganesh

July 12, 2019 04:54
Hi, Thanks for your reply.
1. I want to upload the multipart image directly to the cloudinary API and the removed background image needs to be uploaded in my S3 bucket. Is this possible?
2. If the above is possible, can I get the image url of my S3 bucket instead of cloudinary image url (for ex http://res.cloudinary.com/<my-cloud-name>/image/upload/version/<my-file.jpg>)
3. Also I would like to get removed background image result immediately after I upload the image to cloudinary instead of setting up notification url. Is this possible?
0
Stephen Doyle

July 12, 2019 09:30
Hi Durga,

You can take the Cloudinary URL of the image and use that to upload it to your S3, save it locally, or any other operation you need, but we don't support writing files to your S3 except for backups on our paid plans ( https://support.cloudinary.com/hc/en-us/articles/203744391-How-do-I-grant-Cloudinary-with-the-permissions-to-backup-on-my-private-S3-bucket- )

Background removal is an asynchronous operation and can't be done immediately as part of the upload. It doesn't take very long, but you must either call the API to check if the processing has completed, or have us send you a notification to let you know the processing has completed - I recommend the notification URL because you can use this notification to also perform the copying to S3, or whatever other actions you need, making it effectively automatic.

Thanks,
Stephen
1
Durga Ganesh

July 19, 2019 10:26 Edited
Hi Stephen,

How can I get the notification endpoint from Cloudinary into my own rest service,

For example, https://dev:8080/cloudinary/status this is my notification_url.

As mentioned in the document,

If you used a notification_url in your upload or update call, the endpoint you specified will receive a JSON POST request when the background removal is complete, including the new url & secure_url with the updated .png file extension and new version number.

If POST request received as JSON format, then what is the response return by this endpoint and what will be the response_type?

Kindly give me the Sample POST Request and Response

Thanks,
0
Stephen Doyle

July 19, 2019 11:17
Hi Durgesh,

The URL you use as the notification URL needs to be accessible publicly or our system can't reach it, so a local server won't work, it must be a URL we can make a request to.

You can see more details about the request we send here: https://cloudinary.com/documentation/upload_images#upload_notifications

In response, you should send an HTTP 200 status code, but the content of your response isn't important.

If you want to test the format of the notifications we send before writing your own controller to accept and process them, I recommend using a third-party webhooks testing services like https://webhook.site/ or https://testwebhooks.com/ to see what's included in the notification.

Regards,

Stephen
1
Durga Ganesh

July 22, 2019 12:05
Hi Stephen,

I used testing service u have given https://webhook.site/ to check how notification URL will receive the upload response.

For example, Sample Code:
```
Map upload = cloudinary.uploader().upload(new File(inputPath),
        ObjectUtils.asMap(
                "public_id", "fashion",
                "background_removal", "cloudinary_ai"
                "notification_url", "https://webhook.site/72f6ae6b-46d5-46ae-8f78-886281520bbb"));
```
I did the upload process of background removal using Cloudinary API and I passing notification URL as "https://webhook.site/72f6ae6b-46d5-46ae-8f78-886281520bbb "

The upload JSON response attached here https://api.myjson.com/bins/sa6kt and screenshot of webhook site

I receive status as "pending" at the time of 4:42.

After a few seconds, I got a JSON response https://api.myjson.com/bins/i7ygd which is over completed the background removal process and the status is "completed" at the time of 4:42

But the image doesn't get the removed background, Still, I'm getting an old image of which is I uploaded into the Cloudinary account. The image takes approximately 9 to 10 minutes to remove the background.

Why Cloudinary does the behavior of getting the status is completed before removing the background of an image?

Thanks,
0
Stephen Doyle

July 23, 2019 08:01
Hi Durga,

If you're accessing the file and then refreshing the URL after the notification is received, you're probably getting a cached copy of the image from the CDN or from your browser cache. For the file in your example, I've checked our logs, and it was replaced in your account before we sent the notification webhook.

Either of the following should give you the correct file:

1) Don't access the 'original' until after the add-on is finished, so there's no caching of the version of the image that was saved before the background removal completed

2) Access the image using the same URL format that our SDK produces, which is also the format we send CDN invalidations for by default: https://support.cloudinary.com/hc/en-us/articles/360001208732-What-URL-conventions-are-invalidated
- This is the format produced by the cloudinary_url() or cloudinary::url(), etc, methods in our SDKs

I also notice that your example URL ends in .jpg.jpg - this happens if you set the public_id in the upload API call and add the extension to it. You don't need to do that - leave the extension out when specifying the public_id; If you upload a JPEG image, we'll detect that it's a JPEG and return a .JPG URL by default, but you can change the extension on the URL to have the image returned in another format. If you're removing the background, you may want a PNG or WEBP output so that the background is transparent, for example.

Thanks,

Stephen
0

Durga Ganesh

July 25, 2019 10:35

Hi Stephen,

Thanks for the answer, But my notifcation_url did receive two JSON POST request one is upload JSON request which is denoting status as "pending" another one JSON request denoting as "complete". How do I check these requests at a far time?

Refer the sample JSON request

1. After upload - Pending

{
  "public_id": "dog_couch",
  "version": 1551099901,
   ...
   ...
  "url": "http://res.cloudinary.com/demo/image/upload/v1551101478/dog_couch.jpg",
  "secure_url": "https://res.cloudinary.com/demo/image/upload/v1551101478/dog_couch.jpg",
  "info": {
    "background_removal": {
      "cloudinary_ai": {
        "status": "pending"
      }
    }
  },
  "original_filename": "dog_couch"
}

2. Removed background of an image - Complete

{
    "info_kind": "cloudinary_ai",
    "info_status": "complete",
    "public_id": "dog_couch",
    "uploaded_at": "2019-02-25T17:33:45Z",
    "version": 1551104931,
    "url": "http://res.cloudinary.com/demo/image/upload/v1551104931/dog_couch.png",
    "secure_url": "https://res.cloudinary.com/demo/image/upload/v1551104931/dog_couch.png",
    "etag": "6567d798ca4087468dc7d23bcb8a45ec",
    "notification_type": "info"
}

Thanks,

Stephen Doyle

July 25, 2019 12:25
Hi Durga,

For your workflow, which requires the version of the image with no background, you should wait until the second notification is received before using the image.

The first notification is sent when the upload completes, and the second one is sent when the image is updated with the new version (the version without the background). You can also see that the version in the URL has changed between the two requests.

If you need to check at a later time to see the status, the Admin API to fetch the details of a single resource will return the image's metadata, including the status of the background removal.
For an image in my account (which has the background removed), this is in the data returned by the API:
```
 },
"background_removal": {
"cloudinary_ai": {
"status": "complete"
}
}
```
So if you miss the notification, you can check the status directly with the API afterward

Regards,

Stephen
1

Post is closed for comments.

How to remove image background while uploading and image should store in my S3 folder?

Comments

Didn't find what you were looking for?