Menu
I am working on a Node.js Express project and have used Bootstrap carousal template in index.ejs page. The image tag is not working if I try to get the image saved inside the project under "views" folder.
<img class="img-circle" src= "/proj1.png" />
The index.ejs file is also in "views" folder. The error is: GET http://localhost:3000/proj1.png 404 (Not Found). I have tried changing the relative path of the file also but it did not work.
287
Img src Not Working That means, when a web page loads, the browser has to retrieve the image from a web server and display it on the page. The broken link icon means that the browser could not find the image. If you've just added the image, then check that you included the correct image URL in the source attribute.
Incorrect File Paths When you add images to a site's HTML or CSS file, you must create a path to the location in your directory structure where those files reside. This is code that tells the browser where to look for and fetch the image from. In most cases, this would be inside a folder named images.
Check the src path to fix image not showing Every image in HTML is rendered by using the <img> tag with the image source specified in the src attribute. You can put a relative path or an absolute path to the src attribute depending on where you place the image.
YOu have to serve your static files from express:
try Adding this:
app.use(express.static('public'));
(public is the folder where your images and everything (assets) reside)
More infos here: http://expressjs.com/starter/static-files.html
128
You need to tell express from where should it serve static content.
app.use(express.static('/path/to/your/folder')).
Source: http://expressjs.com/starter/static-files.html
In production, it's a general convention to serve static files using nginx. Look it up.
23
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
