Hey everyone, I’m working on an NFT marketplace using Thirdweb. I’ve run into a weird issue. The NFT images show up fine when I run the site locally, but they’re not appearing when I deploy it on Netlify. Any ideas what might be causing this?
I’m kinda stumped here. If anyone has dealt with something similar or has any suggestions, I’d really appreciate the help. I’m pretty good at figuring things out once I have a direction to go in.
Let me know if you need any specific code snippets. I can post them if it helps. I’ll keep an eye on this thread and respond quickly. Thanks in advance for any help!
yo ethan, had similar probs b4. check ur CORS settings on netlify. sometimes they block image loading from external sources. also, double-check ur build settings. netlify might not be copying image files correctly. if nothin works, try deploying on vercel. it’s usually more forgiving with this stuff.
hey ethan, that sounds like a real head-scratcher! i’ve run into similar issues before with image loading on deployed sites. have you checked if the image urls are correct in the deployed version? sometimes the paths can get messed up when deploying.
also, are you using any environment variables for api keys or endpoints? those might not be set up correctly on netlify.
oh, and another thing to look at - are you using relative or absolute paths for the images? that can sometimes cause issues when deploying.
what does the network tab in your browser’s dev tools show when you try to load the images on the deployed site? any errors there?
let us know what you find out! i’m really curious to see what’s causing this. good luck with troubleshooting!
I encountered a similar issue when deploying an NFT marketplace. Have you verified your Thirdweb API key is correctly set in Netlify’s environment variables? This is often overlooked and can cause image loading failures in production.
Another potential cause could be IPFS gateway issues. If you’re using IPFS for storing NFT metadata, ensure you’re using a reliable gateway that’s accessible from your deployed site.
Lastly, check your Content Security Policy headers if you’ve implemented any. Overly restrictive CSP settings can sometimes block image loading from external sources.
If these don’t resolve the issue, I’d recommend reviewing your Netlify deploy logs for any warnings or errors related to asset handling during the build process.
i’ve run into similar issues before with image loading on deployed sites. have you checked if the image urls are correct in the deployed version? sometimes the paths can get messed up when deploying.