angular ngCookies doesn't save cookies after restarting the browser

Question

 var app = angular.module('MyApp', ['ngCookies']);
        app.controller('MyController', function ($scope, $window, $cookies) {
            $scope.WriteCookie = function () {
                $cookies.put("Name", $scope.Name);

            };
            $scope.ReadCookie = function () {
                $window.alert($cookies.get('Name'));
            };
            $scope.RemoveCookie = function () {
                $cookies.remove('Name');
            };
        });

<html>
<head>
    <title></title>
</head>
<body>
  <div ng-app="MyApp" ng-controller="MyController">
        Name:
        <input type="text" ng-model="Name" />
        <br />
        <br />
        <input type="button" value="Write Cookie" ng-click="WriteCookie()" />
        <input type="button" value="Read Cookie" ng-click="ReadCookie()" />
        <input type="button" value="Remove Cookie" ng-click="RemoveCookie()" />
    </div>
</body>
</html>

I wrote this simple demp app for cookies in angular.

whenever I enter this (via nodeJS) and go to this url: http://127.0.0.1:8080

the cookies is presisted in the browser's cookies. when I click refresh or close the tab and opening a new tab with this url (without closing the browser) the cookies stays.

However, when I close the browser (chrome/IE/firefox) and open this url again, the cookies is not there!

why? how can I make it like facebook when even if I trun off my computer and start it again it will remember my login info by coockis?

Thanks

index.html

<html>
<head>
    <title></title>
</head>
<body>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-cookies.min.js"></script>
    <script type="text/javascript">
        var app = angular.module('MyApp', ['ngCookies']);
        app.controller('MyController', function ($scope, $window, $cookies) {
            $scope.WriteCookie = function () {
                $cookies.put("Name", $scope.Name);

            };
            $scope.ReadCookie = function () {
                $window.alert($cookies.get('Name'));
            };
            $scope.RemoveCookie = function () {
                $cookies.remove('Name');
            };
        });
    </script>
    <div ng-app="MyApp" ng-controller="MyController">
        Name:
        <input type="text" ng-model="Name" />
        <br />
        <br />
        <input type="button" value="Write Cookie" ng-click="WriteCookie()" />
        <input type="button" value="Read Cookie" ng-click="ReadCookie()" />
        <input type="button" value="Remove Cookie" ng-click="RemoveCookie()" />
    </div>
</body>
</html>

Michael Troger · Accepted Answer · 2016-09-24T12:45:46.203

3

This is because if you don't set an expiration time for the cookie, it will be created as session cookie. Which will be removed as soon as you close the browser.

In order to avoid this just set an expiration time for the cookie, like e.g. here for one day:

var expireDate = new Date(); 
expireDate.setDate(expireDate.getDate() + 1); 

$cookies.put('Name', $scope.Name, {
  expires: expireDate
});

edited Sep 24 '16 at 12:45

answered Sep 24 '16 at 12:20

Michael Troger

3,336
2
25
41

thanks I did what you said but I'm still creating a session cookies.. are you sure that I am not missing anything else other then the expire properties? – Matoy Sep 24 '16 at 12:35
Did you make sure your old cookie was deleted before? – Michael Troger Sep 24 '16 at 12:37
1

Yes. I did $cookies.remove('Name'); and checked in editThisCookies chrome's extenation to see that the cookie was deleted. – Matoy Sep 24 '16 at 12:39
And the new one is created with the correct expire date? Check the extension. Also try it with one year like in the edited version above. – Michael Troger Sep 24 '16 at 12:40
1

the problem was that the now properites was not defined in my code by mistake.. used this line below and it is now working, thanks! var expireDate = new Date(); expireDate.setDate(expireDate.getDate() + 1); – Matoy Sep 24 '16 at 12:43

angular ngCookies doesn't save cookies after restarting the browser

1 Answers1