Search code examples
angularfile-uploadhttp-status-code-404assets

File added to assets folder after ng serve are not served by Angular


I have a file upload control in my Angular project which uploads files to assets/images folder. On the success of file upload, I would like to preview the uploaded file with URL http://localhost:4001/assets/images/filename.jpg. But the URL gives 404 Not Found error even the file exists in assets/images folder.

It seems Angular's assets folder is meant to serve only static files which can be copied on the build. What are all the possibilities to get the dynamic files to display immediately after upload?

I tried to upload files outside the assets folder, but it is not able to serve the file with a relative path.

I would expect the files to be served from Angular App's URL instead of using any CDN services.

Any help/suggestion to use dynamic assets will be highly appreciated.


Solution

  • You should use a backend service to handle file uploads, and avoid uploading files to Assets directory.

    Essentially you should be posting the image to backend over an API call so the backend (whatever the programming language is) can do the saving part for you (and probably return the image path as the result of same API call).