React-设置cookie

最新推荐文章于 2025-05-30 09:08:15 发布

原创最新推荐文章于 2025-05-30 09:08:15 发布 · 1.3w 阅读

2 ·

CC 4.0 BY-SA版权

react 专栏收录该内容

10 篇文章

订阅专栏

本文介绍在React应用中如何使用document.cookie进行数据持久化存储，特别针对登录状态和token的保存，以实现永久化登录。文章提供了getCookie和setCookie两个实用函数，分别用于读取和设置cookie。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

react设置cookie,持久化保存数据,一般来说,我们使用redux来保存当前数据即可,但是有一种情况,需要保存信息,那就是登陆的时候,我们需要存储,token,来保持永久化登陆

将其抽取到了common中,通过document.cookie,来获取页面的cookie

export default {

    // 获取cookie
    getCookie(key) {
        const name = key + "=";
        const ca = document.cookie.split(';');
        for (let i = 0; i < ca.length; i++) {
            const c = ca[i].trim();
            if (c.indexOf(name) === 0) {
                return c.substring(name.length, c.length);
            }
        }
        return "";
    },

    // 设置cookie,默认是30天
    setCookie(key, value) {
        const d = new Date();
        d.setTime(d.getTime() + (30 * 24 * 60 * 60 * 1000));
        const expires = "expires=" + d.toGMTString();
        document.cookie = key + "=" + value + "; " + expires;
    }

}