通过react获取cookie

2023-12-26

我需要知道我的用户是否已连接。为此,我想读取我在服务器端使用express-session设置的cookie:

app.use(session({
    secret: 'crypted key',
    resave: false,
    saveUninitialized: true,
    cookie: { secure: false } // Put true if https
}))
app.post('/connect_user', (req, res) => {
    req.session.cookie.username = req.body.username
    findUserData('username', req.body.username, req, (userData) => {
        req.session.cookie.id = userData.id
        req.session.cookie.username = userData.username
        res.redirect('/profil')
    })
})

我尝试使用react-cookie但即使我复制粘贴了 npm,它也不起作用react-cookie文档示例:

import React from 'react';
import Landing from './Landing';
import Home from './Home';
import Profil from './Profil';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import { instanceOf } from 'prop-types';
import { Cookies } from 'react-cookie';

class App extends React.Component {
    static propTypes = {
        cookies: instanceOf(Cookies).isRequired
      };
     
      constructor(props) {
        super(props);
     
        const { cookies } = props;
        this.state = {
          username: cookies.get('username')
        };
      }
    render() {
        console.log(this.state.name) 
        let homePage = (!this.state.username) ? <Landing/> : <Home/>
        return (
            <Router>
                <div>
                    <Route exact path='/' component={homePage}></Route>
                    <Route path='/profil' component={Profil}></Route>
                </div>
            </Router>
        )
    }
}

export default App;

这很奇怪,因为document.cookie呈现正确的结果,但我不知道如何处理它:

PHPSESSID=0nv9ic8h7pv2b63lu4v7eg3mop; user_id=21; username=Ugo; SL_G_WPT_TO=fr; SL_GWPT_Show_Hide_tmp=undefined; SL_wptGlobTipTmp=undefined

您可以使用js-cookie包并可以使用安装它npm install js-cookie --save命令。

import React from 'react';
import Cookies from 'js-cookie';

class App extends React.Component {
     this.state = {
        username: Cookies.get('username')
     }

//  more code....
}  

文档:https://github.com/js-cookie/js-cookie https://github.com/js-cookie/js-cookie

NPM : https://www.npmjs.com/package/js-cookie https://www.npmjs.com/package/js-cookie

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

通过react获取cookie 的相关文章

随机推荐

  • 使用 ndk-build 构建 android 共享库,无需 jni 文件夹

    仅当我的所有 src 都在 jni foler 中时 我才能使用 ndk build 构建一个 android 共享库 但是 我想使用 ndk build 构建一个共享库而不需要 jni 文件夹 因为我的项目没有java代码 那么我该怎么做
  • 字典为相同的键添加值

    我有一个字典列表 name Jay value 1 name roc value 9 name Jay value 7 name roc value 2 我希望它是 name Jay value 8 name roc value 11 我尝
  • 从Artifactory下载依赖项时npm错误403

    我正在尝试使用 Node js 项目运行作业 步骤之一是rtnpminstall它运行npm install命令 这rtnpminstall命令由 Jenkins 上的 Artifactory 插件运行 错误说 npm ERR code E
  • 如何在 Swift 中以编程方式将 HeaderView 从 nib 添加到 UiTableView

    好吧 我是一个使用 swift 语言的天真的 IOS 开发人员 我有一个显示酒店功能列表的表格视图 现在我想在表格视图中添加标题信息 其中包含酒店图像 酒店名称位于表格视图上方 以便标题信息也随着表格视图内容滚动 产品功能列表 问题是 带有
  • 如何在 Rust 中正确包装 C 函数指针? [复制]

    这个问题在这里已经有答案了 我有一个 C 结构体Foo带有函数指针 在我的 Rust 绑定中 我希望允许用户设置此函数指针 但我希望避免用户必须处理 FFI 类型 foo h struct Foo void internal uint8 t
  • NSTextView 的 insertText 方法在 OS X v10.11 中已弃用。替代品是什么?

    我在 AppKit API 参考中看到insertTextOS X v10 11 中已弃用该方法 我应该用什么来代替 文档说 void insertText id aString 该方法是用户输入文本的方法NSTextView 请参阅NSI
  • 对 UITextView 应用字数限制

    如何在 Objective C interface builder 中对 UITextView 应用字数限制 我已经搜索了一段时间 发现了字符数 但没有找到字数 有谁能给我指点一下吗 您可以只计算空格数并对其进行限制 这是一个 hack 但
  • 如何在 WP7 上挂钩硬件搜索按钮

    我有一个带有搜索页面的 WP7 应用程序 我更愿意挂钩硬件搜索按钮 而不是必须将搜索图标添加到菜单栏 有谁知道如何做到这一点 当前版本中的第三方应用程序无法使用硬件搜索按钮 请参考此线程已回答类似问题 https stackoverflow
  • PPP 或以太网如何从错误中恢复?

    查看数据链路级标准 例如 PPP通用帧格式 http www tcpipguide com free t PPPGeneralFrameFormat htm or Ethernet http en wikipedia org wiki Et
  • @Input 属性的可观察值

    我从带有复选框输入的数组中选择了一些值 如本例所示 Visit http plnkr co edit N9NXBYcwhon6ITr8RP5y p preview 但我想使用输入装饰器将检查的数组数据传递给另一个组件 如何使已检查的数据成为
  • 具有不完整链的 SSL 证书通过了 .NET Core 2.2 中的验证

    使用 NET Core 2 2 我需要重新创建不完整链 SSL 错误 但是 ServerCertificateValidationCallback 为我提供了与我预期不同的证书链 并且这些证书通过了验证 有人可以解释这里出了什么问题吗 调用
  • 从页面或应用程序发布到 Facebook 用户的留言墙上

    我可以让用户授权我的应用程序 然后我可以使用以下代码在他们的墙上发布 new Facebook facebook gt api uid feed post array message gt My app says hi 这可行 但出现在用户
  • 如何在 azure 函数中访问 http 请求的所有字段(在 C# 中解析 JSON)?

    microsoft azure 对我来说是一个全新的编程主题 编程基础语言是C 我必须使用逻辑应用程序中的 Azure Funtion Http 触发器 当新电子邮件到达时 我将日志应用程序中收到的电子邮件中的所有可能数据提供给 到天蓝色的
  • Kubernetes 持久卷访问模式:ReadWriteOnce、ReadOnlyMany 和 ReadWriteMany

    据这位官员介绍document https kubernetes io docs concepts storage persistent volumes access modes Kubernetes持久卷支持三种类型的访问模式 只读很多
  • 在 Pandas 中使用 ELIF 创建列

    Question 我无法弄清楚如何根据其他两列中的值创建新的 DataFrame 列 我需要使用 if elif else 逻辑 但我找到的所有文档和示例都只显示 if else 逻辑 这是我正在尝试做的事情的示例 Code df comb
  • TSQL - 选择插入的行

    有没有办法选择插入的行 我正在尝试使用运行以下查询SqlCommand 它用于在数据库中保留给定的id INSERT INTO tbl id SELECT COUNT 1 AS id from tbl 有没有办法返回插入的 id 列 以便我
  • 需要 sigsuspend 的解释

    我需要对 sigsuspend 主题进行澄清 我有一个简化的例子 sigset t mask oldmask sigemptyset mask sigaddset mask SIGRTMIN 1 sigprocmask SIG BLOCK
  • 如何恢复/重新创建 mysql 的默认“mysql”数据库

    当我安装mysql时 它附带了两个数据库 mysql和信息模式 我不小心删除了mysql数据库 有什么办法可以重新创建它吗 另外 由于它包含一个包含用户信息的表 是否有什么方法可以在没有它的情况下查看用户信息 如果您仍然能够登录 我假设您不
  • Facebook API 错误子代码 33

    我有一个应用程序可以获取leads当潜在客户填写表单时 在 webhook 请求后来自 facebook 某些页面抛出此错误 error message Unsupported get request Object with ID 2333
  • 通过react获取cookie

    我需要知道我的用户是否已连接 为此 我想读取我在服务器端使用express session设置的cookie app use session secret crypted key resave false saveUninitialized