动态服务器

动态服务器V.S静态服务器

• 也叫动态网页V.S静态网页

判断依据

• 是否请求了数据库：没有请求数据库，就是静态服务器；请求了数据库，就是动态服务器。

• 数据库：不属于前端范畴，但是要了解一些。

const fs = require("fs"); //引入读数据库的fs

//读数据库
const usersString = fs.readFileSync("./db/users.json").toString();
const usersArray = JSON.parse(usersString); // 反序列化

//写数据库
const user3 = { id: 3, name: "tom", password: "yyy" };
usersArray.push(user3);
const string = JSON.stringify(usersArray); //序列化
fs.writeFileSync("./db/users.json", string);

目标一

<script>
      const $form = $("#registerForm");
      $form.on("submit", (e) => {
        e.preventDefault();
        //阻止默认的点击事件执行，建议一开始就写上
        const name = $form.find("input[name=name]").val();
        const password = $form.find("input[name=password]").val();
        console.log(name, password);
       //获取name和password
       //发送AJAX请求
        $.ajax({
          method: "POST",
          url: "/register",
          contentType: "test/json ; charset=UTF-8",
          data: JSON.stringify({ name, password }),
        }).then(
          () => {
            alert("注册成功");
            location.href = "/sign_in.html";
          },
          () => {}
        );
      });
    </script>

目标二

• 目标2受阻，目标太大了，目标应该尽量小

目标三（标记用户已登录）

Cookie

定义

• Cookie是服务器下发给浏览器的一段字符串

• 浏览器必须保存这个Cookie（除非用户删除）

• 之后发起相同二级域名请求（任何请求）时，必须附上Cookie

• Cookie 相当于门票，有Cookie就是登录了，没Cookie就没登录

Set-Cookie响应头

• 语法

Set-Cookie: <cookie-name>=<cookie-value>
Set-Cookie: <cookie-name>=<cookie-value>; Expires=<date>  //设置有效的时间
Set-Cookie: <cookie-name>=<cookie-value>; Max-Age=<non-zero-digit>  //设置最大的时间
Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>  //设置域名
Set-Cookie: <cookie-name>=<cookie-value>; Path=<path-value>  //设置路径
Set-Cookie: <cookie-name>=<cookie-value>; Secure  //设置是否只在HTTPS的时候附带
Set-Cookie: <cookie-name>=<cookie-value>; HttpOnly  //不准前端碰Cookie, 一定要加上

Set-Cookie: <cookie-name>=<cookie-value>; SameSite=Strict
Set-Cookie: <cookie-name>=<cookie-value>; SameSite=Lax

// Multiple directives are also possible, for example:
Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>; Secure; HttpOnly

目标四

目标五

Cookie/Session 总结

服务器可以给浏览器下发Cookie

• 通过Response Header

• 具体语法见MDN

浏览器上的Cookie可以被篡改

• 用开发者工具就能改

• 弱智后端下发的Cookie 用JS也能篡改

服务器下发不可篡改的Cookie

• Cookie可包含加密后的信息（还得解密，麻烦）

• Cookie也可只包含一个id （随机数）

• 用session[id] 可以在后端拿到对应的信息

这个id无法被篡改

• 但可以被复制，问题不大。