All images fail to load!! 400: BAD_REQUEST

[sivannavis]

Description

My website: https://www.sivan.fun My repo: https://github.com/sivannavis/my-notion-site

Example failure:

1. when opening the website, it looks like this, and all the picture fields are empty:

   

2. When opening one of these images in new window it shows: 400: BAD_REQUEST Code: INVALID_IMAGE_OPTIMIZE_REQUEST ID: iad1::zgbbc-1699886500743-087b6219d339

   

3. The URL of the failed image is https://www.sivan.fun/_next/image?url=https%3A%2F%2Fwww.notion.so%2Fimage%2Fhttps%253A%252F%252Fsoundspaces.org%252Fstatic%252Fimg%252Fsoundspaces%252Fsimulator_demo.gif%3Ftable%3Dblock%26id%3Db77af5dd-bae1-4d6b-83bb-ca8f4f31d339%26cache%3Dv2&w=1200&q=75

4. in my original notion page https://sivand.notion.site/sivand/Sivan-D-9fb4d37f1fe44c6d85e88bc5c521eb4f The same picture has a URL like: https://sivand.notion.site/image/https%3A%2F%2Fsoundspaces.org%2Fstatic%2Fimg%2Fsoundspaces%2Fsimulator_demo.gif?table=block&id=b77af5dd-bae1-4d6b-83bb-ca8f4f31d339&spaceId=b74133af-844e-4972-b144-c12554ed8914&userId=&cache=v2

Notion Test Page ID

9fb4d37f1fe44c6d85e88bc5c521eb4f

Been looking into this issue for like a week and have no idea. Please anybody help me T_T

[sivannavis]

PS. everything works very well locally. And I am not using any Redis. Actually local dev works so well that all the image loading URL are correct: preview_images: { 'images.unsplash.com/photo-1468392788711-903a924761a6': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F271577b5-1eac-4389-8717-202339de785e%2FIMG_8916.jpg': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F3370383d-15c1-4a5d-a4a3-9ffb7a646ec0%2FIMG_7504.png': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F63ee0e1a-c0af-438b-9dc1-f71220b720f7%2FIMG_5360.jpg': [Object], 'notion.so/image/static.arxiv.org%2Ficons%2Ftwitter%2Farxiv-logo-twitter-square.png': [Object], 'notion.so/image/static.arxiv.org%2Fstatic%2Fbrowse%2F0.3.4%2Fimages%2Ficons%2Ffavicon.ico': null, 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fd7150b99-74dd-4579-80e8-a3567e495b3f%2FXnip2022-11-26_16-54-12.jpg': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F7e38dbb0-b104-4bb9-9b59-4b459413a706%2FXnip2022-11-26_16-36-04.jpg': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F0a0dffa8-e05a-4904-9bd9-8558f2b0ac08%2FXnip2022-11-26_16-35-33.jpg': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fb2871b32-56a0-4047-b466-8b3d7629c3b9%2Fviz3.jpg': [Object], 'notion.so/image/soundspaces.org%2Fstatic%2Fimg%2Fsoundspaces%2Fsimulator_demo.gif': [Object], 'notion.so/image/mccormickml.com%2Fassets%2Fword2vec%2Fskip_gram_net_arch.png': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F3b5b134a-366c-4e79-9ed9-79220f049eec%2FXnip2022-11-26_16-16-43.jpg': [Object], 'notion.so/image/github.com%2Fopenai%2Fwhisper%2Fraw%2Fmain%2Fapproach.png': [Object], 'notion.so/image/s3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fffd4f382-0834-49b3-8743-6756fc196df3%2FUntitled.png': [Object] } } }

[sivannavis]

Update: I added "www.notion.so" in next.config.js. And the problem is partially solved in the way that: It's still not showing images when loading the page for the first time, but everything works fine after you try to toggle darkmode once.

And considering everything works fine locally, I'm suspecting if the problem is with dark mode and I'm trying to disable it...

[sivannavis]

Update again: solved by adding "sivand.notion.site" (my site name) to domains. And adding my-notion-site-navissivan.vercel.app to vercel domain redirection. Now it works on ios chrome, but still not on my mac chrome... I'll consider it solved.