#Invalid src prop

11 messages ยท Page 1 of 1 (latest)

velvet plinth
#

Hi,

I am facing an issue. I have created some products where I have given the cdn url of the images. Now when i am opening the storefront, getting the runtime error.

Error:
Unhandled Runtime Error

Error: Invalid src prop (https://cdn2.uksoccershop.com/images/re-your-name-10-1712849888.png) on next/image, hostname "cdn2.uksoccershop.com" is not configured under images in your next.config.js
See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host

#

Could you please help me in this?

chilly bone
#

@velvet plinth You should whitelist the host in nextjs config

ocean prism
#

Hi @misty rivet
It's more a Next.js error than a Medusa error
You should follow the docs @chilly bone has shared indeed it should work fine ๐Ÿ™Œ๐Ÿผ

ocean prism
#

Basically, your next.config.<js|ts> file should have a key like this :

images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: 'example.com',
        port: '',
        pathname: '/account123/**',
        search: '',
      },
    ],
  },

But you can also use their matcher system to allow any https images in case the domain/subdomain is not the same

However, I don't know if this is a great practice to allow everything

velvet plinth
ocean prism
#

Can you try to remove the :

  • port
  • pathname
  • search

keys from the last entry in the remotePatterns and also remove the https:// from the hostname

chilly bone
#

This should work:

{
  protocol: 'https',
  hostname: '**.uksoccershop.com',
  port: '',
  search: '',
}
velvet plinth