通过React获取Cookie

  • Z时代
  • 2024-01-10
  • 分类：问答

我需要知道我的用户是否已连接。为此，我想读取在服务器端通过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 doc：

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

NPM：https :

//www.npmjs.com/package/js-cookie

以上是 通过React获取Cookie 的全部内容， 来源链接： utcz.com/qa/428015.html

回到顶部