【发布时间】:2017-05-31 01:08:25
【问题描述】:
我正在开发一个在服务器上运行 Node/Express 的简单 Web 应用程序,使用 Passport 通过 Google 等进行身份验证。客户端使用 Angular。
我无法让 Angular 与 Passport 配合使用以登录 Google。我的设置如下:
Node/Express/Passport REST 端点:
app.get("/auth/google",
function(req, res, next) {
passport = req._passport.instance;
passport.authenticate("google", { scope: ['https://www.googleapis.com/auth/userinfo.profile', 'https://www.googleapis.com/auth/userinfo.email'] })(req, res, next);
});
客户端...
myModule.controller("myController", function($q, $scope, $http) {
$scope.loginWithGoogle = function() {
$http.get("myDomain/auth/google").then(function(response) {
doStuff();
});
}
...由一个简单的调用:
<button ng-click="loginWithGoogle ()">Login</button>
我得到的错误是 'Access-Control-Allow-Origin' 标头出现在请求的资源上。因此,Origin 'myDomain' 不允许访问。'
但是,如果我直接访问 REST 端点,通过在浏览器中转到 myDomain/auth/google,它可以正常工作。或者我可以制作一个简单的 HTML <a href="/auth/google">Login</a> 并让它工作。所以我猜我的客户端和服务器之间的线路出了点问题。
我已经搜索了解决方案,但找不到任何可行的方法。例如,我阅读了使用 $http.jsonp 而不是 $http.get 的建议。这取得了一些进展——如果用户已经登录到谷歌(通过 gmail、其他应用程序等),那么他们的身份验证就很好。但如果用户尚未登录 Google,我会收到错误 'Uncaught SyntaxError: Unexepected token 。我认为这是 Google 为他们的登录页面发回的 HTML。
有没有办法让 Angular 在这里与 Node/Express/Passport 配合得很好?提前致谢!
【问题讨论】:
-
您是否在服务器的中间件中设置了 CORS 标头以允许所有域或至少您客户端的域?此外,您的 $http.get 中的错字(缺少“)
-
CORS 标头是指:res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE"); res.header("Access-Control-Allow-Headers", "Content-Type", "Authorization");是的,我已经尝试过了,但它们并没有改变我得到的结果。错字 - 已修复,谢谢。那是因为我的编辑隐藏了真实的域。
-
meanjs 有一个很好的样板,可以立即使用。您只需要插入您的 API 凭据。也许看看那里会指出缺少的东西?
标签: javascript angularjs node.js express passport.js