全栈阶段知识点自我总结与梳理

一.node.js

1.什么是node.js

node 是一个运行在v8引擎之上的 JavaScript 运行时的环境
node.js不是一个js的框架 也不是一个js库
node.js是一个专门来跑js代码的环境

2.node的特点

node.js的开发是模块化开发的思想
具有一些相同功能的代码 集成为一个模块
模块主要是由 node系统自带的模块 第三方模块
大部分第三方模块都是由npm来管理 ==>npm是一个集成了当前世界上最多开源库的生态系统

3.node的使用

在某个文件夹下路径上输入cmd,就会在当前的路径下运行cmd.exe
node xxx.js文件 用node去运行js文件
导出与引用
引入模块：你使用的所有模块必须引入require
导出模块：module.exports

const fs = require('fs');
console.log(1);
try {
    let mkdirR = fs.mkdirSync('./html',{recursive: true});
    console.log('mkdirR=====',mkdirR);
} catch (error) {
    console.log(error);
}
console.log(2);

let copyR = fs.copyFileSync('01-复习.html', './html/复习.html');
console.log('copyR==========',copyR);

这个跟浏览器环境下的node的导入和引入还是有点区别需要注意一下。

二.node.js的path模块

1.fs模块

Node.js 的 fs 模块是文件系统模块，用于处理文件和目录的读取、写入、删除、修改等操作。它提供了丰富的方法和功能，使得在 Node.js 中进行文件操作变得非常方便。

使用之前需要引入

let fs = require('fs');

以下是一些常用的 fs 模块的方法和功能：
1.读取文件：
fs.readFile(path, options, callback)：异步读取文件内容。可以指定文件路径、读取选项和回调函数。
fs.readFileSync(path, options)：同步读取文件内容。返回文件的内容。
2.写入文件：
fs.writeFile(file, data, options, callback)：异步写入文件内容。
fs.writeFileSync(file, data, options)：同步写入文件内容。
3.创建文件：
fs.mkdir(path[, options], callback)
path：要创建的目录的路径。
options：一个可选的对象，用于指定目录的权限和其他选项。
callback：一个回调函数，在目录创建完成后被调用，接受一个可能的错误参数。

fs模块还有很多的功能，目前先就这样

2.path模块

Node.js 的 path 模块是一个内置的模块，用于处理文件路径相关的操作。它提供了一组方法来处理路径字符串，包括路径拼接、规范化、解析等。
要使用 path 模块，首先需要在脚本文件中引入它。

const path = require('path');

path.basename(path[, ext])：返回路径中的文件名部分，可以选择性地指定扩展名，如果指定了扩展名，返回的文件名将去掉该扩展名。

const filePath = '/my-folder/file.txt';
const basename = path.basename(filePath);
console.log(basename);  // 输出：file.txt

const basenameWithoutExt = path.basename(filePath, '.txt');
console.log(basenameWithoutExt);  // 输出：file

path.dirname(path)：返回路径中的目录部分。

const filePath = '/my-folder/file.txt';
const dirname = path.dirname(filePath);
console.log(dirname);  // 输出：/my-folder

3.http模块

Node.js 的 http 模块是一个内置模块，提供了创建基于 HTTP 协议的服务器和客户端的能力。
要使用 http 模块，首先需要在脚本文件中引入它：

const http = require('http');

http.createServer([options][, requestListener])：创建一个 HTTP 服务器。requestListener 是一个回调函数，它会在每次接收到请求时被调用。

const http = require('http');
// 创建服务器
let server = http.createServer();
// 监听客户端请求 request  responese
server.on('request',(req,res)=>{
    // 给客户端响应内容
    res.end('hello123');
})
// 设置监听端口号 0-65535
// server.listen(8000);
server.listen(8000,()=>{
    console.log("服务器启动成功----8000");
});

4.服务器与mysql建立连接

在npm文档中搜索mysql。
然后根据步骤操作即可

三.AJAX

在 JavaScript 中，Ajax（Asynchronous JavaScript and XML）是一种通过在后台与服务器进行异步通信的技术，可以在不刷新整个页面的情况下更新页面的一部分。
主要是为了在浏览器环境下向服务器发起请求。

get请求。

var xhr=new XMLHttpRequest()||new ActiveXObject("Micsoft.XMLHTTP")
			
			//1.建立连接
			xhr.open("GET", "http://localhost:81/hqyj")
			//2.发送网络请求
			xhr.send()
			//3.监听网络状态的变化
			//readyState==>0  1 2 3 4
			xhr.onreadystatechange = function() {
				console.log(xhr.readyState)
				//当网络状态为4的时候,代表数据包已经发送过来了
				//状态码为200代表是这个接口原来制定的接口数据格式
				if (xhr.readyState == 4&&xhr.status==200) {
					//解析数据
					console.log(JSON.parse(xhr.responseText))
					var data=JSON.parse(xhr.responseText)
					
					//把数据放入模型并写入UI界面面
					var name1=document.createElement("h1")
					name1.innerHTML=data.name
					document.body.appendChild(name1)
					
					var age1=document.createElement("p")
					age1.innerHTML=data.age
					document.body.appendChild(age1)
                    }
				else if(xhr.readyState == 4&&xhr.status==404){
					var data=JSON.parse(xhr.responseText)
					console.log(data)
				}
            }

post请求

 // 创建xhr实列化对象
      let xhr = new XMLHttpRequest();
      // 和服务器建立连接
      xhr.open('post', 'http://192.168.2.197:8888/loginsubmit');
      // 设置请求头  post请求需要设置请求头，不然后端接收不到数据
      xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
      // 设置响应数据类型
      xhr.responseType = 'json';
      // 向服务器发送数据
      xhr.send(`account=${account.value}&pwd=${pwd.value}`);
      // 监听请求状态
      xhr.onreadystatechange = function () {
        // console.log(xhr.readyState);
        if (xhr.readyState == 4) {//请求完成
          if (xhr.status == 200) {//请求成功
            console.log(xhr.response);//服务器响应的数据
          }
        }
      }

post请求相较于get请求
1.由于 GET 请求的数据会暴露在 URL 中，因此敏感信息（如密码）不应该使用 GET 请求发送。而 POST 请求的数据放在请求体中，相对来说更加安全。
2.GET 请求的长度受限于 URL 的长度限制，不同浏览器和服务器对 URL 的长度限制可能不同。而 POST 请求的长度通常没有限制，可以发送更大量的数据。
总的来说，GET 请求适用于获取数据，请求参数较少且不敏感的情况下，而 POST 请求适用于提交数据、请求参数较多或敏感的情况下。

四.使用egg来搭建服务器

这个直接跟egg网站的教程走，还有mysql的连接也跟文档走。这算基础的环境搭建了，搭建后才可以开始搞操作。
我们需要主要几个比较重要的文件和一些配置的操作。

1.public文件

Egg内置的static插件默认把访问路径/public/* 映射到 app/public/*目录，我们只需要把html、css、js、图片、多媒体等静态资源放到app/public/目录即可；

2.内置对象

1. Application：全局应用对象，在一个应用中，只会实例化一个对象；
   在继承于 Controller, Service 基类的实例中，可以通过 this.app 访问到 Application 对象。
2. Request & Response：可以在 Context 的实例上获取到当前请求的 Request(ctx.request) 和 Response(ctx.response) 实例；
3. Controller：推荐所有的 Controller 都继承于该基类实现。该基类属性有：
   ctx - 当前请求的 Context 实例。
   app - 应用的 Application 实例。
   service - 应用所有的 service。
4. Service：推荐所有的Service都继承该基类。
   Service基类属性和 Controller 基类属性一致。

3.路由Router

路由是描述请求URL和具体承担执行动作的Controller的对应。说的直白点，就是用户访问不同的路径时应该有不同的Controller去响应不同的内容。

  router.get('/getdata', controller.form.get);
  router.post('/pdata', controller.form.post);
  router.get('/user/:userid', controller.user.info);

4.控制器Controller

1. 控制器的定义以及和路由的关联
   Controller负责解析用户的输入，处理后返回响应的结果。所有的Controller 文件都必须放在 app/controller目录下，支持多级目录，访问时可以通过目录名级联访问。

5.获取提交的数据

接收GET请求的数据：ctx.request.query 和 ctx.query；
接收POST请求的数据：ctx.request.body，而不是 ctx.body；post请求时，会有安全验证问题，简单的处理方式是关闭安全验证

6.获取上传的文件

你要先在 config 文件中启用 file 模式

// config/config.default.js
	exports.multipart = {
  		mode: 'file',
	};