首页 > 解决方案 > 从 Angular 发送的 GET HTTP 请求导致 500(内部服务器错误)

问题描述

我正在尝试向服务器发送一个 GET 请求,例如在登录阶段的用户经过身份验证,他们可以访问某个路由。否则,他们不能。这条路线是/user。我的问题是,只要登录成功,用户仍然无法访问路由/user。我创建了一个中间件函数来检查用户是否经过身份验证:

function isValidUser(req, res, next) {
  if (req.isAuthenticated()) next();
  else return res.status(401).json({ message: "Unauthorized Request" });
}

然后在用户路由中使用了这个中间件函数:

router.get("/user", isValidUser, function(req, res, next) {
  return res.status(200).json(req.user);
});

现在对于 Angular,我在服务中发送请求如下:

  user() {
    return this._http.get("http://127.0.0.1:3000/users/user", {
      observe: "body",
      withCredentials: true,
      headers: new HttpHeaders().append("Content-Type", "application/json")
    });
  }

最后,在用户可以访问的组件内部,我在构造函数中注入了这个服务

constructor(private _user: UserService, private _router: Router) {
    this._user.user().subscribe(
      data => console.log(data),
      error => {
        console.log(error);
        this._router.navigate(["/login"]);
      }
    );
  } 

这是服务器中的cors配置:

var cors = require("cors");
app.use(
  cors({
    origin: ["http://localhost:4200", "http://127.0.0.1:4200"],
    credentials: true
  })
);

我尝试登录时遇到的错误是:

 GET http://127.0.0.1:3000/users/user 500 (Internal Server Error)
user:1 Access to XMLHttpRequest at 'http://127.0.0.1:3000/users/user' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

标签: node.jsangularexpresspassport.js

解决方案


// alternatively without using external packages just paste this in your code before your routes

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

  next();
});


推荐阅读