nodejs复习笔记

node复习笔记

第一天

前端向后台服务器发送请求的类型
- get: 用来获取数据
- post: 用来提交数据
前端发送请求的方式
- 地址栏中直接输入地址；
- form表单请求：
  - 可以跨域进行提交数据，跨域指的是自己创建的服务器；
  - 缺点：只能提交数据，不能对服务器响应的数据进行处理；
- jQuery中的ajax请求：
  - 能进行跨域提交数据，只能跨域获取百度服务器中的数据；不能获取自己创建的服务器中的数据；
  - 自己服务器中必须设置跨域请求的设置；
- 自己封装的myAjax.js请求：
  - 本质和jQuery中的ajax请求一样；
- jsonp发送请求：通过script标签中src发送get请求，可以进行跨域请求；
服务器获取前端请求的数据
- 获取get请求的数据：get请求的数据在地址栏中
  - 接收get请求的方式有三种：
  - 原生node方法：通过req.url来获取地址字符串，通过split切割多次切割，先通过"?"切割，再通过"&"切割，获取数组，遍历，切割赋值对象；
  - node自带的系统模块querystring和url模块：1）模块querystring；代码：querystring.parse("key=val&key=val")获得一个参数对象；2）模块url；代码url.parse(req.url,true).query获取到一个参数对象；
- 获取post提交的数据：post请求的数据在请求头中，相当于把大块数据拆分成多个小块数据；
  - 原生node方法：字符串拼接
    - 创建空字符串；
    - 通过on绑定两个事件，data和end事件；
    - 在data事件匿名函数中，通过字符串拼接，会执行多次，直到将所有小块数据拼接完整；
    - 在end事件匿名函数中，可以获取str为post提交的数据；只执行一次；
```
 const http=require("http");
 const server=http.createServer(function (req, res) {
     if(req.url==="/favicon.ico"){
         return;
     }
     console.log("server is running");
     res.setHeader("Access-Control-Allow-Origin","http://localhost:63342");
     var str="";
     req.on("data",function (val) {
         str+=val;
     });
     req.on("end",function () {
         console.log(str);
         res.end(str);
     })
 });
 server.listen(8888);
```
  - 第三方模块formidable
    - 下载模块并引入模块；
    - 新建form对象：var form=new formidable.IncomingForm();
    - 解析上传的数据：form.parse(req,function(err,fields,files){})；其中fileds获取的post提交的数据；对象类型；
- get和post请求共存方式
  - 将get请求获取参数的代码，放在post请求的绑定事件end中，因为end只触发一次；
服务器进行的跨域设置
- 原生node：
  - 设置响应头：res.setHeader("Access-Control-Allow-Origin","域名");
- express中的跨域请求
  - cors跨域问题链接;
地址路径解析
- req.url获得的地址为：带斜杠和后面的所有参数，如：/01.html?name=xxx&age=18;
  - 其中pathname为：/01.html，包含斜杠；
  - 其中search为：?name=xxx&age=18，包含问号；不包括哈希值；
知识点
- 在for循环中，存在异步操作时，需要等循环结束来输出数据，可以通过判断i的值，来判断循环是否结束，条件判断时，可以设置i<=ary.length，在循环中判断i===ary.length时，循环结束；因为条件判断为同步，会先于异步操作进行判断，所以不能设置ary.length-1；

第二天

node模块分类
- 分为三大类：
  - 1）node自带的模块：如http,fs,querystring,url,path等；
  - 2）引入第三方模块：nodejs天生自带一个包管理器npm；
  - 3）自定义模块：自己创建的JS文件
    - 通过require引入自定义模块，必须设置相对路径，./也不能省略，后缀.js可以省略；
    - 引入自定义模块后，获取的变量取决于被引入模块输出的变量；
    - 被引入模块通过module.exports={xxx:fn}输出对象变量；
- 三大类的加载顺序：当通过require引入模块后，先在系统自带的模块中查找，查找不到，在第三方模块中查找，即在node_modules文件夹中查找，若再找不到，就通过相对路径在自定义模块中查找；
项目开发步骤：
- 命令行进入文件夹
- git init：文件夹初始化；
- npm init：项目初始化，按照顺序设置，生成package.json文件；
  - 通过npm init --y快速创建文件；
- npm install xxx -g：安装到全局；
- npm i xxx --save-dev: 安装到当前目录下；会在devdependencies中出现，指的是开发过程中的依赖；
- npm i xxx --save：安装到当前目录下，会在dependencies中出现，指的是在上线过程中的依赖；
- npm uninstall xxx：卸载模块；
登录注册功能实例：
- 登录注册页面加载：
  - 通过地址栏发送get请求，设置pathname为html文件名；
  - 服务器中通过系统模块url，获取pathname，然后通过fs.readFile(path,function(err,data){})来读取文件，其中path为html的相对路径，通过res.end(data)来将读取的数据渲染到前端页面中，进而使页面呈现；
- 页面加载后，通过script的src引入的jquery.js文件，会再次发送一次get请求，请求的地址pathname为引入的相对路径，也必须通过fs.readFile读取渲染到页面，页面的jquery.js功能才能使用；

第三天

第三方模块mime：
- 通过npm i mime进行安装
- 用处：页面在加载文件时，如css,html,js等,需要设置Content-Tyep类型；所以可以通过mime.getType(".css")来获取对应的类型，进而设置；
- 给页面设置代码fs.writeHeader(200,{"Content-Type":mime.getType(extname));
- 配合path系统模块使用，获取后缀名；
第三方模块formidable
- 用于在服务器端获取form表单post提交的file文件数据；
- fs.rename(oldPath,newPath,function(err){})：用来将相对路径下的文件名修改为新的路径下的文件名；
第三方模块silly-datetime
- 用于将当前时间转化为具体格式的时间；
- 代码：sd.format(new Date(),"YYYY-MM-DD HH:mm:ss");
知识点：
- fs.readFile(path,callback)中的path里的./public代表的是根目录下的public文件夹，./代表的根目录，与js文件的位置无关；
- form表单通过submit自动提交数据，不涉及跨域的情况，如html文件在63342端口号下打开，而form表单中action设置的域名端口号为8888，提交数据到8888的服务器，不会出错，服务器8888中无需设置跨域请求代码；
- jQuery中的ajax发送请求，若不在同一域名下发送请求，必须在服务器中设置跨域请求代码；否则无法拿到服务器响应的数据；
express框架
- 设置静态资源目录：用于放置静态文件，如css,js等；
  - 代码：app.use(express.static("./static"))；其中./代表的是根目录；相当于app.use("/",express.static("./static"));
- 若请求的pathname为正则表达式；那么可以通过req.params来获取小分组的数据；为对象，属性名从0开始，0对应第一个小分组的数据；
- express自带的正则功能：未定的用:xxx替代，通过req.params.xxx获取；、
  - 若有严格匹配的，执行严格匹配，不执行正则功能匹配；
  - 若想执行非严格匹配，可以在严格匹配中设置next();
ejs模板
- 服务器中必须设置默认模板引擎为ejs;
  - 代码：app.set("view engine","ejs");
- express在使用ejs模板时，可以不引入ejs模块，但必须下载ejs第三方模块；
- 必须将ejs文件放在views文件夹下；

第四天

express创建的服务器中接收请求：
- 接收get请求数据：
  - 代码：req.query;
  - 获取类型为对象；
- 接收post请求数据：
  - 普通数据：body-parser第三方模块；既可以获取表单提交的数据，也可以获取ajax表单提交的数据；
    - 引入模块：const bodyParser=require("body-parser")
    - 设置中间件：
```
 //针对提交类型为:application/x-www-form-urlencoded
 app.use(bodyParser,urlencoded({extended:false})
 //针对提交类型为：application/json；
 app.use(bodyParser,json())
```
    - 通过req.body拿到前端通过post请求提交的数据；
  - 大文件：formidable模块；

express中use设置路由请求：

use请求可以扩充地址；地址不严格；可以用作接盘侠；

格式代码：app.use("/admin",function(req,res){})
req.originalUrl：拿到的是：包括基本地址的所有请求地址；
req.baseUrl:拿到的是：基本地址/admin"，如路由地址相同；
req.path：拿到的是：不包括基本地址，也不包括参数的其余地址；
req.url：拿到的是：不包括基本地址的所有请求地址；
代码：

 app.use("/admin",function (req, res) {
     //地址栏请求地址：http://localhost:8080/admin/aaa/bbb/index.js?name=guo&age=26
     //1.req.url拿到的是/admin后面的地址；
     console.log(req.url);//打印结果：/aaa/bbb/index.js?name=guo&age=26
     //2.req.originalUrl拿到真正的请求地址和传给后台的参数；
     console.log(req.originalUrl);//打印结果：/admin/aaa/bbb/index.js?name=guo&age=26
     //3.req.baseUrl拿到的是基本的地址，与路由地址一致；
     console.log(req.baseUrl);//打印结果：/admin
     //4.req.path拿到的是除了基本地址的其他子子孙孙的路径地址；（不包含基本地址，也不包含参数）
     console.log(req.path);//打印结果：/aaa/bbb/index.js
     res.send("ok");
 });

请求中的回调函数参数
- next:当同一个请求格式满足多个同类型请求时，会按着自上向下执行，当需要执行第二个或下面的请求时，可以在第一个中设置next()，这样就会再执行下面代码；

第五天

相册集实例
- 知识点：
  - 在ejs模板中引入css,js等静态文件时，必须加上斜杠"/"；
  - 在app.js路由设置中，严格的路由必须写在非严格的路由前面；
  - 服务器中可以设置两个静态资源目录；
  - 在router.js文件中所有请求的匿名函数；均要设置next,当err情况下，设置next(),并阻断程序执行；
  - 利用use来充当接盘侠的角色；
- fs系统模块
  - fs.unlink(path,function(err){}):删除指定路径下的文件；不能是文件夹；
- 注意：
  - return：阻断程序执行，不能放在异步操作中，否则不能阻断下面程序的执行，必须放在外面；如果放在异步操作的后面，不会阻止该异步操作；

第六天

cookie
- 作用：将信息存储在浏览器端，在服务器中携带信息传递；
- 没有跨域限制；
- 插件：cookie-parser express;
- 设置：
  - res负责设置存储信息：res.cookie("xxx","xxx",{});
    - maxAge设置存储时间，httpOnly设置是否只允许http协议请求；
    - 设置signed:true，防止篡改；
  - req负责识别存储信息；req.cookies.xxx;
- 删除cookie：res.clearCookie("xxx");
- 查找：在控制台Application中Cookies中查找;
- 密钥四步：secret："密钥"；app.use(cookieParser("密钥"))；signed:true；req.signedCookies;
session
- 优点：
  - 乱码显示，安全性比cookie高；
  - 在浏览器中通过设置一个乱码id，然后在服务器中设置session数据；
- 依赖：
  - 依赖cookie，如果用户在浏览器中禁用cookie后，session存储的数据失效；
  - 依赖express模块
- 使用模块：express-session模块
- 需要设置中间件
- 设置和获取：
  - 设置：req.session.xxx;
  - 获取：req.session.xxx;
  - 删除：delete req.session;
webStorage；分为：localStorage和sessionStorage
- localStorage：本地存储在浏览器中；不能传递给服务器端；
  - 生命周期：只要通过setItem()设置后，在同一个浏览器中，就已经存储上，不会消失，只能通过removeItem()或clear()来删除；注意：同一个浏览器中不同的文件中，都可以拿到存储数据，并对其进行操作；
  - localStorage:是类函数Storage的实例，类的原型上存在多个方法，进行本地存储的操作；
  - 私有属性：length，指绑定key的个数；
  - 方法：setItem(key,value);getItem(key);removeItem(key);clear();key(索引值)
  - 调用方法：window.localStorage.setItem();，其中window可以省略；
- sessionStorage：本地存储在一个会话中，即一个页面中；
  - 生命周期：储存在本窗口中，其他窗口不能获取，关闭窗口后，存储的数据会销毁；
  - sessionStorage:也是类函数Storage的实例，存在私有属性和调用类函数的公共方法；
  - 调用方法：windos.sessionStorage.setItem();;
mongodb数据库知识
- 下载安装mongdb时，连接超时，原因可能是防火墙关闭27017端口，可以短暂关闭防火墙或设置防火墙中允许访问27017端口；
- mongodb与nodejs配合使用时，下载不同版本的mongodb模块，使用不同的方式连接数据库和获取数据库数据信息；
- mongodb新建本地数据库
  - 代码：mongod --storageEngine mmapv1 --dbpath 数据库存储地址;新建一个mmapv1格式的数据库；
  - 开机：mongod --dbpath 数据库存储地址;
- 数据库插入多个数据的shell命令
  - 代码：mongoimport --db 数据库名字 --collection 集合 --drop --file 要导入的json数据的地址
  - 注：导入的json文件数据，每个对象之间不需要连接，报红是正常的；
- 封装mongodb库时的注意点：
  - 查找数据时，可以对数据进行排序和分页，参数格式为：{"sort":{"age":-1},page,pageamount};
  - 获取数据总个数时，通过col.countDocuments(function(err,count){});其中count为number类型，使用res.send(count)会报错，因为send中不能设置数字类型，可以通过toString()方法，转化为字符串；
mongoose知识
- mongoose为mongodb的进化版，相当于原生JS和jQuery的关系；

第七天

登录注册项目
- 知识点：
  - 表单序列化：$("form").serialize();获取表单提交的数据；
  - MVC：models views controllers
留言板项目
- 知识点
  - 删除按钮时，通过获取数据的_id值，来进行删除；
    - 模块：通过mongodb中的模块ObjectID；引入模块const ObjectID=require("mongodb).ObjectID;
    - 查找数据filter：{"_id":ObjectID(id);
    - 删除数据成功后进行重定向跳转页面：res.redirect("/xxx");

第九天

图片裁切功能

软件 GraphicsMagick
- 功能：可以修改图片的类型和裁切大小
- 下载和安装：安装后配置环境变量，在全局下可以使用gm命令；
通过第三方模块gm来对指定文件夹下的图片进行裁切处理，前提是必须下载GraphicsMagick，才能使用gm
- 模块：第三方模块gm
代码：

 var gm=require("gm");
 gm("./img/p1.jpg")
     .crop(550,450,400,5)//裁切图片中的宽、高、左边距、上边距；
     .resize(200, 200, "!")//其中"!"作用为:强制变为200*200的文件；
     .write("./img/meinv2.jpg",function (err) {
         if(err){
             console.log(err);
         }else{
             console.log("ok");
         }
     });

图片裁切实例
- 在网站上扒代码；
- 可以通过设置事件onSelect，在匿名函数中获取参数c，为一个对象，对象中的数据为选中区域在原图片中的宽，高，左边距，上边距等数据；注：是比例变化前的大小位置；
- 必须设置全局变量，才能获得私有作用域中的数据；
- 预留的API接口：
  - getBounds()：获取图片实际尺寸；
  - getWidgetSize()：获取图片显示尺寸；
  - getScaleFactor()：获取图片缩放的比例；
- 网站链接：jQuery Jcrop 图像裁剪;

第十天

论坛项目
- 知识点：
  - session的设置
    - 判断登录与未登录状态；
    - 携带session在路由中间传递数据；
    - session设置的位置：登录成功后，设置session；
    - session的运用：通过判断session是否设置，来显示导航栏中的元素；
    - 设置：
      - login: 布尔值；决定登录和未登录状态，通过if条件判断来显示不同的元素；
      - username: 用户名，用于在数据库中查找数据；和显示用户名；
      - imgsrc：头像的地址；显示该用户名实时的头像地址；
  - 本地数据库中存储数据：数据库：myforums
    - 集合：users
      - 内容：1）用户名；2）密码；3）头像图片名；
    - 集合：contents
      - 内容：1）用户名；2）评论；3）头像图片名；4）发表时间；
  - 设置404页面
    - 只要是通过get请求提交的路由，都要注意，是否需要设置404页面；
    - 404页面可以通过判断req.session.login是否存在，来进行判断，当不存在时，设置next();
    - 通过use来设置接盘侠，渲染404页面；
  - 设置静态资源目录
    - 简易方式：app.use(express.static("/public"))，等同于app.use("/",express.static("./public"))
    - 设置指定路由：app.use("/avater",express.public("./mass"));即想要访问静态资源目录，必须加"/avater"前缀；
- 注意点：
  - 修改头像后，必须更新数据库中两个集合中的头像地址数据；更新成功后，必须更新session中设置的imgsrc;