Ursprünglich verwende ich den folgenden Ajax, um Cookies zu setzen.
function setCookieAjax(){
$.ajax({
url: `${Web_Servlet}/setCookie`,
contentType: 'application/x-www-form-urlencoded;charset=utf-8',
headers: { 'Access-Control-Allow-Origin': '*',
'username': getCookie("username"),
'session': getCookie("session")
},
type: 'GET',
success: function(response){
setCookie("username", response.name, 30);
setCookie("session", response.session, 30);}
})
}
function setCookie(cname, cvalue, minutes) {
var d = new Date();
d.setTime(d.getTime() + (minutes*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
export const getUserName = (component) => {
setCookieAjax()
$.ajax({
url: `${Web_Servlet}/displayHeaderUserName`,
contentType: 'application/x-www-form-urlencoded;charset=utf-8',
headers: { 'Access-Control-Allow-Origin': '*',
'username': getCookie("username"),
'session': getCookie("session")
},
type: 'GET',
success: function(response){
component.setState({
usernameDisplay: response.message
})
}.bind(component)
})
}
Jetzt möchte ich das Cookie mithilfe der Funktion zum Hinzufügen von Cookies des Servlets setzen. Aber ich weiß nicht, wie ich meinen Zweck erreichen soll.
Cookie loginCookie = new Cookie("user",user); //setting cookie to expiry in 30 mins
loginCookie.setMaxAge(30*60);
loginCookie.setDomain("localhost:4480");
loginCookie.setPath("/");
response.addCookie(loginCookie);
Was sollte ich auf die Reaktionsseite schreiben, um die Sitzungszeit des Cookies zu erhalten, um das Cookie-Zeitlimit zu verlängern?
npm install universal-cookie
? Überprüfen Sie den Pfad in der Nachricht. Wenn es nicht da ist, haben Sie es nicht installiert.undefined
(Kann wegen der Linie seinvar cookies = new Cookies()
, ich weiß nicht). so ermüdend. Ich habe einen Tag mit diesem Problem verbracht, aber noch keine Antwort. Ich werde mein Cookie-Paket ändern.Verwenden Sie beispielsweise Vanille js
document.cookie = `referral_key=hello;max-age=604800;domain=example.com`
Lesen Sie mehr unter: https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie
quelle
Ich setze Cookies in React mithilfe der React-Cookie-Bibliothek. Sie enthält Optionen, mit denen Sie Optionen zum Festlegen der Ablaufzeit übergeben können.
Schau es dir hier an
Ein Beispiel für die Verwendung für Ihren Fall:
import cookie from "react-cookie"; setCookie() => { let d = new Date(); d.setTime(d.getTime() + (minutes*60*1000)); cookie.set("onboarded", true, {path: "/", expires: d}); };
quelle
Eine sehr einfache Lösung ist die Verwendung des sfcookies-Pakets. Sie müssen es nur mit npm installieren, zum Beispiel: npm install sfcookies --save
Dann importieren Sie die Datei:
import { bake_cookie, read_cookie, delete_cookie } from 'sfcookies';
Erstellen Sie einen Cookie-Schlüssel:
const cookie_key = 'namedOFCookie';
In Ihrer Übermittlungsfunktion erstellen Sie das Cookie, indem Sie die Daten wie folgt speichern:
bake_cookie(cookie_key, 'test');
um es zu löschen, mach es einfach
und um es zu lesen:
Einfach und leicht zu bedienen.
quelle
react-cookie
,universal-cookie
und nach einem Tag kämpft mitundefined
der Folgecookies.get("cookie_name")
dieser Pakete, kam ich schließlich über diese Lösung und das Paketsfcookies
für mich gearbeitet. Ich danke dir sehr! Du hast mich gerettet!Standardmäßig , wenn Sie holen Ihre URL , Reaktion nativen setzt das Cookie.
Um Cookies anzuzeigen und sicherzustellen, dass Sie das Paket https://www.npmjs.com/package/react-native-cookie verwenden können . Ich war sehr zufrieden damit.
Natürlich macht Fetch das, wenn es das tut
credentials: "include",// or "some-origin"
Nun, aber wie man es benutzt
--- nach der Installation dieses Pakets ----
um Cookies zu bekommen:
import Cookie from 'react-native-cookie'; Cookie.get('url').then((cookie) => { console.log(cookie); });
Cookies setzen:
Cookie.set('url', 'name of cookies', 'value of cookies');
nur das
Aber wenn Sie ein paar wollen, können Sie es tun
1- wie verschachtelt:
Cookie.set('url', 'name of cookies 1', 'value of cookies 1') .then(() => { Cookie.set('url', 'name of cookies 2', 'value of cookies 2') .then(() => { ... }) })
2- wieder zusammen
Cookie.set('url', 'name of cookies 1', 'value of cookies 1'); Cookie.set('url', 'name of cookies 2', 'value of cookies 2'); Cookie.set('url', 'name of cookies 3', 'value of cookies 3'); ....
Wenn Sie nun sicherstellen möchten, dass die Cookies eingerichtet sind, können Sie sie erneut abrufen, um dies sicherzustellen.
Cookie.get('url').then((cookie) => { console.log(cookie); });
quelle
Kleines Update. Für React-Cookies steht ein Hook zur Verfügung
1) Installieren Sie zunächst die Abhängigkeit (nur für einen Hinweis)
oder
2) Mein Anwendungsbeispiel:
// SignInComponent.js import { useCookies } from 'react-cookie' const SignInComponent = () => { // ... const [cookies, setCookie] = useCookies(['access_token', 'refresh_token']) async function onSubmit(values) { const response = await getOauthResponse(values); let expires = new Date() expires.setTime(expires.getTime() + (response.data.expires_in * 1000)) setCookie('access_token', response.data.access_token, { path: '/', expires}) setCookie('refresh_token', response.data.refresh_token, {path: '/', expires}) // ... } // next goes my sign-in form }
Hoffe es ist hilfreich.
Vorschläge zur Verbesserung des obigen Beispiels sind sehr willkommen!
quelle
Sie können die Standardmethode zum Festlegen von Javascript-Cookies verwenden. das funktioniert perfekt.
createCookieInHour: (cookieName, cookieValue, hourToExpire) => { let date = new Date(); date.setTime(date.getTime()+(hourToExpire*60*60*1000)); document.cookie = cookieName + " = " + cookieValue + "; expires = " +date.toGMTString(); },
Rufen Sie die Java-Skriptfunktion in der Reaktionsmethode wie folgt auf:
createCookieInHour('cookieName', 'cookieValue', 5);
und Sie können die folgende Methode verwenden, um Cookies anzuzeigen.
let cookie = document.cookie.split(';'); console.log('cookie : ', cookie);
Weitere Informationen finden Sie im folgenden Dokument - URL
quelle