CODEWITHSUNDEEP
node.jsangularexpress
petur
petur

Reputation: 1386

Serve Angular app with express if user is authenticated

We're building an app created only for certain users in our database. The app should not be accessible by no one else.

Our thought is to serve a simple HTML file, with some info about the app that we have. Our backend for the app should be nodejs and it should check if the user has a cookie provided from our authentication api and attached to our domain. If the user has the cookie, we should provide them with the app folder.

We want to protect our js files and all files belonging to the app from the public if they are not authenticated.

In the simple HTML file, we should basically have a button that says: "I'm authenticated, let me browse the app".

<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Landing page</title>
</head>
<body>
  <h1>Landing page app!!!</h1>
  <input onclick="location.href='/app';" type="submit" 
   value="I'm authenticated, let me browse the app!"/>
</body>
</html>

The Node server has a route called /app.

const express = require('express');
const app = express();
const port = process.env.PORT || 9090;
const fs = require('fs');

app.use(express.static('public')); //only contains index.html

app.listen(port, (err) => {
  if (err) {
    console.log(err);
  }
});

app.get('/app', (req, res) => {
  if(req.user.isAuthenticated){
      //Psuedo code below
      res.send(WholeAngularAppToUser());
  }
  else{
      // User should stay on landing page 
      // with information about that they are not authenticated
  }
});

How can we send the whole angular app to the user?

Upvotes: 1

Views: 413

Answers (1)

Geraint Anderson
Geraint Anderson

Reputation: 3393

Unless the 'I'm authenticated' button serves some purpose during the authentication process (like also send credentials) you should probably just get rid of it and try to access the app directly. Angular apps are often served as static files so you should set it as a static route that's protected by some middleware:

app.use('/app', function(req, res, next) {
  if (req.user.isAuthenticated) {
    next()
  } else {
    res.sendFile(path.join(__dirname, 'public/index.html'))
  }
})
app.use('/app', express.static('/app');

Of course, you wouldn't just accept some "isAuthenticated" flag in the request as the user being authenticated so you would swap the middleware for something a bit more secure.

Upvotes: 3

Related Questions