Node.js服务器和.html文件

node.js server and .html file

本文关键字:html 文件 服务器 js Node      更新时间:2023-09-26

我两天前开始使用node.js。我用node.js做了我的http服务器,我有一个页面,我在几个月前做了一些测试目的,但是当我在我的电脑上托管我的页面时,它可以工作,但没有javascript文件,这些文件包含在html页面中,如jQuery和一些图形库。

我试图用IE调试器调试它,但我无法解决这个问题。

有趣的是,当我打开同一页从我的磁盘,只是双击.html文件,它运行良好,没有任何错误!

我的问题是我应该怎么做才能工作?我错过了node.js的一些东西吗?

我有一个html5 canvas元素在页面上,也许这是一个问题

这是我的index.html

<html xmlns="http://www.w3.org/1999/xhtml">

 <head>
 <title>Hello Dialog</title>
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta http-equiv="Cache-Control" content="no-store">
<meta http-equiv="cache-control" content="max-age=0">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT">
<meta http-equiv="pragma" content="no-cache">

<link href="css/ui-lightness/jquery-ui-1.9.2.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="RGraph.line.js"></script>
<script type="text/javascript" src="RGraph.common.core.js"></script>
<script type="text/javascript" src="RGraph.drawing.background.js"></script>

<script type="text/javascript" src="./js/jquery-1.8.3.js"></script>

<script type="text/javascript" src="./js/jquery-ui-1.9.2.custom.min.js">        </script>

<script type="text/javascript" src="index.js"></script>
<script type="text/javascript" src="temperature(1).json"></script>
 </head>
 <body style="font-size: 10px;">
 <button id="btn_hello">Say Hello</button>
 <button id="btn_hello1">LUKA</button>
 <button id="btn_hello2">ANJA</button>
 <button id="btn_hello3">MARKO</button>
 <div id="dlg_hello">Hello World!</div>
 <canvas id="graph" width="600" height="500"></canvas>
<script>
var data = [];
var limit;
var Temp = [];
var TimeStamp = [];
function readTextFile(file, callback) {
    var rawFile = new XMLHttpRequest();
    rawFile.overrideMimeType("application/json");
    rawFile.open("GET", file, true);
    rawFile.onreadystatechange = function() {
        if (rawFile.readyState === 4 && rawFile.status == "200") {
            callback(rawFile.responseText);
        }
    }
    rawFile.send(null);
}


readTextFile("temperature(1).json", function(text){
     data = JSON.parse(text);
    for(var i =0; i<Object.keys(data).length; i++)
    {       
        //alert(parseFloat(data[i].TimeStamp));
        TimeStamp[i] = data[i].TimeStamp;
        Temp[i] = parseFloat(data[i].Value);
    }
    DrawGraph(Temp, TimeStamp);
});
function DrawGraph(data, timestamp)
{
  var line = new RGraph.Line({
        id: 'graph',
        data: data,
        options: {
            labels: timestamp,
            gutterLeft: 55,
            gutterRight: 35,
            gutterBottom: 35,
            gutterTop: 35,
            title: 'A basic line chart',
            backgroundGridColor: '#aaa',
            backgroundGridDashed: true,
            textAccessible: true,
            scaleZerostart: true,
            labelsOffsety: 5
        }
    }).draw();
}
</script>
 </body>
</html>

node.js中的server.js

var http = require("http");
var fs = require("fs");
var windows1250 = require("windows-1250");
var ht = fs.readFileSync('./index.html',"utf-8");
http.createServer(function (req, res) {
        res.writeHead(200, {'Content-Type': 'text/html','Content-Length':ht.length});
        res.write(ht);
        res.end();
        console.log(req.url);

    }).listen(8888, function () {console.log("server is listening on port 8888");});

服务器不知道在哪里找到你的javascript文件。你可能想研究一下使用express.js。这提供了使用express的功能。静态命令。

您没有托管文件。服务器不知道在哪里寻找JavaScript文件,所以它只是不包含它们。

考虑使用serve-static或更好的解决方案,以普通HTTP服务器,express
这里还有一个类似的答案

我记得在nodejs中,你可以这样读html:

var fs = require('fs');
fs.readFile('/path/html', 'utf8', function (err, data) {
  if (err) {
    console.log(err);
  } else {
    res.send(data);
  }
});

如果需要更好的文件位置路径,可以使用

var path = require('path');
path.join(__dirname, '/path/html');

那么它将像这样:

var fs = require('fs');
var path = require('path');
var file = path.join(__dirname, '/path/html');
fs.readFile(file, 'utf8', function (err, data) {
  if (err) {
    console.log(err);
  } else {
    res.send(data);
  }
});