Load, save and remove cookies within your React application
You can also plug it directly with a Node.js request by adding just before the renderToString: var unplug = reactCookie.plugToRequest(req, res);
(require the cookieParser middleware)
To ensure long running async operations do not attempt to alter cookies after the request has been sent, call the unplug
function that is returned in a finally block in your router.
If you are within a non-browser or Node.js environment, you can use reactCookie.setRawCookie(req.headers.cookie)
NPM: npm install react-cookie
Bower: bower install react-cookie
CDN: https://cdnjs.cloudflare.com/ajax/libs/react-cookie/0.4.3/react-cookie.min.js
import { Component } from 'react';
import cookie from 'react-cookie';
export default class MyApp extends Component {
constructor(props) {
super(props);
this.state = { userId: cookie.load('userId') };
}
onLogin(userId) {
this.setState({ userId });
cookie.save('userId', userId, { path: '/' });
}
onLogout() {
cookie.remove('userId', { path: '/' });
/** Clear all cookies starting with 'session' (to get all cookies, omit regex argument) */
Object.keys(cookie.select(/^session.*/i)).forEach(name => cookie.remove(name, { path: '/' }))
}
render() {
return (
<LoginPanel onSuccess={this.onLogin.bind(this)} />
);
}
}
You can use react-cookie with anything by using the global variable reactCookie
.
Note that window
need to exists to use reactCookie
.
Support all the cookie options from the RFC 6265.
cookie path
absolute expiration date for the cookie (Date object)
relative max age of the cookie from when the client receives it (seconds)
domain for the cookie
true or false
true or false
This project is under the MIT license. You are free to do whatever you want with it.