前端的Cookies

Cookies

cookies 特性

• 前端數據存儲
• 後端經過 HTTP 頭設置
• 請求時經過 HTTP 頭傳給後端
• 前端可讀可寫
• 遵照同源策略
  • 域名
  • 有效期
  • 路徑
  • http-only
  • secure(https)

cookies 做用

• 存儲個性化設置
• 存儲未登陸時用戶惟一標識
• 存儲已登陸用戶的憑證
• 存儲其餘業務數據

Cookies-登陸用戶憑證

• 前端提交用戶名和密碼
• 後端驗證用戶名和密碼
• 後端經過 http 頭設置用戶憑證

• 後續訪問時後端先驗證用戶憑證

• 驗證用戶 ID

• ID+簽名

生成複雜字符串

var crypt = {}
const KET = '#$%489!#$%&*156sd'

crypt.cryptUserId = function(userId){
    var crypto = require('crypto);
    var sign = crypto.createHmac('sha256,KEY');
    sign.updata(userId + '');
    return sign.digest('hex');
}

module.exports = crypt;

進行設置

//登錄成功，設置Cookies
ctx.cookies.set("sign", crypt.cryptUserId(user.id), {
  httpOnly: false,
  sameSite: "strict"
});
ctx.cookies.set("userId", user.id, {
  httpOnly: false,
  sameSite: "strict"
});

驗證

var userId = ctx.cookies.get("userId");
var sign = ctx.cookies.get("sign");
var correctSign = crypt.cryptUserId(userId);
if (correctSign !== sign) {
  throw new Errow("報告，有人入侵");
}

上面代碼，可防護，篡改的 UserId 的入侵

• SessionId

sessionId 爲隨機生成的字符串，第三方拿不到，就沒法入侵

生成複雜字符串

var session = {};

session.set = function(userId, obj) {
  var sessionId = Math.random();
  if (!cache[sessionId]) {
    cache[sessionId] = {};
  }
  cache[sessionId].conntent = obj;
  return sessionId;
};
session.get = function(userId) {
  return cache[session] && cache[sessionId].content;
};
module.exports = session;

進行設置

var sessionId = session.set(user.id, {
  userId: user.id
});
ctx.cookies.set("sessionId", sessionId, {
  httpOnly: ture,
  sameSite: "strict"
});

驗證

var sessionId = ctx.cookies.get("sessionId");
var sessionObj = session.get(sessionId);
if (!sessionObj || !sessionObj) {
  throw new Error("session不存在");
}
var userId = sessionObj.userId;

sessionId 須要持久化，存入數據庫，由於內存是有限的。都存在內存中，服務器會出問題

Cookies 其餘

• Cookies 與 XSS 的關係
  • XSS 可能偷取 Cookies
  • http-only 的 Cookies 不會被偷

• Cookies 與 CSRF 的關係

  • CSRF 利用了用戶 Cookies
  • 攻擊站點沒法讀寫 Cookies
  • 最好能阻止第三方使用 Cookies
• Cookies 安全案例
  • 某學校教務處
    • 某學校教務系統使用了開源的 CMS
    • 改 CMS 使用 username 做爲惟一用戶標識
    • 改 CMS 文章做者暴露了 username
    • 可以使用任意的 username 登陸後臺
  • 某論壇
    • 某論壇使用了某開源的 ASP BBS 程序
    • 改 ASP 程序使用用戶 ID 做爲用戶標識
    • 可僞造任意用戶登陸

Cookies-安全策略

• 簽名防篡改
• 私有變換（加密）
• http-only(防止 XSS)
• secure（僅容許 https 協議下使用 Cookies）
• same-site(很好地策略，但不是全部瀏覽器都支持)

　加密與解密

npm install crypto

var crypto = require("crypto");

var KEY = "#$%^156ssc#$%";
var cipher = crypto.createCipher("des", KEY);
var text = cipher.update("hello word", "utf8", "hex");
text += cipher.final("hex");

console.log(text);//加密後的

var decipher = crypto.createDecipher("des", KEY);
var originalText = decipher.update(text, "hex", "utf8");

console.log(originalText);//原來的