前言
随着互联网的发展, HTTP 协议逐渐成为了各类应用间交互数据的标准, 而 cookie 则成为了 web 开发中最为常用的身份验证和状态维护的方式之一. request 和 response 的 Set-Cookie Header 作为实现 cookie 的标准格式, 但是由于 Set-Cookie 头的格式十分复杂, 引发了前端工程师对其解析的问题. 因此, 本文介绍一个 npm 包 set-cookie-serde, 用于解析 Set-Cookie Header.
安装 set-cookie-serde
在项目中, 我们可以通过 npm 安装 set-cookie-serde, 但是需要注意的是, v2 版本对于 cookie name 或 cookie value 中包含空格的情况, 改用了 encode 和 decode, 因此我们需要安装 v1 版本.
npm install set-cookie-serde@1.0.2
使用 set-cookie-serde
set-cookie-serde 可以将 Set-Cookie Header 转换成 JSON 格式, 例如假设我们有一个 Set-Cookie 头如下:
`token=123; Expires=${new Date(new Date().getTime() + 60000).toUTCString()}; Domain=example.com; HttpOnly`我们可以使用 set-cookie-serde 解析它:
const { setCookieParser } = require('set-cookie-serde'); const setCookieHeader = `token=123; Expires=${new Date(new Date().getTime() + 60000).toUTCString()}; Domain=example.com; HttpOnly`; const cookies = setCookieParser(setCookieHeader, { decodeValues: false }); console.log(cookies);
输出结果:
-- -------------------- ---- ------- - - ----- -------- ------ ------ -------- --- --------------------------------- ------- -------------- --------- ----- - -展开代码
其中的 HTTP-Only 属性也可以解析出来.
但是需要注意的是, 对于 cookie 值必须使用 encodeURIComponent() 编码, 而对于 cookie name, 在 v2 版本中也强制要求采用 encode 和 decode 处理空格等特殊字符.
案例展示
以下是一个使用 set-cookie-serde 的代码案例:
-- -------------------- ---- ------- ----- ---- - ---------------- ----- - --------------- - - ---------------------------- ---- ---------------------- ----- ---- - ------------------ - ------------- ----------- ----------- --- ---------------- --------------------------------------------------------- -- --------------展开代码
启动服务之后, 可以通过浏览器访问, 在浏览器 cookie 中可以看到 foo=bar 和 bar=foo 两个 cookie.
结语
通过使用 set-cookie-serde, 我们可以避免 Set-Cookie Header 带来的复杂性问题. 但需要注意的是, v1 版本中对于 cookie 值不做编码, 因此需要比较小心. 同时, 对于 cookie name 中含有空格和一些特殊字符, 需要使用 encodeURIComponent() 编码.
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/199321
