不熟悉
面向对象不懂?
后端渲染可以不用发ajax请求,直接请求数据
所学知识点
- Node.js的框架 express
- 使用express构建静态服务器【后端渲染】
- 使用express构建api服务器【接口】
- 前端通信【socket】
- Node中完成通信功能
- 扩展:H5的webSocket 实现通信功能
1.express通用生成器【脚手架】
- 作用:可以帮助我们快速构建一个express项目
- 脚手架的安装
- 全局安装[ 可以使用npm、cnpm]
$ cnpm i express-generator -g
- npx安装
- npx是npm的一个管理工具,它可以让我们不全局安装就使用某一个包
- npx好处就是可以帮助我们减少使用内存
- 但是npx要求npm的版本在5.2以上
- npx是npm会自动携带
- 全局安装[ 可以使用npm、cnpm]
- 脚手架的使用
- 全局安装的使用
- express -e 项目名称
- npx的使用
- npx express -e 项目名称
- 全局安装的使用
- 认识项目目录结构
- 1.先找package.json[记录了项目的依赖包信息,npm脚本]
- 2.找到了项目启动文件 bin/www
- 它是通过http来做了一个服务器,默认端口是:3000
- 这个文件中引入了一个app文件,这个文件是将createServer中的回调函数放到了外面,以模块化的形式使用的,这个文件我们叫它:‘入口文件’
- 3.看:app.js
- express是由路由和中间件构成的
- 路由:可以完成页面的连接或是接口的打造
- 中间件:中间件是一个函数,一个具有特定功能的函数
- 中间件有三个类型
- 1.应用级中间件
- 2.路由中间件
- 3.错误处理中间件
- 中间件的参数
- req:全称 request 表示请求
- res:全称:response 表示响应
- next:表示request和response之间的连接,相当于桥梁的作用
- next如果断开,那么请求和响应就会中断 next(false)
- 中间件要想调用,必须通过app的use方法来调用
- 中间件有三个类型
- express是由路由和中间件构成的
- 4.路由中间件
- 路由中间件人家是以模块化的形式使用
- 看: routes/xx.js
- 有两个路径,这两个路径会拼接在一起
- 举例: /home /banner /home/banner
- 为什么res.render(‘index’)
- 配置了模板的路径
- 配置了后缀名省略
- 有两个路径,这两个路径会拼接在一起
- 5.看: view/xxx.ejs
- ejs语法
- ejs文件中可以直接在模板语法中使用数据
- 6.手动打造一个express的使用流程
const express = require('express'); const router = express.Router(); //打造渲染页面,记住,渲染页面到前端只用get router.get('/',function(req,res,next){ res.render('home',{ data:'这里是千锋1906' }) }) module.export = router
- 7.ejs语法学习
- 注意: ejs语法符号是不能换行的
- 非转义输出 <%- %> 可以解析xml类型数据
- 转义输出 <%= %> 可以解析普通类型数据
- 流程控制 <% %>
- if条件语句
- 循环语句
通过express来打造api服务器【后端接口】
- 步骤
- 通过脚手架搭建项目
npx express -e 2_api_server
- 创建接口
- 接口就是路由
- 接口的打造需要遵循一个规则:restful api
- 接口测试
- 1.使用测试工具来测试
- postman
- insomina[ 安装无要求,一路next ]
- 2.前端进行接口数据请求
- Front End 前端 FE
- Back End 后端 BE
- 前端:http://127.0.0.1:5500/day03/express/front_end/index.html
- 后端:http://localhost:3000/position
- 跨域问题解决【后端做】:
- 设置请求头【php java node】
- 使用中间件 cors[第三方模块]
- 总结:跨越
- 前端跨域【前端做】
- jsonp
- 反向代理
- 后端跨域
- 设置请求头
- cors中间件跨越
- 前端跨域【前端做】
- 1.使用测试工具来测试
- 反向代理原理
- 通过脚手架搭建项目
前端通信
1.通信有两个端
- 服务端
- 客户端
- 举例:QQ / 微信
- 每个人手中的QQ和微信都是客户端
- 腾讯这边有服务器主机
- Node.js中提供的通信方案
- 扩展:H5提供的通信方案