search

nuxt / image

Plug-and-play image optimization for Nuxt applications.
https://image.nuxt.com
MIT License
1.32k stars 267 forks source link

IPX Provider breaks when paired with GCP Cloud Run & Firebase Hosting #392

Open Diizzayy opened 3 years ago

Diizzayy commented 3 years ago

Github Repo

Demo Showcasing This Issue

For my use case, our web app is hosted on GCP Cloud Run and accessed via Firebase Hosting for improved security and to leverage GCP Cloud CDN caching.

Now what I've discovered is that when the generated image urls are accessed via Firebase Hosting, they are being redirected from /_ipx/https:// to /_ipx/https:/. This results in the following IPX error being returned when loading images: IPX: File not found

Please have the look at this demo https://nuxt-image-2gl6xp7kua-ue.a.run.app that I made to get a better understanding of what is happening here.

example: when the following image is requested ( Firebase Hosting ) https://nuxt-image-firebase.web.app/_ipx/https://storage.googleapis.com/diizzayy.appspot.com/umbrella_1.jpeg?w=1536&f=webp it is being redirected to https://nuxt-image-firebase.web.app/_ipx/https:/storage.googleapis.com/diizzayy.appspot.com/umbrella_1.jpeg?w=1536&f=webp

pi0 commented 3 years ago

Hi, @Diizzayy thanks for details issue and reproduction.

I see the problem. We might need to encode src segment in final URL to avoid double slashes.

In the meantime, you can leverage new alias option that also shortens URLs. (from generated URLs, it seems you also need to update @nuxt/image to latest)

Diizzayy commented 3 years ago

Thank you! using the alias option is definitely a working fix.

also I'm already using the latest version which seems to be @nuxt/image 0.5.0 for now.

nathanchase commented 2 years ago

I see the problem. We might need to encode src segment in final URL to avoid double slashes.

I know you're busy with getting Nuxt 3 launched, but just checking in to see if you or anyone else has been able to solve this issue? Maybe something in this domain normalization code? https://github.com/nuxt/image/blob/f22ae016912470c083c7b565fd67947a8f441093/src/module.ts#L38

agileben commented 2 years ago

This issue also seems to impact IPX attempting to serve notion hosted remote images that have a URL format something like: 

https://www.notion.so/image/https%253A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fcf6741ff----b8d1dc3c88bb%2F----.png%3Ftable=block%26id=---%26cache=v2