it-swarm.com.de

Festlegen des Ablaufdatums für ein Cookie in AngularJS

  1. Wir möchten die Informationen zur Benutzerautorisierung in einem Cookie speichern, das beim Aktualisieren (F5) des Browsers nicht verloren gehen sollte.

  2. Wir möchten Autorisierungsinformationen in "Permanent-Cookie" speichern, falls der Benutzer zum Zeitpunkt der Anmeldung das Kontrollkästchen "Remember Me" gewählt hat.

78
Sutikshan Dubey

Dies ist im 1.4.0-Build von angle mit dem Modul ngCookies möglich:

https://docs.angularjs.org/api/ngCookies/service/$cookies

angular.module('cookiesExample', ['ngCookies'])
.controller('ExampleController', ['$cookies', function($cookies) {
  // Find tomorrow's date.
  var expireDate = new Date();
  expireDate.setDate(expireDate.getDate() + 1);
  // Setting a cookie
  $cookies.put('myFavorite', 'oatmeal', {'expires': expireDate});
}]);
45
Geert van Dort

Für 1.4: .__ Wie in den Kommentaren hier und in den folgenden Kommentaren erwähnt, bietet Angulars native Cookie-Unterstützung ab 1.4 nun die Möglichkeit, Cookies zu bearbeiten:

Aufgrund von 38fbe3ee setzen $ Cookies keine Eigenschaften mehr offen, die repräsentieren die aktuellen Browser-Cookie-Werte. $ Cookies werden nicht mehr abgefragt der Browser für Änderungen an den Cookies und kopiert das Cookie nicht mehr Werte auf das $ Cookies-Objekt.

Dies wurde geändert, weil die Abfrage teuer ist und Probleme verursacht Die $ Cookies-Eigenschaften werden nicht korrekt mit dem .__ synchronisiert. tatsächliche Browser-Cookie-Werte (Der Grund für das Abfragen war ursprünglich wurde hinzugefügt, um die Kommunikation zwischen verschiedenen Registerkarten zu ermöglichen. Es gibt jedoch bessere Möglichkeiten, dies heute zu tun, beispielsweise localStorage.)

Die neue API für $ Cookies sieht wie folgt aus:

get put getObject putObject getAll remove Sie müssen explizit die .__ verwenden. Methoden oben, um auf Cookie-Daten zuzugreifen. Dies bedeutet auch, dass Sie kann die Eigenschaften von $ cookies nicht mehr überwachen, um Änderungen festzustellen, die auf den Browser-Cookies auftreten.

Diese Funktion wird im Allgemeinen nur benötigt, wenn eine Drittanbieter-Bibliothek .__ war. Programmgesteuertes Ändern der Cookies zur Laufzeit. Wenn Sie sich darauf verlassen. dann müssen Sie entweder Code schreiben, der auf den Drittanbieter reagieren kann Bibliothek, die die Änderungen an Cookies vornimmt oder Ihre eigene Abfrage durchführt Mechanismus.

Die eigentliche Implementierung erfolgt über ein $ cookiesProvider - Objekt, das über den Aufruf von put übergeben werden kann. 

Für 1.3 und darunter: Für diejenigen von Ihnen, die Ihr Bestes getan haben, um das Laden von jQuery-Plugins zu vermeiden, scheint dies ein netter Ersatz für angle zu sein - https://github.com/ivpusic/angular-cookie

32
streetlogics

In Angular v1.4 können Sie finally einige Optionen für die Cookies festlegen, z. B. den Ablauf. Hier ist ein sehr einfaches Beispiel:

var now = new Date(),
    // this will set the expiration to 12 months
    exp = new Date(now.getFullYear()+1, now.getMonth(), now.getDate());

$cookies.put('someToken','blabla',{
  expires: exp
});

var cookie = $cookies.get('someToken');
console.log(cookie); // logs 'blabla'

Wenn Sie Ihre Cookies nach dem Ausführen dieses Codes überprüfen, werden Sie feststellen, dass der Ablauf ordnungsgemäß auf das Cookie mit dem Namen someToken gesetzt ist.

Das Objekt, das als dritter Parameter an die oben genannte put-Funktion übergeben wird, ermöglicht auch andere Optionen, wie z. B. path, domain und secure. Überprüfen Sie die Dokumente für eine Übersicht.

PS - Als Randbemerkung für ein Upgrade sollten Sie beachten, dass $cookieStore veraltet ist. Daher ist $cookies die einzige Methode, mit Cookies umzugehen. siehe docs

26
Nobita

Ich möchte ein zusätzliches Beispiel vorstellen, da einige Leute die zusätzliche Dauer der Cookies-Lebensdauer kennen. dh. Sie möchten einen Cookie für die Dauer von 10 Minuten oder 1 Tag festlegen. 

In der Regel wissen Sie bereits, wie lange der Cookie in Sekunden dauert.

    var today = new Date();
    var expiresValue = new Date(today);

    //Set 'expires' option in 1 minute
    expiresValue.setMinutes(today.getMinutes() + 1); 

    //Set 'expires' option in 2 hours
    expiresValue.setMinutes(today.getMinutes() + 120); 


    //Set 'expires' option in (60 x 60) seconds = 1 hour
    expiresValue.setSeconds(today.getSeconds() + 3600); 

    //Set 'expires' option in (12 x 60 x 60) = 43200 seconds = 12 hours
    expiresValue.setSeconds(today.getSeconds() + 43200); 

    $cookies.putObject('myCookiesName', 'myCookiesValue',  {'expires' : expiresValue});

und Sie können es wie gewohnt abrufen: 

    var myCookiesValue = $cookies.getObject('myCookiesName');

Wenn leer, wird undefined zurückgegeben.

Links;

http://www.w3schools.com/jsref/jsref_obj_date.asp
https://docs.angularjs.org/api/ngCookies/provider/ $ cookiesProvider # Standardeinstellungen

10

Sie können zum Script "angle.js" gehen und das Einfügungscookie ändern
Suche nach self.cookies = function(name, value) { dann können Sie den Code ändern, durch den das Cookie beispielsweise für 7 Tage hinzugefügt wird 

 if (value === undefined) {
    rawDocument.cookie = escape(name) + "=;path=" + cookiePath +
                            ";expires=Thu, 01 Jan 1970 00:00:00 GMT";
  } else {
    if (isString(value)) {
        var now = new Date();
        var time = now.getTime();
        time += 24*60*60*1000*7;
        now.setTime(time);
         cookieLength = (rawDocument.cookie = escape(name) + '=' + escape(value) +
                 ';path=' + cookiePath+";expires="+now.toGMTString()).length + 1
3
yonia

Ich weiß, dass diese Frage ein bisschen alt ist und bereits eine akzeptierte Antwort hat.

Aber immer noch ein aktuelles Problem, mit dem ich zu kämpfen habe (nicht in Bezug auf jQuery oder reines Javascript).

Nach einigen Recherchen habe ich Folgendes gefunden: https://github.com/ivpusic/angular-cookie

Welches liefert eine "Schnittstelle" ganz ähnlich zu $ ​​cookieStore. Und ermöglicht die Konfiguration des Ablaufdatums (Wert und Einheiten).

Über angular native Unterstützung am Verfallsdatum mit $ cookie oder $ cookieStore, "sie" versprechen Updates zu diesem Thema ab 1.4, siehe dazu: https://github.com /angular/angular.js/pull/105

Das Ablaufdatum kann mit $ cookieStore.put (...) festgelegt werden, zumindest wird vorgeschlagen, dass ...

BEARBEITEN: Ich bin auf ein "Problem" gestoßen, bei dem Sie $ cookies nicht mit dem modularen Winkel-Cookie mischen können. Wenn Sie also ein Cookie mit ipCookie(...) setzen, rufen Sie es mit ipCookie(...) ab, da es mit $ cookie undefined zurückgibt.

2
Paulo Oliveira

@ Vincent-briglia weist darauf hin , dass es ein jQuery-Drop-In gibt, das als Problemumgehung verwendet werden kann, bis der $cookie-Dienst konfigurierbar wird - check it here

1
Jan Molak

Sie können https://github.com/ivpusic/angular-cookie verwenden.

Zunächst müssen Sie ipCookie in Ihr Winkelmodul injizieren.

var myApp = angular.module('myApp', ['ipCookie']);

Und jetzt zum Beispiel, wenn Sie es von Ihrem Controller aus verwenden möchten

myApp.controller('cookieController', ['$scope', 'ipCookie', function($scope, ipCookie) {
  // your code here
}]);

So erstellen Sie ein Cookie verwenden

ipCookie(key, value);

Der Wert unterstützt Zeichenfolgen, Zahlen, Booleans, Arrays und Objekte und wird automatisch in das Cookie serialisiert.

Sie können auch einige zusätzliche Optionen festlegen, z. B. die Anzahl der Tage, an denen ein Cookie abläuft

ipCookie(key, value, { expires: 21 });
0
Andy M.