与Facebookcallback函数的CORS错误

我有以下代码:

app.js:

var passport = require('passport') , FacebookStrategy = require('passport-facebook').Strategy , ... passport.serializeUser(function(user, done) { console.log('serializing user') done(null, user); }) passport.deserializeUser(function(obj, done) { console.log('deserializeUser') done(null, obj) }) passport.use(new FacebookStrategy({ clientID: FBAPP.id, clientSecret: FBAPP.secret, callbackURL: "http://www.mylocal.com:3000/auth/facebook/callback" }, function(accessToken, refreshToken, profile, done) { // asynchronous verification, for effect... process.nextTick(function () { return done(null, profile) }) } )) app.get('/auth/facebook', passport.authenticate('facebook', { scope: ['email, user_likes, user_photos, publish_actions'] })) app.get('/auth/facebook/callback', passport.authenticate('facebook', { successRedirect: '/loginsuccess', failureRedirect : '/loginfail' })) app.get('loginsuccess', function(req, res) { console.log('Login success') res.send(200, 'ok') }) app.get('/loginfail', function(req, res) { console.log('Login error') res.send(401, 'error') }) 

angular部分:

 factory('FacebookFactory', ['$http', '$q', function($http, $q) { var get = function() { var deferred = $q.defer(); $http({method: 'GET', url: '/auth/facebook'}). success(function(data, status, headers, config) { deferred.resolve(data); }). error(function(data, status, headers, config) { deferred.reject(data); }); return deferred.promise; }; return { get: get }; }]) 

我总是得到这个错误,并做了几次尝试,但没有成功。

 XMLHttpRequest cannot load https://www.facebook.com/dialog/oauth? response_type=code&redirect_uri=http%… user_likes%2C%20user_photos%2C%20publish_actions&client_id=xxxxxxxxxxx. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '[basic links]http://www.mylocal.com:3000' is therefore not allowed access. 

任何人的想法? 我只是尝试了它的angular度,但它不适用于Safari浏览器,但在Chrome和FF,它完美的作品。

www.mylocal.com:3000 = localhost:3000

       

网上收集的解决方案 "与Facebookcallback函数的CORS错误"

您将无法find客户端语言的解决scheme,因为这构成了一个可以用作恶意攻击的跨源请求。 所以基本上Facebook的端点将需要一个Access-Control-Allow-Origin的头文件集,我不认为他们会很快做到这一点。 我使用API​​很多,经常必须在我的端点设置这些标题,所以我的客户端可以从本地主机或开发url连接:

  if (isset($_SERVER['HTTP_ORIGIN'])): header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}"); header('Access-Control-Allow-Credentials: true'); header('Access-Control-Max-Age: 86400'); endif; if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS'): if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD'])): header('Access-Control-Allow-Methods: GET, POST, OPTIONS, DELETE, PUT'); endif; if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS'])): header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}"); endif; exit(0); endif; 

你也可以在你的$ http broker中试试这个:

  var promise = $http({ method: 'POST', url: 'url_to_api', data: params, headers: { 'Access-Control-Allow-Origin': true, 'Content-Type': 'application/json' } }).success(function (data, status, headers, config) { return data; }); 

我有一个在后端快递的Angular应用程序。 当我用这个HTML点击一个button时:

 <input type="button" ng-click="socialLogIn('facebook')" class="modal-input" value="Sign in with Facebook"> 

它给了我一个CORS错误:

 $scope.socialLogIn = function (social) { return $http.get ('/auth/'+social).success (function (data) { auth.saveToken (data.token); // write data to local storage }); 

问题是,我想获取令牌,以便将其保存在localStorage中。 我确实解决了这个问题,但是解决scheme是全面的。 在socialLogIn函数中,我打开了一个新窗口:

 $scope.socialLogIn = function (social) { var url = 'http://' + $window.location.host + '/auth/' + social; $window.open(url); }; 

在后端快递中,当我从Facebook或Google获得我的“东西”并创build了令牌后,我发回了一些保存令牌的代码,重新加载了父窗口并closures了自己:

 function loginReturn (res, token) { var returnString = '' + '<!DOCTYPE html>\n' + '<html>\n' + '<head>\n' + '<meta charset="UTF-8">\n' + '<title>Login</title>\n' + '</head>\n' + '<body>\n' + '<script type="text/javascript">\n' + 'window.localStorage[\'token\'] = \''+token+'\';\n' + 'window.opener.location.reload(false);\n' + 'window.close();\n' + '</script>\n' + '</body>\n' + '</html>'; res.send(returnString); };