模块化

模块化初体验


模块暴露数据



导入模块

fs 写绝对路径 require写相对路径不会受到影响 ./../不能省略
js 和json文件后缀可以省略
如果存在 命名相同的js和json文件,优先导入js文件
导入文件夹时的情况
require导入模块的基本流程




commonJS模块化规范

包管理工具

npm

npm初始化包

init initialization

npm搜索包
下载安装包


require导入npm包的基本流程


开发依赖和生产依赖

局部安装
npm全局安装



全局安装包的位置
装nodemon不成功,显示 无法加载文件,因为在此系统上禁止运行脚本的话,是因为执行策略受限制了
输入Set-ExecutionPolicy RemoteSigned,按y就可以解除限制了
修改windows执行策略

或者


再在集成终端中打开js文件
但第一种方法更好
powershell的权限比cmd高
Path 环境变量

npm安装包的所有依赖

node_modules文件夹不会存入版本库
当clone一个库时,没有node_modules,,此时需要先进行npm i 安装node-modules 即依赖包所存放位置的文件夹
npm安装指定版本的包
删除依赖

npm uninstall 包名 这个也可以啊
npm配置命令别名

cnpm(了解即可,使用npm配置淘宝镜像)

install -g cnpm --registry=http://registry.npmmirror.com
cnpm -v
npm配置淘宝镜像

切换注册地址 切换镜像时很方便
nrm ls
列出所支持的镜像地址
使用 nrm use + 地址名(taobao 或 npm)
taobao镜像只读不可上传 改为npm后可以上传
npm config list 检查配置是否成功
yarn




npm和yarn的选择

npm发布一个包(了解)

npm更新和删除包

包管理工具拓展介绍

nvm介绍与使用

https://github.com/coreybutler/nvm-windows
Releases · coreybutler/nvm-windows · GitHub
https://github.com/coreybutler/nvm-windows/releases
现在我感觉还用不到nvm等用的到的时候在装
主要是现在装要重新装一堆包
改设置
等用其他版本的时候
再装nvm
安装包放在D:nvm
安装的第一个路径询问nvm装在哪
第二个路径问nodejs装在哪
express框架介绍

初体验

路由的介绍




获取请求报文参数


获取路由参数

params是req 请求对象上的的一个属性 用来存储所有 的路由参数,,id 是路由参数中的一个

路由参数练习

用require函数取json文件数据


res.end 内部写一个页面 内容部分使用${result. }

响应设置



send方法调用后会自动地在响应头进行字符集的设置
send 不会出现乱码
express 相应设置可以进行连贯设置

其他响应

中间件介绍

全局中间件实践


路由中间件实践


静态资源中间件


实现静态资源响应, 参数是静态资源文件夹,也就是资源根目录

获取请求体数据

防盗链
防止外部网站盗用本站资源
原理
通过referer请求头判断请求来源

路由模块化

EJS模版引擎

npm i 具有向上寻找的特性,没有必要必须在方包的文件下进行安装,可以在下一级文件内直接进行npm i
初体验 基本逻辑


ejs列表渲染

ejs条件渲染
目标效果


express框架内部写ejs
1.设置模版引擎
2.设置模版文件的存放位置

使用path转为绝对路径
模版文件:具有模版语法内容的文件

路由内的响应render
render('模版文件名','数据')
模版文件后缀为ejs
express-generator


-e 文件夹名
创建出一个ejs框架文件夹
第一步:安装依赖 npm i
app.js文件内

文件上传报文


文件上传也是在发送htp请求报文
express处理文件上传


存放文件名
案例
表单数据的提去

lowdb了解
shortid



mongoDB




下载与安装


命令



数据库操作应用场景
mongoose

上文的mongodb命令行内交互命令
手动键入 极为麻烦
故而存在Mongoose包


使用流程



链接数据库补充说明

插入文档
在open的回调函数中进行



字段类型

字段验证 对文档属性的值进行验证
文档结构对象内书写


删除文档

条件删除

更新文档
{条件}{新的文档内容} 回调函数
更新单条

批量更新

读取文档
读取单条文档信息

根据ID获取文档

批量获取

条件控制



个性化读取


代码模块化
进行拆分
将重复代码放在db。js文件内
内部重复代码放入暴露函数内

抽离出来连接相关的操作
通过暴露函数实现对数据库的连接
模块化 二
结构对象和模型对象的创建是重复的


config文件用来设置db文件mongodb服务中连接数据库路径

图形化管理工具



案例记账本-结合数据库
模型文件
接口

接口的作用:实现前后端通信


restfulAPI

json-server

实例

搭建临时的接口服务
接口测试

启动json - server

Apipost
公共参数
放在同一个文件加下
公共请求头 查询字符串 请求体

文档功能

postman
会话控制

cookie

cookie特点

cookie信息放在请求头当中

流程


浏览器操作cookie


express中设置cookie




express中删除cookie
这个cookie是一个临时对象,普通对象可以写的他基本都可以(设置cookie内容无限制)

express中读取cookie


session


session中间件配置

设置中间件中第二个属性 又称 加盐
session的设置

session的读取

session的销毁

session和cookie的区别

注册流程
179-185
token




jwt


创建token

校验字符串

本地域名


配置HTTPS证书

服务器端完成

前后端开发拓展介绍
