I want have a code that creates a text based on user's given number and i want to different icons/images to this too.
The images are saved in my folder public/images.
I want to not use any client-side javascript, so without document.getElemntyById etc. . I thought if it's possible to pass an image when i render an page:
app.get("..", function(req,res){
res.render("page1",{ image: image} //(or use image url)
and then in my pug:
p MY IMAGE: #{image}
or
img(src="#{imgURL}")
I'm pretty sure second one should work but it doesn't load the image...
So my question how can i achieve the way i just described without client-js? And if its not possible how can i achieve this other way?
btw i have two javascripts, one app.js where i get post/get requests (there i also require my second js) and second one to change number into text and image:
transformNumber.js:
export.modules = {
numberToText: function(number){
var text;
switch(number)
case 2: text = "example";
return text;},
numberToImage: function(number){
var image;
switch(number)
case 1: image = "example image/imageURL";
return image;}
You can send the image as a file
app.get('/myimage', function (req, res) {
return res.sendFile(filepath);
});
Please check the reference: http://expressjs.com/en/api.html#res.sendFile
If you want render a template with image, just pass te image URL via backend and catch it in your frontend:
app.get('/myimage', (req, res) => {
res.status(200).render('page1', {
image: 'your_image_with_path.png'
});
});
And then:
html
head
body
h1 My page with my text
img=(src=image)