Uploadthing Image not showing up

I feel like I'm making some dumb mistake but hoping someone else will see the error in my ways 😅. I'm implementing uploadthing and have the upload portion of it working. After the upload I'm pushing the response into an array of images and mapping over them, with an <img> for each of them. For some reason the image is erroring out and not displaying. I have added utfs.io to the remotePatterns in my next.config, so not sure what else could be causing this since when I click on the URL that's assigned to the <img> in the DOM, it does take me the uploaded image.
No description
Solution:
Ah ok, I had skipPolling={true} for my UploadDropzone, I didn't fundamentally understand what that was doing (I just thought, "oooh, this make app go brrrr"), once it was set to false everything is working as intended
Jump to solution
2 Replies
Ben
BenOP•7mo ago
This is what I have for the remotePattern:
{
protocol: "https",
hostname: "utfs.io",
}
{
protocol: "https",
hostname: "utfs.io",
}
When trying to use an Image component the following error throws in the console: GET http://localhost:3000/_next/image?url=https%3A%2F%2Futfs.io%2Ff%2F6ab341bc-ff0c-4df4-bcd0-e509d9c790d2-qqfixy.png&w=256&q=75 400 (Bad Request) So if I make a change in my code after uploading an image, i.e. triggering a dom update is my guess on what's happening, the image actually shows up. Don't understand what's happening under the hood though
Solution
Ben
Ben•7mo ago
Ah ok, I had skipPolling={true} for my UploadDropzone, I didn't fundamentally understand what that was doing (I just thought, "oooh, this make app go brrrr"), once it was set to false everything is working as intended
Want results from more Discord servers?
Add your server