how to include external script in html file that is used as response in nodejs server
Question
The title may be very confusing, so I will explain with my code This is my Nodejs server ("server.js") code:
var http = require('http');
var fs = require('fs');
var fserver = function (req, res) {
fs.readFile('hieu.html', function(err, data) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.write(data);
res.end();
});
};
http.createServer(fserver).listen(8080);
And this is my hieu.html file:
<html>
<body>
<script src="check.js">
</script>
<p> a line </p>
<script>
var table = document.createElement("table");
for (var i = 0; i < 10; i++) {
var tr = document.createElement('tr');
for (var j = 0; j < 10; j++) {
var td = document.createElement("BUTTON");
if(i%2 == j%2) td.appendChild(document.createTextNode("B"));
else td.appendChild(document.createTextNode("W"));
tr.appendChild(td);
}
table.appendChild(tr);
}
document.body.appendChild(table);
</script>
<p> hieudzvkl </p>
</body>
</html>
My check.js file is simply a line of code that write number 5 to the document.
If I simply run the hieu.html file, I will get:
Yet, if I run the ("server.js") code, I will get:
As you can see, the script src ="check.js" does not appear in res.
I don't understand why does this happen. Is there any way I can solve this problem? Thanks in advance!
1 answers
solution1
1 ACCPTED 2018-02-12 18:11:58
When you are retrieving the html file from nodeJS, the browser is pointed to a location at a webserver (in this case it appears hosted at port 8080). Any other resources that the html file references will also be fetched from that location, unless they are absolute URLs. So what is happening here is that your browser is trying to fetch check.js from the same location as the html file, in other words, from the webserver. You must update your nodeJS code so that it understands how to serve both the hieu.html file, and also the check.js file.
Consider adding logic similar to the following to your server.js code:
var http = require('http');
var fs = require('fs');
var fserver = function (req, res) {
if (req.url === '/check.js') {
// Insert Code here, such as...
fs.readFile('check.js', function(err, data) {
res.writeHead(200, {'Content-Type': 'text/javascript'});
res.write(data);
res.end();
});
} else {
fs.readFile('hieu.html', function(err, data) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.write(data);
res.end();
});
}
};
http.createServer(fserver).listen(8080);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.