Local passport authorization on different ports

Question

I have a node.js application running on port 5000, where I use passport.js as authorization. I authorize users from a post request, where I use a custom callback:

this.router.post('/member/login', (req, res, next) => {
      passport.authenticate('local', (err, member, info) => {
        if (err) res.json(400).json({message: "An error ocurred"});
        if (!member) {
          console.log("No member found!");
          return res.status(409).json({message: "No member found!"})
        }
        req.logIn(member, (err) => {
          if (err) {
            console.log(err);
            return res.status(400).json({message: "An error ocurred"});
          }
          return res.json(member);
        });
      })(req, res, next);
    });

This works fine, but when I develop local I have a frontend Angular2 application, which runs on a different port (4200), so in my development I am not possible to get the authorized user: req.user is undefined. I use express-session to store the authorized user.

When I deploy I bundle both applications up together, so everything works.

Does anyone have a good and simple solution for this issue? Again it's only in development I have this problem.

Answer 1

You can hide both services behind proxy, Nginx for example. And both your services will be use 1 address.

NGINX config example

server {
  listen 80;

  server_name example.com;

  proxy_set_header Host $http_host;
  proxy_pass_header Server;
  proxy_set_header X-Forwarded-For $remote_addr;
  proxy_set_header X-Forwarded-Proto $scheme;

  location / {
    proxy_pass http://frontend_address:port;
    proxy_redirect default;
  }

  location ~ /api {
    proxy_pass http://backend_address:port;
    proxy_redirect default;
  }
}

So all requests http://example.com will go to frontend service, and all requests http://example.com/api/ go to backend service.