react如何获取cookie
获取 Cookie 的方法
在 React 中获取 Cookie 可以通过以下几种方式实现，具体取决于使用场景和需求。
使用 document.cookie
直接通过浏览器提供的 document.cookie API 可以获取当前域下的所有 Cookie。返回的格式是一个字符串，包含所有 Cookie 键值对，用分号和空格分隔。
const cookies = document.cookie;
console.log(cookies); // 输出类似 "key1=value1; key2=value2"如果需要解析为对象格式，可以通过以下代码实现：
const cookies = document.cookie.split('; ').reduce((acc, cookie) => {
const [key, value] = cookie.split('=');
acc[key] = value;
return acc;
}, {});
console.log(cookies); // 输出 { key1: "value1", key2: "value2" }使用第三方库
如果项目需要更复杂的 Cookie 操作（如设置过期时间、路径等），可以使用第三方库如 js-cookie。
安装 js-cookie：
npm install js-cookie使用示例：
import Cookies from 'js-cookie';
// 获取 Cookie
const myCookie = Cookies.get('cookieName');
console.log(myCookie);
// 获取所有 Cookie
const allCookies = Cookies.get();
console.log(allCookies);服务器端获取（Next.js 等框架）
在 Next.js 或其他服务端渲染框架中，可以通过请求头 req.headers.cookie 获取 Cookie。
示例（Next.js API 路由）：
export default function handler(req, res) {
const cookies = req.headers.cookie;
console.log(cookies);
res.status(200).json({ cookies });
}注意事项
- 使用
document.cookie时需注意安全性，避免 XSS 攻击。 - 如果 Cookie 设置了
HttpOnly标志，则无法通过 JavaScript 读取，只能在服务器端访问。 - 跨域请求时需确保 CORS 配置允许携带 Cookie（
credentials: 'include'）。
