node.js - 从 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.
解决方案
// 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();
});
推荐阅读
- node.js - 如何使用 json2csv 创建文件并将其上传到 Firebase 存储
- scala - 以日期为键在 Seq 上滚动总和
- neo4j - 如何使用 Cypher 递归更新项目计划图
- reactjs - 移动菜单效果扩展到桌面视图
- css - 如何 XHTML-CSS 盒子模型
- python - Stripe create customer for one time charge
- react-native - 导航到同一屏幕时不会触发 React Navigation v4 生命周期事件
- xpath - Xpath 获取文本
- node.js - 使用 Firebase 云功能验证 Firebase 应用中是否存在电话号码
- awesome-wm - 在 `awful.layout.suit.max` 布局中聚焦一个新客户端