I get a public_id (......) is invalid error when fetching from firebase storage.

realabd
realabd Member Posts: 3 ✭
in Developer APIs

Hi, I'm trying to fetch from firebase storage. Despite double-escaping the url, I get a 

x-cld-error:
public_id (https%253A%252F%252Ffirebasestorage.googleapis.com%252Fv0%252Fb%252Fabd-demo-ffb23.appspot.com%252Fo%252Fabddd%25252Fteslaa.jpeg%253Falt%253Dmedia%2526token%253D4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d) is invalid

 

This the actual file url 

https://firebasestorage.googleapis.com/v0/b/abd-demo-ffb23.appspot.com/o/abddd%2Fteslaa.jpeg?alt=media&token=4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d

 

The request url

https://res.cloudinary.com/dxvhsze0l/image/fetch/f_webp,q_auto/https%25253A%25252F%25252Ffirebasestorage.googleapis.com%25252Fv0%25252Fb%25252Fabd-demo-ffb23.appspot.com%25252Fo%25252Fabddd%2525252Fteslaa.jpeg%25253Falt%25253Dmedia%252526token%25253D4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d

Answers

  • aleksandar
    aleksandar Member, Cloudinary Staff Posts: 14

    Hi @realabd,

    Looking at the Cloudinary URL you're using, I see that the remote Fetch URL is URL-encoded twice and because of that, it impacts the value of the public_id that will be used - which will end up having characters not allowed in the public_id hence the error.

    For remote Fetch URLs, you will just want to URL-encode it once:

    E.g.

    Remote URL:

    https://firebasestorage.googleapis.com/v0/b/abd-demo-ffb23.appspot.com/o/abddd%2Fteslaa.jpeg?alt=media&token=4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d

    URL-encoded once:

    https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Fabd-demo-ffb23.appspot.com%2Fo%2Fabddd%252Fteslaa.jpeg%3Falt%3Dmedia%26token%3D4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d

    Then you would use that in the Cloudinary URL:

    Untitled Image

    Please try this out with any other examples you have and let us know how it goes.

  • realabd
    realabd Member Posts: 3 ✭

    So, I encoded the remote url once using the encodeURIComponent.

    It returned the error below

    x-cld-error: Error in loading https://firebasestorage.googleapis.com/v0/b/abd-demo-ffb23.appspot.com/o/abddd%252Fteslaa.jpeg%3Falt%3Dmedia%26token%3D4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d - 403 Forbidden
  • aleksandar
    aleksandar Member, Cloudinary Staff Posts: 14
    edited February 2023

    Hi @realabd ,

    Could you please share the full Cloudinary URL you are accessing that leads to this error?

  • realabd
    realabd Member Posts: 3 ✭

    this is my cloudinary request url: 

    https://res.cloudinary.com/dxvhsze0l/image/fetch/f_webp,q_auto/

    this is the image url:

    https://firebasestorage.googleapis.com/v0/b/abd-demo-ffb23.appspot.com/o/abddd%2Fteslaa.jpeg?alt=media&token=4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d


  • aleksandar
    aleksandar Member, Cloudinary Staff Posts: 14

    Hi @realabd ,

    Thanks for confirming.

    I see this is the same URL in my example above. What you will want to do is URL encode it once so you get:

    https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Fabd-demo-ffb23.appspot.com%2Fo%2Fabddd%252Fteslaa.jpeg%3Falt%3Dmedia%26token%3D4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d

    And then you can use that in your Fetch URL as so:

    https://res.cloudinary.com/dxvhsze0l/image/fetch/f_webp%2Cq_auto/https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Fabd-demo-ffb23.appspot.com%2Fo%2Fabddd%252Fteslaa.jpeg%3Falt%3Dmedia%26token%3D4c9ca3fb-14dc-42ac-a11f-54e5ae968e3d

Categories