title: Cookies set by AngularJS are ignored after browser refresh
body: <p>I am creating an Angularjs single page app with SQL, Angularjs, Node.js, and Express, which has login using passport and basic auth. When a user logs in they are able to access routes to edit items in the database. This all works correctly, the problem is that the cookies are only sent as long as the browser doesn't refresh. </p>
  
  <p>If the browser refreshes, the token is no longer sent with the request, so the user isn't able to access the routes anymore, because there's no token with the request. If you look at the cookies in the browser, however, the token is still there and as long as the server hasn't restarted, the token should still be valid.</p>
  
  <p>There are also other cookies there that are set by Google Analytics, but they get sent with the request every time. And if I set a cookie in <code>app.run</code>, it does persist and get sent with the request every time, it's only the cookies created with the login factory that aren't sent after the browser refreshes. </p>
  
  <p>My login factory looks like this:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>'use strict';
  
  import * as customFunctions from '../../shared/methods/common-functions.js';
  
  const userLoggingRESTResources = (app) =&gt; {
  
    app.factory('userLoggingRESTResources', ['$http', '$base64', '$cookies', '$window', ($http, $base64, $cookies, $window) =&gt; {
      return (user, callback) =&gt; {
        return {
          signIn: (user, callback) =&gt; {
            var encoded = $base64.encode(user.username + ':' + user.password);
            $http.get('/auth/login', {
                headers: {
                  'Authorization': 'Basic ' + encoded
                }
              })
              .success((data) =&gt; {
  
                $cookies.put('token', data.token);
                $cookies.put('interopAdmin', data.admin);
                $window.sessionStorage.token = data.token;
                $http.defaults.headers.common.Authorization = data.token;
                callback(null);
              })
              .error((data) =&gt; {
                callback(data);
              })
          }
  
        };
      }
  
  
    }])
  }
  
  module.exports = userLoggingRESTResources;</code></pre>
  </div>
  </div>
  </p>
  
  <p>My login route looks like this:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>  router.get('/login', passport.authenticate('basic', {
      session: false
    }), (req, res) =&gt; {
      let userJSON = {
        randomString: req.user.dataValues.randomString,
        id: req.user.dataValues.id
      };
      res.req.headers.authorization = 'hahaha';
      for (let key in res.req.rawHeaders) {
        if (res.req.rawHeaders[key].slice(0, 5) === 'Basic') {
          res.req.rawHeaders[key] = 'Basic xxxx';
        }
  
      }
      req.user.$modelOptions.instanceMethods.generateToken(userJSON, process.env.SECRET_KEY, (err, token) =&gt; {
        if (err) {
          console.log(err);
          return res.status(500).json({
            msg: 'error generating token'
          });
        }
  
        res.status('200').header('token', token).json({
          token: token,
          'admin': req.user.dataValues.isAdmin
        });
      });
    });</code></pre>
  </div>
  </div>
  </p>
  
  <p>I'm using the <a href="https://www.npmjs.com/package/eat" rel="nofollow">eat</a> module from npm to handle decoding the token:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>'use strict';
  
  const eat = require('eat');
  const models = require('../models');
  const User = models.User;
  const clc = require('cli-color');
  
  module.exports = (secret) =&gt; {
    return (req, res, next) =&gt; {
      let token = req.cookies.token || req.headers.token || req.body.token || req.headers.authorization;
      if (!token) {
        console.log(clc.white.bgRed('no token in request'));
        return res.status(401).json({
          msg: 'not authorized'
        });
      }
      eat.decode(token, secret, (err, decoded) =&gt; {
        if (err) {
          console.log(clc.white.bgRed('Error, login failed:   '), err);
          return res.status(401).json({
            msg: 'not authorized'
          });
        }
  
        User.findOne({
            where: {
              id: decoded.id
            }
          })
          .then((user) =&gt; {
            if (!user) {
              console.log(clc.white.bgRed('user not found'));
              return res.status(401).json({
                msg: 'not authorized'
              });
            }
  
            req.user = user;
            next();
          })
          .error((error) =&gt; {
            console.log(clc.white.bgRed('Error:  '), err);
            return res.status(401).json({
              msg: 'not authorized'
            });
          });
      });
    };
  };</code></pre>
  </div>
  </div>
  </p>
  
  <p>If there's another part of the code you would like to see, please let me know. Thanks if advance for all you help!</p>