使用node.js作为简单的Web服务器

我想运行一个非常简单的HTTP服务器。 每个对example.com GET请求都应该将index.html提供给它,但是作为一个普通的HTML页面(即与阅读普通网页时的体验相同)。

使用下面的代码,我可以阅读index.html的内容。 如何将index.html作为常规网页提供服务?

var http = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');

http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end(index);
}).listen(9615);

下面的一个建议很复杂,需要我为每个我想使用的资源(CSS,JavaScript,图像)文件写一个get line。

我如何使用一些图像,CSS和JavaScript提供单个HTML页面?


您可以对Node.js使用Connect和ServeStatic来完成此操作:

  • 使用NPM安装连接和静态服务

    $ npm install connect serve-static
    
  • 用这个内容创建server.js文件:

    var connect = require('connect');
    var serveStatic = require('serve-static');
    connect().use(serveStatic(__dirname)).listen(8080, function(){
        console.log('Server running on 8080...');
    });
    
  • 使用Node.js运行

    $ node server.js
    
  • 您现在可以访问http://localhost:8080/yourfile.html


    最简单的Node.js服务器只是:

    $ npm install http-server -g
    

    现在您可以通过以下命令运行服务器:

    $ cd MyApp
    
    $ http-server
    

    如果您使用的是NPM 5.2.0或更高版本,则可以使用http-server而不用npx进行安装。 这不建议用于生产,但是可以快速获取在本地主机上运行的服务器。

    $ npx http-server
    

    或者,您可以尝试此操作,它会打开您的Web浏览器并启用CORS请求:

    $ http-server -o --cors
    

    有关更多选项,请查看GitHub上http-server的文档,或运行:

    $ http-server --help
    

    许多其他不错的功能和对NodeJitsu的大脑死亡简单部署。

    功能叉

    当然,你可以轻松地用自己的叉子来增加功能。 你可能会发现它已经在这个项目的400多个分支之一中完成了:

  • https://github.com/nodeapps/http-server/network
  • Light Server:一种自动刷新的选择

    http-server一个很好的选择是light-server 。 它支持文件观看和自动刷新等诸多功能。

    $ npm install -g light-server 
    $ light-server
    

    在Windows资源管理器中添加到目录上下文菜单

     reg.exe add HKCRDirectoryshellLightServercommand /ve /t REG_EXPAND_SZ /f /d ""C:nodejslight-server.cmd" "-s" "%V""
    

    简单的JSON REST服务器

    如果你需要为一个原型项目创建一个简单的REST服务器,那么json-server可能就是你正在寻找的东西。

    自动刷新编辑

    大多数网页编辑器和IDE工具现在都包含一个Web服务器,它将监视您的源文件并在更改时自动刷新您的网页。

    开源文本编辑器Brackets还包含一个NodeJS静态Web服务器。 只需打开Brackets中的任何HTML文件,按“实时预览”,它就会启动一个静态服务器,并在页面打开浏览器。 无论何时编辑和保存HTML文件,浏览器都会自动刷新。 这在测试自适应网站时尤其有用。 在多个浏览器/窗口大小/设备上打开您的HTML页面。 保存您的HTML页面,并立即查看您的自适应工具是否正在工作,因为它们都会自动刷新。

    PhoneGap开发人员

    如果您正在编写混合移动应用程序,您可能有兴趣知道PhoneGap团队将这一自动刷新概念带入了他们的新PhoneGap应用程序。 这是一个通用的移动应用程序,可以在开发过程中从服务器加载HTML5文件。 这是一个非常漂亮的技巧,因为如果您要更改JS / CSS / HTML文件,现在您可以跳过混合移动应用程序开发周期中的慢编译/部署步骤 - 这是您大部分时间所做的。 他们还提供检测文件更改的静态phonegap serve Web服务器(运行phonegap serve )。

    PhoneGap + Sencha Touch开发者

    我现在已经广泛地为Sencha Touch和jQuery Mobile开发人员调整了PhoneGap静态服务器和PhoneGap开发者应用程序。 在Sencha Touch Live上查看。 支持 - QR二维码和 - 本地通道,将您的静态服务器从您的台式计算机代理到防火墙之外的URL! 吨的使用。 大规模加速混合移动开发。

    Cordova + Ionic框架开发人员

    本地服务器和自动刷新功能被烘焙到ionic工具中。 从您的应用程序文件夹中运行ionic serve 。 甚至更好... ionic serve --lab查看自动刷新iOS和Android的并排视图。


    看看这个要点。 我在此复制以供参考,但其要点已定期更新。

    Node.JS静态文件Web服务器。 把它放在你的路径来启动任何目录中的服务器,并带有一个可选的端口参数。

    var http = require("http"),
        url = require("url"),
        path = require("path"),
        fs = require("fs"),
        port = process.argv[2] || 8888;
    
    http.createServer(function(request, response) {
    
      var uri = url.parse(request.url).pathname
        , filename = path.join(process.cwd(), uri);
    
      fs.exists(filename, function(exists) {
        if(!exists) {
          response.writeHead(404, {"Content-Type": "text/plain"});
          response.write("404 Not Foundn");
          response.end();
          return;
        }
    
        if (fs.statSync(filename).isDirectory()) filename += '/index.html';
    
        fs.readFile(filename, "binary", function(err, file) {
          if(err) {        
            response.writeHead(500, {"Content-Type": "text/plain"});
            response.write(err + "n");
            response.end();
            return;
          }
    
          response.writeHead(200);
          response.write(file, "binary");
          response.end();
        });
      });
    }).listen(parseInt(port, 10));
    
    console.log("Static file server running atn  => http://localhost:" + port + "/nCTRL + C to shutdown");
    

    更新

    要点确实处理css和js文件。 我自己使用它。 在“二进制”模式下使用读/写不成问题。 这仅表示该文件不会被文件库解释为文本,并且与响应中返回的内容类型无关。

    你的代码的问题是你总是返回一个“text / plain”的内容类型。 上面的代码不返回任何内容类型,但如果您只是将它用于HTML,CSS和JS,浏览器可以推断出这些内容。 没有内容类型比错误内容更好。

    通常情况下,内容类型是您的Web服务器的配置。 所以我很抱歉,如果这不能解决你的问题,但它对我来说是一个简单的开发服务器,并认为它可能会帮助其他人。 如果确实需要响应中的正确内容类型,则需要将它们显式定义为joeytwiddle,或者使用Connect等具有合理默认值的库。 关于这一点的好处是它简单且独立(不依赖)。

    但我确实感到你的问题。 所以这里是联合解决方案。

    var http = require("http"),
        url = require("url"),
        path = require("path"),
        fs = require("fs")
        port = process.argv[2] || 8888;
    
    http.createServer(function(request, response) {
    
      var uri = url.parse(request.url).pathname
        , filename = path.join(process.cwd(), uri);
    
      var contentTypesByExtension = {
        '.html': "text/html",
        '.css':  "text/css",
        '.js':   "text/javascript"
      };
    
      fs.exists(filename, function(exists) {
        if(!exists) {
          response.writeHead(404, {"Content-Type": "text/plain"});
          response.write("404 Not Foundn");
          response.end();
          return;
        }
    
        if (fs.statSync(filename).isDirectory()) filename += '/index.html';
    
        fs.readFile(filename, "binary", function(err, file) {
          if(err) {        
            response.writeHead(500, {"Content-Type": "text/plain"});
            response.write(err + "n");
            response.end();
            return;
          }
    
          var headers = {};
          var contentType = contentTypesByExtension[path.extname(filename)];
          if (contentType) headers["Content-Type"] = contentType;
          response.writeHead(200, headers);
          response.write(file, "binary");
          response.end();
        });
      });
    }).listen(parseInt(port, 10));
    
    console.log("Static file server running atn  => http://localhost:" + port + "/nCTRL + C to shutdown");
    
    链接地址: http://www.djcxy.com/p/16995.html

    上一篇: Using node.js as a simple web server

    下一篇: Change CSS rule in class using JQuery