Loading an Angular App from the Backend

Question

I want to check if a user is authenticated from the backend BEFORE anything else has loaded in my angular app, so that no source code has loaded. The initial request to be sent to the back end will be to see whether the user is authenticated. If so, the app will be loaded.

Alternatively, I would like to know how I could have my backend check authentication when the page is requested, and send different content depending on whether the user is logged in or not.

How can I best accomplish this?

app.use(function(req, res, next) {
  console.log(req);
 next();
});

app.all('*', function(req, res, next) {
  console.log(req);
  res.send('hey');
})

Why don't these work in my node app?

Answer 1

If you're using a render engine like jade. In your jade template that loads you can embed angular and embed the ng-view on said jade template.

So you have the server handle auth using a jade template tk render your open/public page and then authenticate. Once they pass your Auth test redirect the page to the jade template which has the angular on it. jade will then render the page, once the page loads angular gets called and your angular app will take over the page.

Just be careful if you use URIs that overlap on your server routes and your angular template URIs as they will trigger any middleware on those routes during the ajax call.

Answer 2

You could have your backend check authentication when the page is requested, and send different content depending on whether the user is logged in or not.

The other way is to resolve a service in your route config which checks authentication before the route is resolved. https://docs.angularjs.org/api/ngRoute/provider/ $routeProvider

Answer 3

I give a very helpful tutorial about authentication with token ; in general the idea is use a interceptor that check if the user was authenticated, in case that the user was not authenticate redirect to default or login page

Answer 4

You need to authenticate your user and check his authorization somehow. For example, if you use session -based authentication (quite similar to the way PHP does sessions), you might have a /login site that renders the user's login page. With a custom expressjs middleware you can then redirect unauthorized users or reply with a 401 Unauthorized / 403 Forbidden .

app.use(require('cookie-parser')());
app.use(require('express-session')());
// ...

app.post('/login', function (req, res, next) {
  if (credentialsAreOK(req) {
    req.session.authorized = true;
    res.redirect('/pageAfterLogin');
  } else {
    res.send(401);
  }
};

var checkAuthorization = function (req, res, next) {
  if (req.session && req.session.authorized) {
    return next();
  } else {
    res.redirect('/login');
    // or return res.send(401);
  }
};

app.get('/protectedSite', checkAuthorization);
// or
app.get('/protectedSite', checkAuthorization, protectedSiteHandler);