项目地址
基础概念
- session 又叫会话
form表单元素 与提交的 基本知识
- form的action属性不需要去写它，ajax时自己填写就可以了
- label上的for 对应的是 input上的id，作用是点击label可以自动聚焦input
- input务必写在label标签的里面
- 勾选框要分组就让name一致
- js务必阻止提交按钮的默认行为 e.preventDefault() 不使用默认提交功能
- POST请求传data时务必把数据序列化一下
- 设置正确的content-type
- input 上的name属性没什么大用，发请求时候是自己设置的
- 结构的在线示例
为什么地址栏输入index.html会让整个浏览器窗口页面整体变化 而ajax发的请求获取html代码片段却不会引起浏览器窗口的整体变化呢？
- 如果你是通过浏览器的地址栏输入的请求，只能是模拟get请求
- 如果你地址栏输入一个.html文件那么后台会返回给你html文件并渲染到整个浏览器窗口
- 但你也可以通过ajax去获取某个区域的数据时，浏览器的地址栏没发生变化当然还在这个页面
- 所以你通过ajax得到的html代码片段就要看你前端怎么处理把他摆放到相应位置了
每个公司都应该有一套错误编码
比如4001 表示用户名密码不正确
response.end(`{"errorCode":4001}`)
别人封装好的ajax替你做了什么？
- ajax基本的4步 创建xhr 初始化请求 绑定回调函数 发送请求
- new promise
- 如果后端你写的statusCode=4xx 那么封装好的ajax逻辑会执行失败函数
- 假如你不写statusCode如果用的是别人的ajax库，别人也会给你自动添上200
cookie
- cookie在http中只是一个响应头的内容
- 工作中永远不要用前端设置cookie，没有安全性可言
- 后端程序员要设置HttpOnly以免用户通过js修改cookie
HttpOnly
- 防的是js对cookie的修改，你在console中敲
document.cookie去访问就读不出了 - 但是用户任然可以通过浏览器的功能去直接编辑cookie
Session的作用
- 举个例子，可以防篡改cookie值中的userId，因为用户是可以通过浏览器去编辑cookie的，（httpOnly防的是js操纵cookie）
就登陆跳转这件事而言，不采用session时候原本的流程是:
1.前台进入/sign_in.html路径，静态服务器直接sign_in.html这个文件返回给前端，
2.然后用户输入用户名密码，点击提交，此刻发起了别人封装好的ajax请求到/sign_in这个路径(不是/sign_in.html哈)
3.后端会去打开数据库试图.find有无此用户，有的话则会设置响应头set-cookie:userId=xxx给前端，并且返回一个200的statusCode给前端
4.然后前端js会通过ajax.then方法方法实现路径跳转/home.html
5.跳转的时候后台就会再次读取请求头中的cookie，然后通过cookie中的userId去找到数据库中的完整的一大包该用户的信息并返回以在前端页面展示
但如果用户篡改cookie中的userId，不就相当于从服务器这边可以顺利获取别人用户的信息了嘛？
为了防止用户私自乱改cookie，我们就不会直接把用户userId传给客户端，而是传一个sessionId给客户端;
后端配合着还要建一张session数据表；
用户输入了用户名密码成功验证然后跳转时，后端在session表中创建了一个对象
key为一组随机数，暂存一下userId，然后后端在响应头中给前端set-cookie:sessionId=xxx
登陆后浏览器自动跳转进入登陆后的界面时，后台读取一下请求头里的sessionId字段，从session表中根据sessionId把userId取出来;
再根据userId去数据库中查找对应用户信息返回给前端;
