菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 陈紫怡-20221208-Node.js3 [打印本页]

---

作者: Dasmondlicht    时间: 2022-12-12 00:27
标题: 陈紫怡-20221208-Node.js3
一、今日学习内容：

• http协议
  
  • 概述
    
    • 协议：就是事先的一种约定、规则、规范、标准
      
    • HTTP协议：超文本传输协议，客户端（浏览器）跟web服务端之间的交互协议。当浏览器与服务器进行数据交换时，html文件、图片、CSS、JS等都是基于HTTP协议进行传输的
      
    • HTTP协议有两个版本：1.0和1.1，目前使用的基本都是1.1
      
  • 特点
    
    • 通常是基于B/S结构软件的
      
    • 无连接：浏览器向服务器发送一次请求，服务器响应一次，链接即结束
      
    • 无状态：无记忆。服务器不能记住哪个浏览器访问过
      
  • HTTP协议主要分为两大部分
    
    • 请求：访问服务器的任何一个文件都是一次请求
      
    • 响应：服务器处理请求，讲解稿返回给浏览器
      
• 请求协议/请求报文
  
  • 请求报文分为3个部分：
    
    • 请求行：请求方式、请求URL地址、协议版本号
      
    • 请求头：主机域名和端口号，客户端（浏览器）的信息
      
    • 请求体:发送给服务器的数据，get和post都会请求主题将数据发送给服务器
      
  • 主要请求项
    
    • host：主机名和端口号，80端口默认不显示
      
    • accept：浏览器可接受的程序/文件类型
      
    • accept-encoding：浏览器可接受的压缩类型
      
    • accept-language：浏览器可接受的语言类型
      
    • connection：keep-alive  持久化连接
      
• 响应协议/响应报文
  
  • 响应报文也分为3部分
    
    • 响应行：协议版本号、响应结果状态码
      
    • 响应头：主要是服务器端的信息
      
    • 响应体：就是服务器返回给客户端的数据
      
  • 主要响应项
    
    • content-type：响应内容类型，content-type:text/html，服务器告诉浏览器，返回的这部分数据是文本类型，使用HTML方式来解析即可
      
    • content-length：相应内容的长度，content-length：336，从服务器返回给浏览器的数据总长度为336字节
      
    • Connection：keep-alive  持久化链接
      
    • Keep-Alive：timeout=5   默认B和S之间的链接时间是5秒，如果5秒钟还没有发起另一次请求，断开链接
      
    • content-length：5   响应体的内容长度为5字节
      
•    常见状态码
  
  • 分类
    
    • 200类状态码：成功状态码，表达请求已经正常处理完毕
      
    • 300类状态码：重定向状态码，需要进行额外操作以完成请求
      
    • 400类状态码：客户端错误状态码，导致服务器无法处理请求
      
    • 500类状态码：服务器错误状态码，服务器原因导致处理请求出错。
      
  • eg：
    
    • 302 redirect|Found ----- 重定向 (页面跳转)
      
    • 304 not modified ----- 未修改
      
    • 403 forbidden ----- 禁止访问 （没有权限访问）
      
    • 404 Not Found ----- 未找到页面
      
    • 500 internal server error ----- 服务器内部错误 (可能是服务器本身有问题，或者代
      
    • 码错的太离谱)
      
• req和res对象
  
  • req（request）：请求对象
    
    • url：保存了浏览器的url地址
      
    • method：请求方式
      
    • headers：请求头信息
      
  • res（response）：响应对象
    
    • setHeader（）：设置响应信息          res.setHeader('content-type','text/html;charset=utf-8')
      
    • writeHeader（）：设置响应头信息和状态码
      
    • write（）：设置响应体
      
    • end（）：将响应头、响应行、响应体一次性返回给浏览器
      
• npm和npm常用命令
  
  • npm
    
    • 概念
      
      • Node包管理器，是一个Node第三方模块（第三方包）管理工具，会随着node一起被安装。使用该工具能够简单的管理项目中所需要的第三方模块
        
      • 官网： www.npmjs.com
        
      • 官网管理了所有第三方包，例如：jquery、art-template等，我们只要使用 npm 命令就能快速下载相关的包
        
• 项目初始化----init
  
  • 使用init 参数可以配置项目的基本信息
    
  • 使用 npm init 后会在当前目录下产生一个 package.json文件，该文件中保存的就是初始化的内容
    
  • 如果使用 npm init -y | --yes 就能快速生成，全部使用默认值。
    
• 安装与卸载
  
  • 安装install
    
  • 卸载uninstall
    
• express框架
  
  • express概念
    
    • express是一个保持最小规模的灵活的基于Node.js的web应用程序开发框架，为web和移动应用程序提供一组强大的功能
      
      • express 是一个能够搭建Web服务器的框架
        
      • express 保留了 http模块 的基本API，也就是说使用 express 时也能使用 req 和res 对象
        
      • express 还额外封装了一些方法，能让我们更方便的搭建服务器
        
      • express 提供了中间件功能，其他很多强大的第三方模块都是基于express开发的
        
    • req.url \ req.method \ req.headers
      
    • res.setHeader \ res.writeHeader \ res.write \ res.end
      
  • 使用express构造web服务器
    
    • 步骤
      
      • 1）加载express模块          const   express = require ('express');
        
      • 2）创建express服务器      const   app = express();
        
      • 3）开启服务器        app.listen(3000,()=>{ })
        
      • 4）监听浏览器请求并进行处理（监听路由）    app.get('/index'  / '*', (req,res)=>{ res.end() /  res.send( ) } )
        
• 路由
  
  • 浏览器中url地址和app.get/app.post方法中参数1的对应关系
    
  • 就是指不同的访问路径，制定不同的处理方法
    
• sendFile
  
  • sendFile方法是express封装的一个方法，能够直接读取文件内容并返回给浏览器
    
  • 路由处理
    
• 开放（托管）静态资源
  
  • 托管css、js、img等文件
    
    • app.use('public',express.static('./public'))；
      
  • 综合案例----显示留言板
    //1. 加载 express 模块
    const express = require('express');//2. 创建服务器
    const app = express();
    //3. 启动服务器
    app.listen(3000, () => {
    console.log('Express-comments-server is
    running');
    })
    //加载其他需要使用到的模块
    const path = require('path');
    //4. 托管静态资源
    // 所有以/public开头的url地址，全都去 ./view/public
    目录下直接读取文件并返回给浏览器
    app.use('/public',
    express.static(path.join(__dirname,'view',
    'public')));
    //监听路由
    //127.0.0.1:3000/index 显示 index.html
    app.get('/index', (req, res) => {
    res.sendFile(path.join(__dirname,'view',
    'index.html'), (err) => {
    if (err) return console.log(err);
    })
    })
    //127.0.0.1:3000/post 显示 post.html
    app.get('/post', (req, res) => {
    res.sendFile(path.join(__dirname,'view',
    'post.html'), (err) => {
              if(err)  return  console.log(err);
    })
    })
    
• express扩展
  
  • Express中使用art-template
    
  • 在Express框架中不能直接使用art-template模板引擎，使用Express-art-template中间件来加载。
    
• get方式提交数据
  
  • 1) 使用 query 接收get数据
    
  • 2) 使用 params 接收get数据
    
• post方式提交数据
  
  • express 中接收 post方式提交的数据需要使用 body-parser 模块
    
  • body-parser 是一个第三方模块，现在已经被 express 集成
    
  • 使用 body-parser 来接收表单数据时，表单数据会直接挂载到 req对象的 body属性下，以对象形式保存
    

---

欢迎光临 菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)

Powered by Discuz! X3.4