• nodejs简单开发web的demo


    一.nodejs简单编写 http 服务程序

    步骤:
    
        1. 加载http模块
        2. 创建http服务
        3. 为http服务对象添加 request 事件处理程序
        4. 开启http服务监听,准备接收客户端请求
    
    注意:
    
        1. 浏览器显示可能是乱码,所以可以通过 `res.setHeader('Content-Type', 'text/plain; charset=utf-8');`设置浏览器显示时所使用的编码。
        2. Chrome 浏览器默认无法手动设置编码,需要安装"Set Character Encoding"扩展。
        3. 演示一下设置`Content-Type=text/html` 和 `Content-Type=text/plain`的区别。

      demo:

    // 1. 加载http模块
    var http = require('http');
    
    // 2. 创建http服务
    var server = http.createServer();
    
    // 3. 开始监听'request'事件
    // 详细解释一下request对象和response对象
    server.on('request', function (req, res) {
      // body...
      console.log('有人请求了~~');
    });
    
    // 4. 启动服务,开始监听
    server.listen(9000, function () {
      console.log('服务已经启动,请访问: http://localhost:9000');
    });

    二.编写 http 服务程序 - 通过读取静态 HTML 文件来响应用户请求

    步骤:
    
        1. 创建index.html、login.html、register.html、list.html、404.html文件。 
        2. 演示通过读取最简单的 HTML 文件来响应用户。
        3. 演示通过读取"具有引入外部CSS样式表"的HTML文件来响应用户。
        4. 演示通过读取"具有img标签"的HTML文件来响应用户。
    
    注意:
    
    - 1、注意在发送不同类型的文件时,要设置好对应的`Content-Type`
      - Content-Type参考: http://tool.oschina.net/commons
      - Content-Type参考: https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types
    - 2、HTTP状态码参考
      - w3org参考:https://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html
      - w3schools参考: https://www.w3schools.com/tags/ref_httpmessages.asp
    - 3、在html页面中写相对路径'./' 和 绝对路径 '/'的含义 。
      - 网页中的这个路径主要是告诉浏览器向哪个地址发起请求用的
      - './' 表示本次请求从相对于当前页面的请求路径(即服务器返回当前页面时的请求路径)开始
      - '/' 表示请求从根目录开始
    
    补充知识点:
    
        1. path 模块的 join() 方法

      demo:

    // 1. 加载 http 模块
    var http = require('http');
    // 加载文件操作模块
    var fs = require('fs');
    // 加载path模块,这个模块主要用来处理各种路径。
    var path = require('path');
    
    
    
    // 2. 创建http server
    var server = http.createServer(function (req, res) {
      // 1. 获取用户请求的URL
      var url = req.url.toLowerCase();
    
      // 2. 根据用户的不同请求,做出不同响应
      if (url === '/' || url === '/index') {
        // 读取index.html文件,把该文件响应给用户
        fs.readFile(path.join(__dirname, 'index.html'), function (err, data) {
          if (err) {
            throw err;
          }
          res.writeHead(200, 'OK', {
            'Content-Type': 'text/html; charset=utf-8'
          });
          // res.setHeader('Content-Type', 'text/html; charset=utf-8');
          res.end(data);
    
        });
      } else if (url === '/login') {
        // 读取login.html文件,把该文件响应给用户
        fs.readFile(path.join(__dirname, 'login.html'), function (err, data) {
          if (err) {
            throw err;
          }
          res.writeHead(200, 'OK', {
            'Content-Type': 'text/html; charset=utf-8'
          });
          // res.setHeader('Content-Type', 'text/html; charset=utf-8');
          res.end(data);
    
        });
      } else if (url === '/register') {
        // 读取register.html文件,把该文件响应给用户
        fs.readFile(path.join(__dirname, 'register.html'), function (err, data) {
          if (err) {
            throw err;
          }
          res.writeHead(200, 'OK', {
            'Content-Type': 'text/html; charset=utf-8'
          });
          // res.setHeader('Content-Type', 'text/html; charset=utf-8');
          res.end(data);
    
        });
      } else if (url === '/404') {
        // 读取register.html文件,把该文件响应给用户
        fs.readFile(path.join(__dirname, '404.html'), function (err, data) {
          if (err) {
            throw err;
          }
          res.writeHead(200, 'OK', {
            'Content-Type': 'text/html; charset=utf-8'
          });
          // res.setHeader('Content-Type', 'text/html; charset=utf-8');
          res.end(data);
    
        });
      }
      
    });
    
    
    
    // 3. 启动服务
    server.listen(9090, function () {
      // body...
      console.log('please visit: http://localhost:9090');
    });

    三.模拟 Apache 实现静态资源服务器

    步骤:
    
        - 单独创建一个目录来实现,比如:创建一个"07-Apache"的目录。
        - 在该目录下新建 `public` 目录,假设该目录为静态资源目录。
        - 根据用户请求的路径在 public 目录下寻找对应路径下的资源。
        - 如果找到了,那么将该资源返回给用户,如果没找到则返回404错误。
        - 通过 mime 模块设置不同类型资源的Content-Type
        - 实现完毕后把素材中的'An Ocean of Sky' 和 'Hacker News'分别拷贝到静态资源目录下, 测试是否成功
    
    其他:
    
        - 介绍 NPM
        - 介绍 mime 第三方模块
       - `npm install mime`
       - 在代码中直接 `var mime = require('mime')`

      demo:

    // 1. 加载对应模块
    // 1.1 加载http模块
    var http = require('http');
    // 1.2 加载path模块,方便路径拼接
    var path = require('path');
    // 1.3 加载文件读取模块
    var fs = require('fs');
    // 1.4 加载判断文件MIME类型的模块
    var mime = require('mime');
    
    
    // 2. 创建http server
    var server = http.createServer();
    
    
    // 3. 监听用户request事件
    server.on('request', function (req, res) {
      // 1. 获取用户的请求路径, 并转换为小写
      var url = req.url.toLowerCase();
    
      // 判断如果请求的路径是 '/' 那么等价于 '/index.html'
      url = (url === '/') ? '/index.html' : url;
    
      // 2. 根据用户请求的url路径, 去public目录下查找对应的静态资源文件。找到后读取该文件,并将结果返回给用户
      // 2.1 根据用户请求的url拼接本地资源文件的路径
      var filePath = path.join(__dirname, 'public', url);
    
      // 2.2 根据请求的文件路径设置Content-Type
      res.setHeader('Content-Type', mime.lookup(url));
    
      // 2.2 根据路径去读取对应的文件
      // 【注意】读取文件前无需判断文件是否已经存在,而是在读取文件的回调函数中根据error的错误信息来判断读取文件是否成功以及发生的错误
      fs.readFile(filePath, function (err, data) {
        // 判断是否有错误
        if (err) {
    
          if (err.code === 'ENOENT') { // 判断是否是请求的文件是否不存在
    
            res.setHeader('Content-Type', 'text/html; charset=utf8');
            res.statusCode = 404;
            res.statusMessage = 'Not Found';
            res.end('<h1>请求的资源不存在!</h1>');
    
          } else if (err.code === 'EACCES') { // 判断文件是否有访问权限
    
            res.setHeader('Content-Type', 'text/html; charset=utf8');
            res.statusCode = 403;
            res.statusMessage = 'Forbidden';
            res.end('<h1>Permission denied!</h1>');
          } else {
    
            throw err;  
          }
    
        } else {
          
          // 如果没有错误则将读取到的文件返回给用户
          res.statusCode = 200;
          res.statusMessage = 'OK';
          res.end(data);
        }
      })
    });
    
    
    
    // 4. 启动服务
    server.listen(9000, function () {
      // body...
      console.log('server is running, please visit: http://localhost:9000');
    });

    四.Common System Errors - 常见错误号

    - EACCES (Permission denied)
      - An attempt was made to access a file in a way forbidden by its file access permissions.
      - 访问被拒绝
    - EADDRINUSE (Address already in use)
      - An attempt to bind a server (net, http, or https) to a local address failed due to another server on the local system already occupying that address.
      - 地址正在被使用(比如:端口号备占用)
    - EEXIST (File exists)
      - An existing file was the target of an operation that required that the target not exist.
      - 文件已经存在
    - EISDIR (Is a directory)
      - An operation expected a file, but the given pathname was a directory.
      - 给定的路径是目录
    - ENOENT (No such file or directory)
      - Commonly raised by fs operations to indicate that a component of the specified pathname does not exist -- no entity (file or directory) could be found by the given path.
      - 文件 或 目录不存在
    - ENOTDIR (Not a directory)
      - A component of the given pathname existed, but was not a directory as expected. Commonly raised by fs.readdir.
      - 给定的路径不是目录

    五.设置 http 响应报文头实现弹框下载功能

    1. 设置 `Content-Type: application/octet-stream`
    2. 设置 `Content-Disposition: attachment; filename=demo.txt`

       demo:

    var http = require('http');
    
    var server = http.createServer(function (req, res) {
      // body...
      res.writeHead(200, {
        'Content-Type': 'application/octet-stream',
        'Content-Disposition': 'attachment; filename=demo.txt'
      });
    
      res.end('hello node.js');
    });
    
    server.listen(9000, function () {
      // body...
      console.log('server is running...');
    });
  • 相关阅读:
    hadoop2 作业执行过程之reduce过程
    hadoop2 作业执行过程之map过程
    hadoop2 作业执行过程之yarn调度执行
    scala的下划线
    tomcat 配置系列1
    Windows Server 2008 __ Windows Server 2008R2
    dell技术中心
    戴尔服务器启动和raid设置(以dell r420为例)
    WinPE安装windows(dell r420)
    Red Hat enterprise linux 5.4 x64 + DELL R420 安装网卡驱动 (broadcom 5270)
  • 原文地址:https://www.cnblogs.com/tjp40922/p/16120947.html
Copyright © 2020-2023  润新知