Angular CORS and workflow-CodePudding

I have an Angular app on port 4200. I have the node server on port 300. I'm following a MEAN stack guide. To allow CORS, it suggests adding this to the server response:

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, DELETE, OPTIONS"
  );
  next();
});

I have two questions:

Is this safe for deployment?
Is this a recommended workflow to access data from the server while in development? If it's this easy, what's the point of using Angular's in-memory-web-api-module?

CodePudding user response：

You can restrict the origin a bit more, like this :

 res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');

instead of an asterisk.

When deployed, your header can be specified with your domain, which will restrict the access.

If you're really concerned about security, I'd advise you to develop a JWT based system which will only allow GET, POST, ... requests only if your user HAS an access token. And in that token restrict it even more with authorities on your resource endpoints.