Use proxy to replace overlay

[Login (Codelessnative.com)]

Hi

I am using uploadcare CDN to generate map markers which is brilliant. It will be a part of a big app release in July.

I am using an overlay to add a stoke to my pictures (proxy source):

But would like to flip that around and add the pictures as an overlay to a base marker so that the base defines the image canvas and so that I can get this:

What is the syntax to change the overlay picture using a proxy?

I believe this is the only way, considering that is not possible to expand the canvas with the overlay or position the base picture on the canvas.

How do I achieve it using proxy?

[Alex (Alex Chernenko)]

Hi @Login,

Thanks for your question! If I understand correctly, you want to use a remote image URL as an overlay image. If so, this is not possible because the overlay operation only accepts a UUID as a parameter. You should probably consider switching to explicit image uploading and using the default CDN URL scheme instead of Proxy. In this case, you’d be able to flip around the base and overlay images easily:

https://ucarecdn.com/UUID1/-/overlay/UUID2/...
https://ucarecdn.com/UUID2/-/overlay/UUID1/...

Our Upload API provides an endpoint for uploading files from remote URLs, and this method is implemented in our API clients. For example:

import { fromUrl } from '@uploadcare/upload-client'

const { uuid } = await fromUrl(
  'https://acme.com/image.jpeg',
  {
    publicKey: 'YOUR_PUBLIC_KEY',
  }
)

Also, if you need to get a UUID assigned to an image fetched by Proxy, you can do this using the json operation:

https://YOUR_PUBLIC_KEY.ucr.io/-/json/https://acme.com/image.jpeg

A response will look like this:

{
"id": "ba8bb57d-0001-413d-9327-99bd4e17d968",
"dpi": [
72,
72
],
"width": 632,
"format": "JPEG",
"height": 954,
"sequence": false,
"color_mode": "RGB",
"orientation": null,
"geo_location": null,
"datetime_original": null,
"hash": "95da6ba3644c98e5"
}

Where id is the image’s UUID you can use as a base or overlay image.

If this doesn’t help, please describe your requirements in more detail, and we’ll see what else we can do to help.

[Amanda_Jansen]

Thanks, my issue has been fixed.