I'm using Google login, google returns the users information, including the user's image url.I use that url in the , but it shows a broken image icon.Its works fine on localhost, but not when i deploy to vercelAny idea why?

<Image> not showing image on production (vercel)

Unanswered

Stephens Stock posted this in #help-forum

Stephens StockOP

2023-11-19T07:24:00.000Z

I'm using Google login, google returns the users information, including the user's image url.
I use that url in the <Image src={img} ... />, but it shows a broken image icon.
Its works fine on localhost, but not when i deploy to vercel
Any idea why?

4 Replies

Matt

2023-11-19T07:36:27.000Z

I had this happen when the case of the file name was different than what I had typed

Just something to check

Stephens StockOP

2023-11-19T08:23:39.000Z

The filename is dynamic, and it works on localhost, I even printed out the variable to the screen to make sure when i run on production ðŸ™‚
It has something to do with vercel protections...

Stephens StockOP

2023-11-21T15:42:04.000Z

these settings solve the problem locally (I added it to the next.config.js file), but when I deploy to vercel it's not taking effect.

images: {
            domains: ['*.googleusercontent.com'],
            remotePatterns: [
                {
                    hostname: '*.googleusercontent.com'
                },
            ],
        },