express.static() won't work to fetch images

Question

I am new at programming, sorry if the question is stupid. I could not find anything to help me online.

On Angular, I have the URL of the image to fetch from the server side. If the URL is

http://localhost:3000/h.jpg

and I have

app.use(express.static('backend/adImages'));

everything works fine. If I change the path to

http://localhost:3000/adImages/e.jpg

and the code to

app.use('/adImages', express.static('backend/adImages'));

I cannot visualize the image.

my path is

C:\Users\PupoZz\Desktop\mean\personal\eTrex\backend\adImages

is my path. The server.js file is in the eTrex folder

another thing. If I run the server to show the database. I can click the link and open the image:

_id "5e80643f1bf2d90d685e3e66"
title   "e"
description "e"
location    "e"
postedBy    "null"
image   "http://localhost:3000/adImages/e.jpg"
__v 0

on my inspector I can see

"<img _ngcontent-vlp-c2=\"\" class=\"card-img-top\" src=\"http://localhost:3000/adimages/e.jpg\" style=\"display: none !important;\">"

any idea?

thanks Marco

Answer 1

try this:

const path = require('path');
//
app.use(express.static(path.join(__dirname, 'backend', 'adImages'); 

if the file is in the backend folder, exclude the backend

const path = require('path');
//
app.use(express.static(path.join(__dirname, 'adImages'); 

1)

-server.js
-/backend
---/adImages

2)

-/backend
---server.js
---/adImages

Answer 2

try this:

app.use(express.static('backend'));

And more importantly don't forget to restart your node.js server after the fact.

Happy coding!

Answer 3

thanks to you guys, I checked the right place. It seems that firefox blocked the image because it was in the adimages folder. I just changed the folder name to "images"!