Question

我对我正在设计的简单应用程序的架构有疑问。

我的基于休息的api服务器位于http://localhost:3000的节点中我的客户是在http://localhost:4200

的Angular 2中编写的

在开发我的休息节点api服务器时，我成功实现了使用http://localhost:3000/auth/google测试的护照google身份验证，我被重定向到谷歌登录页面，然后在登录后进一步重定向到我的休息节点api服务的/我的个人资料

现在我正在尝试做同样的事情，但起点是我的角度客户端，它调用节点api服务器来调用google auth。所以我的初始请求从执行http.get的http://localhost:4200 http://localhost:3000/auth/google。希望谷歌认证页面显示我验证，但我得到以下错误

XMLHttpRequest无法加载 https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur ... = 1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com。重定向＆＃39; https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur ... = 1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com＆＃39; 至＆＃39; https://accounts.google.com/ServiceLogin?passive=1209600&continue=https://a ... sercontent.com％26from_login％3D1％26AS％3D60339aeceb428c＆安培;的OAuth = 1＆安培; SARP = 1＆安培; SCC = 1＆＃39; 被CORS政策阻止：No＆＃39; Access-Control-Allow-Origin＆＃39; 标头出现在请求的资源上。起源＆＃39; null＆＃39;是因此不允许访问。

我已将网址包含在授权JavaScript来源下的google auth页面中的两个端口 http://localhost:3000 http://localhost:4200 并在授权重定向URI中我已经包括在内 http://localhost:3000/auth/google/callback

节点api服务器中的代码

app.get（＆＃39; / auth / google＆＃39;，passport.authenticate（＆＃39; google＆＃39;，{范围：[＆＃39;个人资料＆＃39;，＆＃39;电子邮件＆＃39;]}））; app.get（＆＃39; / AUTH /谷歌/回调＆＃39 ;, passport.authenticate（＆＃39; google＆＃39;，{ successRedirect：＆＃39; / profile＆＃39;， failureRedirect：＆＃39; / users＆＃39; }），）;

任何帮助表示赞赏

Answer 1

两件事：因为后端和前端位于不同的端口上，您需要让后端包含CORS header 'Access-Control-Allow-Origin'的回复。如果你使用快递，那会是这样的：

res.header('Access-Control-Allow-Origin', '*');

此外，只需确保浏览器中的地址始终为 http ：// localhost而非文件：// localhost

Answer 2

你所要做的就是发送$window.location.href="URL"

希望有所帮助

使用MEAN堆栈

2 个答案: