从redirect表示护照authentication空白页面

我使用Facebook的身份validation策略使用护照。 我使用angular度为客户端和服务器端表示。 当用户点击loginFacebook,并成功通过身份validation后,我将redirect回主页面。 但是,当我回来时,我总是得到空白页。 刷新后,页面再次罚款。

这是我的实现:

facebook.js:

'use strict'; var passport = require('passport'), url = require('url'), FacebookStrategy = require('passport-facebook').Strategy, config = require('../config'), user = require('../../app/user/user.server.controller'); module.exports = function() { // Use the Passport's Facebook strategy passport.use(new FacebookStrategy({ clientID: config.facebook.clientID, clientSecret: config.facebook.clientSecret, callbackURL: config.facebook.callbackURL, profileFields: ['id', 'displayName', 'email'], passReqToCallback: true }, function(req, accessToken, refreshToken, profile, done) { // Set the user's provider data and include tokens var providerData = profile._json; providerData.accessToken = accessToken; providerData.refreshToken = refreshToken; var providerUserProfile = { username: profile.displayName, email: profile.email, provider: 'facebook', providerId: profile.id, providerData: providerData }; // Save the user OAuth profile user.saveOAuthUserProfile(req, providerUserProfile, done); } )); }; 

configuration/ passport.js

 'use strict'; var passport = require('passport'), mongoose = require('mongoose'); module.exports = function() { var User = mongoose.model('User'); passport.serializeUser(function(user, done) { done(null, user.id); }); passport.deserializeUser(function(id, done) { User.findOne({ _id: id }, '-password -salt', function(err, user) { done(err, user); }); }); require('./strategies/local.js')(); require('./strategies/twitter.js')(); require('./strategies/facebook.js')(); require('./strategies/google.js')(); }; 

user.server.route.js

 // Invoke 'strict' JavaScript mode 'use strict'; // Load the module dependencies var user = require('./user.server.controller'), passport = require('passport'); // Define the routes module' method module.exports = function(app) { // Set up the 'signup' routes app.route('/signup') .get(user.renderSignup) .post(user.signup); // Set up the 'signin' routes app.route('/signin') .get(user.renderSignin) .post(passport.authenticate('local', { successRedirect: '/', failureRedirect: '/signin', failureFlash: true })); // Set up the Facebook OAuth routes app.get('/oauth/facebook', passport.authenticate('facebook', { failureRedirect: '/signin' })); app.get('/oauth/facebook/callback', passport.authenticate('facebook', { failureRedirect: '/signin', successRedirect: '/' })); // Set up the Twitter OAuth routes app.get('/oauth/twitter', passport.authenticate('twitter', { failureRedirect: '/signin' })); app.get('/oauth/twitter/callback', passport.authenticate('twitter', { failureRedirect: '/signin', successRedirect: '/' })); // Set up the Google OAuth routes app.get('/oauth/google', passport.authenticate('google', { scope: [ 'https://www.googleapis.com/auth/userinfo.profile', 'https://www.googleapis.com/auth/userinfo.email' ], failureRedirect: '/signin' })); app.get('/oauth/google/callback', passport.authenticate('google', { failureRedirect: '/signin', successRedirect: '/' })); // Set up the 'signout' route app.get('/signout', user.signout); }; 

index.ejs

 <!DOCTYPE html> <html xmlns:ng="http://angularjs.org"> <head> <title><%= title %></title> </head> <body> <section ng-view></section> <script type="text/javascript"> window.user = <%- user || 'null' %>; </script> <script type="text/javascript" src="/public/lib/angular/angular.js"></script> <script type="text/javascript" src="/public/lib/angular-route/angular-route.js"></script> <script type="text/javascript" src="/public/lib/angular-resource/angular-resource.js"></script> <script type="text/javascript" src="/public/article/article.client.module.js"></script> <script type="text/javascript" src="/public/article/article.client.controller.js"></script> <script type="text/javascript" src="/public/article/article.client.route.js"></script> <script type="text/javascript" src="/public/article/article.client.resource.js"></script> <script type="text/javascript" src="/public/projectTemplate/projectTemplate.client.module.js"></script> <script type="text/javascript" src="/public/projectTemplate/projectTemplate.client.controller.js"></script> <script type="text/javascript" src="/public/projectTemplate/projectTemplate.client.route.js"></script> <script type="text/javascript" src="/public/projectTemplate/projectTemplate.client.resource.js"></script> <script type="text/javascript" src="/public/projectTemplate/taskTemplate.client.resource.js"></script> <script type="text/javascript" src="/public/index/index.client.module.js"></script> <script type="text/javascript" src="/public/index/index.client.route.js"></script> <script type="text/javascript" src="/public/index/index.client.controller.js"></script> <script type="text/javascript" src="/public/user/user.client.module.js"></script> <script type="text/javascript" src="/public/user/authentication.client.service.js"></script> <script type="text/javascript" src="/public/application.js"></script> </body> </html> 

index.client.view.html:

 <section ng-controller="IndexController"> <div data-ng-show="!authentication.user"> <a href="/signup">Signup</a> <a href="/signin">Signin</a> </div> <div data-ng-show="authentication.user"> <h1>Hello <span data-ng-bind="authentication.user.fullName"></span></h1> <a href="/signout">Signout</a> <ul> <li><a href="/#!/article">List Articles</a></li> <li><a href="/#!/article/create">Create an Article</a></li> </ul> <ul> <li><a href="/#!/projectTemplate">List Project Templates</a></li> <li><a href="/#!/projectTemplate/create">Create a Project Template</a></li> </ul> </div> </section> 

编辑:我正在使用本书的示例代码:

https://www.packtpub.com/books/content/support/17478

你可以在这里下载代码。 select最后一章。 它的Facebook战略有一些错误,你可以注释掉电子邮件字段(参考我上面的代码)

它具有相同的白屏行为。 我曾尝试铬和Safari浏览器。

方法1:你成功redirect到主页 – “/”好像你没有提到主页路由。 在您的主页路线。 你可以console.log('页面命中')来查看redirect时页面是否从服务器呈现

方法2:Facebook将附加到authcallbackurl。 如果您正在使用angular路由,那么可能会将其解释为您未定义的路由,也无法加载页面

Facebook将一个伪造的哈希事物( #_=_ )附加到callbackURL的末尾。 在这里看到Github的问题 。 这混淆了angular度。 你需要一个特殊的情况来处理和/或剥离这个。 Github问题有修复。