Images stores on appwrite wont load

Help
1

Images stored in an appwrite bucket wont load when using vercels image optimization. I would like for the images to load. Everything works fine without vercels image optimization and on local host.

In my astroJS config I have:

export default defineConfig({

   ...

  adapter: vercel({
    imageService: true,
  }),

  image: {
    domains: ['https://cloud.appwrite.io'],
  },
})

For every image I have a component that makes a url and displays an image with that url:
const imageUrl = https://cloud.appwrite.io/v1/storage/buckets/${import.meta.env.NEWS_IMAGES_ID}/files/${news.imageId}/view?project=${import.meta.env.PUBLIC_APPWRITE_PROJECT}

When I add Vercel’s image optimization the image ur changes:

from: src="https://cloud.appwrite.io/v1/storage/buckets/;kjssdjfgsjdfgdf/files/kjsdfhjfdghfj/view?project=kjdshfsjfgjgf"

to: src="/_vercel/image?url=https%3A%2F%2Fcloud.appwrite.io%2Fv1%2Fstorage%2Fbuckets%jdsfghdsg%2Ffiles%sdkfgfdshfdfjff%2Fview%3Fproject%3D67bsdkjfhlkdjfj1df325c7ce&w=3840&q=100"

Using astroJS

2

Switched to a regular HTML from astroJS component fixes it. Not sure why that breaks it though

3

Fixed by removing https:// from the domains :frowning:

This fixed it:

  image: {
    domains: ['cloud.appwrite.io'],
  }
4

Glad that you got this working. Thanks for sharing your solution, @grahf0085.

5

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.