How to display a variable in html generated with node.js

Question

For training purposes, I am trying to display a portion of the pathname in my html page.

For instance, if URL is like : http://localhost:8080/firstname/abcd
I expect my browser to display: "Hello abcd"

const config = require('./config');
var http = require('http');
var url = require('url'); 

var server = http.createServer(function(req, res) {

var path = url.parse(req.url).pathname;

    if(path.includes('firstname'))
    {
        firstname = path.replace('/firstname/', '');

        res.writeHead(200, {"Content-Type": "text/html"});
        res.write('<!DOCTYPE html>'+
            '<html>'+
            '    <head>'+
            '        <meta charset="utf-8" />'+
            '        <title>Node.js tests</title>'+
            '    </head>'+ 
            '    <body>'+
            '       <p id = "name"></p>'+
            '    </body>'+
            '<script type="text/javascript">
            'document.getElementsById("name").innerHTML = ("Hello " + firstname)'+
            '</script>'+
            '</html>');
        res.end();
    }
    else
    {
        console.log('Nothing to display');
    }
});
server.listen(config.env.port);

As you can guess, the page appears empty.

Possible duplicate of Passing a variable from node.js to html — Samiul Alam
– Samiul Alam, Commented Apr 25, 2019 at 11:46
"document.getElementsById" this is wrong it should be "document.getElementById", that is 's' should not be there. — uday214125
– uday214125, Commented Apr 25, 2019 at 11:53
You're right uday214125. I've been testing with getElementsByTagName before this is why. But weird, ElementsById seems to be working too. Anyway, I'll fix this too, thank you. — Titetili
– Titetili, Commented Apr 25, 2019 at 12:07

Nuhman · Accepted Answer · 2019-04-25 11:47:41Z

If you want to just display the path except the firstname part, then:

var server = http.createServer(function(req, res) {

var path = url.parse(req.url).pathname;

    if(path.includes('firstname'))
    {
        let firstname = path.replace('/firstname/', '');
        res.writeHead(200, {"Content-Type": "text/html"});
        res.write('<!DOCTYPE html>'+
        '<html>'+
        '    <head>'+
        '        <meta charset="utf-8" />'+
        '        <title>Node.js tests</title>'+
        '    </head>'+ 
        '    <body>'+
        '       <p id = "name">'+
              'hello ' + firstname +
              '</p>'+
        '    </body>'+            
        '</html>');
    }
    else
    {        
        res.write('Nothing to display');
    }
    res.end();
});
server.listen(config.env.port);

Going to http://localhost:8080/firstname/abcd gives Hello abcd

pesehr · Accepted Answer · 2019-04-25 11:41:33Z

0

Why do you want to use js code in HTML?

You can render a static HTML page and send it as a response. Like this:

...
        res.write('<!DOCTYPE html>'+
            '<html>'+
            '    <head>'+
            '        <meta charset="utf-8" />'+
            '        <title>Node.js tests</title>'+
            '    </head>'+ 
            '    <body>'+
            `       <p id = "name">Hello ${firstname}</p>`+
            '    </body>'+
            '</html>');
...

answered Apr 25, 2019 at 11:41

pesehr

1,0682 gold badges12 silver badges25 bronze badges

1 Comment

Titetili Over a year ago

Thank you pesehr! But it displays Hello ${firstname} on the page :(

Collectives™ on Stack Overflow

How to display a variable in html generated with node.js

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related