access public folder content publicly
Answered
Southeastern blueberry bee posted this in #help-forum
Southeastern blueberry beeOP
hey
im trying to access specific image from client side. eg: https://mywebsite/myimage.jpg , but i can't except for .svg file anyone know how i allow routing for other extension ?
thank you
im trying to access specific image from client side. eg: https://mywebsite/myimage.jpg , but i can't except for .svg file anyone know how i allow routing for other extension ?
thank you
Answered by Clown
Any file added to the public folder at build time can be accessed publicly. If you are adding stuff on runtime you need to be hosting it somewhere instead like vercel blob or s3 or somewhere
9 Replies
Plott Hound
Remove the /public/ part
In your project “/public/file.jpg” would be /file.jpg on the actual website
I’m not sure why you can only access svg files because everything in the /public folder can be accessed
Southeastern blueberry beeOP
my bad the example i provide is false. Btw this seems to be impossible regarding this https://nextjs.org/docs/app/building-your-application/optimizing/static-assets last part on "good to know" section im selfhosting my app so the vercel blob is not going to fit with me
@Southeastern blueberry bee my bad the example i provide is false. Btw this seems to be impossible regarding this https://nextjs.org/docs/app/building-your-application/optimizing/static-assets last part on "good to know" section im selfhosting my app so the vercel blob is not going to fit with me
Any file added to the public folder at build time can be accessed publicly. If you are adding stuff on runtime you need to be hosting it somewhere instead like vercel blob or s3 or somewhere
Answer
Southeastern blueberry beeOP
it's clearer now thank you
@Barbary Lion that's correct. you upload to
these articles are not always correct and in this case it's just wrong.
/public/uploads/foo.png, then /uploads/foo.png will still 404. you can use fs to read and then serve the file, but you can't access /uploads/foo.png directly.these articles are not always correct and in this case it's just wrong.
@joulev <@1017070761468497950> that's correct. you upload to `/public/uploads/foo.png`, then `/uploads/foo.png` will still 404. you can use `fs` to read and then serve the file, but you can't access `/uploads/foo.png` directly.
these articles are not always correct and in this case it's just wrong.
Barbary Lion
Article by Jack Harrington: https://www.pronextjs.dev/next-js-file-uploads-server-side-solutions Sorry, my bad. There is actually a correct way in article - using fs to read data from public/uploads.
@Barbary Lion Article by Jack Harrington: https://www.pronextjs.dev/next-js-file-uploads-server-side-solutions Sorry, my bad. There is actually a correct way in article - using fs to read data from public/uploads.
it's still not correct because
images is still an array of url sources (/uploads/${file}). they read fs to get the content but to feed to Image they still use the url which doesn't work