What is the best method for handling image upload and preview
For further actions, you may consider blocking this person and/or reporting abuse
Read next
What’s New in React 19? A Quick Guide with Code Examples
Vladyusha -
Random Image Generation and Caching in JavaScript
Bobby Hall Jr -
⛳️ Top 5 AWS Services Every Frontend Should Know 💎🧪
Martins Gouveia -
Cómo empezar con TypeScript usando Vite: Configuración y compilación simplificadas 🎯
Israel Morales -
Top comments (3)
Is this about how to pick a file in the web client or how to handle it with the server? It seems to be the first one, which can be done with the input element of HTML with type file. This elements also allows to handle the onChange event with a function in order to access the file content and then show it on the page by setting the "src" of an "img" element. But this surely is only one option, maybe React provides more.
Tried that. It not working, it's seems the path of the image on my directory is different from that of react
Directory: asset/img/a.png
React: localhost:3000/home/asset/img/a.png
Without seeing your code, it is hard to describe anything helpful.
Please search for code examples and you surely will find something showing you how the input element allows you to show the "file window", which in order would make the picked file usable in the browser by HTML and JS.
Also Mozilla usually has very good documentation for Web Development.
Looking at your paths, I would say that, after picking with the "file window", you should not need to take care of the paths anymore. This is basically done for you by the browser. Next part would be to upload the received content to the server, which can be done with the usual Web Requests, e.g. with the so-called XMLHTTPRequest of JS.
Maybe you can provide code or a Github project, which would be even better.