一、今日学习内容:
- http协议
- 概述
- HTTP协议:超文本传输协议,客户端(浏览器)跟web服务端之间的交互协议。当浏览器与服务器进行数据交换时,html文件、图片、CSS、JS等都是基于HTTP协议进行传输的
- HTTP协议有两个版本:1.0和1.1,目前使用的基本都是1.1
- 特点
- 无连接:浏览器向服务器发送一次请求,服务器响应一次,链接即结束
- 请求协议/请求报文
- 请求报文分为3个部分:
- 请求体:发送给服务器的数据,get和post都会请求主题将数据发送给服务器
- 主要请求项
- accept-encoding:浏览器可接受的压缩类型
- accept-language:浏览器可接受的语言类型
- connection:keep-alive 持久化连接
- 响应协议/响应报文
- 主要响应项
- 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对象
- res(response):响应对象
- setHeader():设置响应信息 res.setHeader('content-type','text/html;charset=utf-8')
- writeHeader():设置响应头信息和状态码
- end():将响应头、响应行、响应体一次性返回给浏览器
- npm和npm常用命令
- npm
- 概念
- Node包管理器,是一个Node第三方模块(第三方包)管理工具,会随着node一起被安装。使用该工具能够简单的管理项目中所需要的第三方模块
- 官网管理了所有第三方包,例如:jquery、art-template等,我们只要使用 npm 命令就能快速下载相关的包
- 项目初始化----init
- 使用 npm init 后会在当前目录下产生一个 package.json文件,该文件中保存的就是初始化的内容
- 如果使用 npm init -y | --yes 就能快速生成,全部使用默认值。
- 安装与卸载
- express框架
- express概念
- express是一个保持最小规模的灵活的基于Node.js的web应用程序开发框架,为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中间件来加载。
- get方式提交数据
- post方式提交数据
- express 中接收 post方式提交的数据需要使用 body-parser 模块
- body-parser 是一个第三方模块,现在已经被 express 集成
- 使用 body-parser 来接收表单数据时,表单数据会直接挂载到 req对象的 body属性下,以对象形式保存
|