Adding Image in a Website Using Express - image

Question

I am making a website with nodejs and express, I want to add an image among text from a local src. Much like how if I were using html to mimmick a Wikipedia article I would do this:
<p> Coins are really cool, people use them as a heavy kind of money. Obviously paper money is better though</p>
<img src="uploads/pictureofcoins.png" alt="nicklesAndDimes">
<p> some pictures have coins of important people on them, sometimes just birds though </p>
In Expressjs the process seems to look something like this. First I have an app.js file where I provider a folder directory. Then you set a variable that is the image pointing to the folder directory. I believe you do this by the following.
app.use(express.bodyParser({ keepExtensions: true, uploadDir: __dirname + '/public/uploads/' }));
the my jade file looks almost identical to the html
p Coins are really cool, people use them as a heavy kind of money. Obviously paper money is better though
img(src='localhost:3000/public/uploads/pictureofcoins.png')
p some pictures have coins of important people on them, sometimes just birds though
I know that the pictureofcoins.png image is in the uploads folder. There something coneptual I am not getting, the icon appears as a broken image icon in chrome.

Answer 1

You are using a full url, in that case you need to specify the protocol as well.
So try adding http:// or // to your image source url.
Note that when using a full url make sure you don't hardcode host and port. It is possible to retrieve that information from the http request.
You can also try /public/uploads/pictureofcoins.png as a relative link to make sure it works regardless of host and port.