Javascript 使用Node JS和Angular JS的Facebook开放式身份验证

我是新的节点和角度编程。我正在尝试使用node和angular js进行开放式身份验证。浏览器控制台引发以下错误-

XMLHttpRequest无法加载…%3A3000%2Auth%2Facebook%2Callback&scope=email&client\u id=。请求的资源上不存在“Access Control Allow Origin”标头。因此，不允许对源“”进行访问。

我使用passport facebook和passport模块进行开放身份验证

代码如下：

server.js

var auth = require('./app/routes/auth');

passport.serializeUser(function(user, done) {
    done(null, user.id);
});

// used to deserialize the user
passport.deserializeUser(function(id, done) {
    User.findById(id, function(err, user) {
        done(err, user);
    });
});
app.use('/auth', auth);

app/routes/auth.js

var express = require('express'),
  passport = require('passport'),  
  router = express.Router(),
  mongoDB = require('mongoDB').MongoClient,
  GoogleStrategy = require('passport-google-oauth').OAuth2Strategy;

require('../configs/passport')(passport, mongoDB);

router.post('/login', 
  passport.authenticate('local', {
    successRedirect: '/profile',
    failureRedirect: '/user/loginFailure'
  })
);

router.get('/facebook', passport.authenticate('facebook', { scope : 'email' }));

    // handle the callback after facebook has authenticated the user
router.get('/facebook/callback',
    passport.authenticate('facebook',
    {
        successRedirect : '/profile',
        failureRedirect : '/'
      }
));

router.get('/loginFailure', function(req, res){
  res.send("Login Failed..");
});

module.exports = router;


var FacebookStrategy = require('passport-facebook').Strategy;
var fbConfig = require("./facebook.json");

module.exports = function(passport){

   passport.use(new FacebookStrategy({       
        clientID        : fbConfig.appID,
        clientSecret    : fbConfig.appSecret,
        callbackURL     : fbConfig.callbackURL

    },    
    function(token, refreshToken, profile, done) {        
        process.nextTick(function() {            
                    var newUser = {};
                    newUser.facebook.id    = profile.id;
                    newUser.facebook.token = token; 
                    newUser.facebook.name  = profile.name.givenName + ' ' + profile.name.familyName;
                    newUser.facebook.email = profile.emails[0].value; 
                        return done(null, newUser);

            });
    }));
};

角度控制器。处理Facebook登录按钮的单击事件

app.controller("authCtrl",["$scope", '$resource', function($scope, $resource){
    $scope.userid = "";
    $scope.password = "";

    $scope.authenticate = function(type){
        if(type === 'local'){
            var login = $resource('http://localhost:3000/auth/login');
            login.save({username: $scope.userid, password: $scope.password });
        }        
        else if(type === 'facebook'){
            var login = $resource('http://localhost:3000/auth/facebook');
            login.get();
        }         
    }
}])

---

请帮助修复此错误。

您是否已将您的应用程序作为有效客户端注册到Facebook？如果是，请确保您的重定向uri已在FB注册为有效的重定向uri。

Facebook身份验证策略要求用户登录Facebook，并允许您的“应用”权限访问您的Facebook帐户信息。XHR无法做到这一点，因为如果用户尚未登录，用户将如何输入其Facebook凭据以登录Facebook？如果通过XHR发送请求，用户将如何批准Facebook“应用程序”请求的权限

---

这适用于所有使用OAuth或OpenID的Passport策略用户的浏览器必须直接转到身份验证提供商的站点，以便他们可以A）登录到身份验证提供商或B）批准您在应用程序中请求的权限。用户完成此操作后，身份验证提供商（在您的情况下是Facebook）将使用某种令牌将用户浏览器重定向回应用程序的端点，然后应用程序将使用该令牌向身份验证提供商请求信息（如电子邮件地址、全名等）

是，我已注册该应用程序。高级选项卡的有效OAuth重定向URI字段中的appID、appSecret和重定向url。这就是正确的做法？是的。有关详细信息，请参阅此链接。请忽略所提供链接中部分的Auth0部分。您收到的错误与跨源资源共享（简称CORS）有关，如果您向FB注册应用程序，则不应发生此错误。yes。我就是这样做的。如果我点击错误中的URL-…%3A3000%2auth%2Ffacebook%2Fcallback&scope=email&client\u id=clientID。它给了我身份验证同意页，并成功地让我登录。k。那么这显然是一个CORS问题。CORS是由浏览器强制执行的，因此，如果您执行来自Postman的相同请求，它就可以正常工作。请参阅这篇关于如何处理CORS的文章。希望这有帮助。这是角度或节点的问题吗？