कोणीय/नोड/एक्सप्रेस/पासपोर्ट क्रॉस-डोमेन समस्या - CORS पासपोर्ट फेसबुक प्रमाणीकरण

Question

दो दिन और एक लाख की कोशिश करता है जब फेसबुक NodeJS/एक्सप्रेस में पासपोर्ट का उपयोग कर के साथ एक उपयोगकर्ता को प्रमाणित करने की कोशिश कर CORS सक्षम करने के लिए किया गया है सक्षम करें।

XMLHttpRequest cannot load https://www.facebook.com/dialog/oauth?response_type=code&redirect_uri=http%…%3A8080%2Fauth%2Ffacebook%2Fcallback&scope=email&client_id=598171076960591. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:8080' is therefore not allowed access. 

मार्गों का उपयोग मैं

कि के रूप में सरल कर रहे हैं::

// ===================================== 
// FACEBOOK ROUTES ===================== 
// ===================================== 
// route for facebook authentication and login 

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

// handle the callback after facebook has authenticated the user 
app.get('/auth/facebook/callback', 
    passport.authenticate('facebook', { 
     successRedirect : '/home', 
     failureRedirect : '/login' 
    })); 

यह कैसे मार्ग मेरी AngularJS फ़ाइल पर कहा जाता है (मैं

त्रुटि मैं क्रोम पर मिलता है सच):

$http.get('/auth/facebook') 
    .success(function(response) { 

    }).error(function(response){ 

    }); 

मैं एक दर्जन से अधिक समाधान है कि मैं यहां पाया की कोशिश की है 'भी स्थापित करने की कोशिश की withCredentials किया है StackOverflow और अन्य मंचों पर।

1. मैं routes.js फाइलों पर पर इस जोड़ने मेरी मार्गों से पहले की कोशिश की:

   app.all('*', function(req, res, next) { 
       res.header('Access-Control-Allow-Origin', '*'); 
       res.header("Access-Control-Allow-Headers", "Content-Type,X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Date, X-Api-Version, X-File-Name"); 
       res.header('Access-Control-Allow-Methods', 'GET,POST,PUT,HEAD,DELETE,OPTIONS'); 
       res.header('Access-Control-Allow-Credentials', true); 
   
       if ('OPTIONS' == req.method) { 
        res.send(200); 
       } else { 
        next(); 
       } 
   }); 
   

2. मैं server.js फ़ाइल पर यह जोड़ने की कोशिश की (ध्यान दें कि मैं setHeader लेकिन मैं करने के लिए शीर्ष लेख बदल दोनों की कोशिश की 'किया है):

   app.use(function(req, res, next) { 
       res.setHeader('Access-Control-Allow-Origin', '*'); 
       res.setHeader('Access-Control-Allow-Headers', 'Content-Type,X-Requested-With'); 
       res.setHeader('Access-Control-Allow-Methods', 'GET,POST,PUT,HEAD,DELETE,OPTIONS'); 
       res.setHeader('Access-Control-Allow-Credentials', true); 
   
       if ('OPTIONS' == req.method) { 
       res.send(200); 
       } else { 
       next(); 
       } 
   
   }); 
   
   require('./app/routes.js')(app, passport); 
   

3. मैं अपने app.js फ़ाइल पर यह जोड़ने की कोशिश की (AngularJS विन्यास):

   $httpProvider.defaults.useXDomain = true; 
   delete $httpProvider.defaults.headers.common['X-Requested-With']; 
   $httpProvider.defaults.withCredentials = true; 
   

वैसे भी, मुझे नहीं पता कि और क्या करना है। ऑनलाइन जो कुछ भी मैंने पाया वह काम नहीं किया। क्या AngularJS रूटिंग का उपयोग कर मेरे साथ कुछ करने का मौका है? मुझे कोई कारण नहीं दिखता कि इससे कोई फर्क नहीं पड़ता, लेकिन मैं थोड़े अनुमानों से बाहर भाग गया।

मेरे स्थिति बहुत इस एक के समान है: Angular/Node/Express/Passport - Issues when connecting to facebook(CORS)

अग्रिम धन्यवाद!

Answer 1

मुझे फेसबुक लॉगिन और कॉर्स के साथ भी समस्या थी, लेकिन नोडजेएस/एक्सप्रेस में पासपोर्ट के साथ नहीं, मेरा आवेदन जावा (वसंत एमवीसी) + कोणीय है। मैं अपने प्रारंभिक अमेरिकन प्लान लॉगिन समारोह को संशोधित समस्या पर पारित करने के प्रबंधित किया है:

$scope.loginWithFacebook = function() { 
    $http({ 
     method: 'GET', 
     url: 'auth/facebook', 
     dataType: 'jsonp' 
    }).success(function(data){ 
     console.log('loginWithFacebook success: ', data); 
    }).error(function(data, status, headers, config) { 
     console.log('loginWithFacebook error: ', data); 
    }); 
} 

साथ

$scope.loginWithFacebook = function() { 
    $window.location = $window.location.protocol + "//" + $window.location.host + $window.location.pathname + "auth/facebook"; 
}; 

आशा है कि यह मदद करता है!

Answer 2

मुझे यह समस्या हो रही थी और लगभग उस बिंदु तक पहुंचा जहां मुझे विश्वास था कि मुझे कोई समाधान नहीं मिला, लेकिन फिर एक साधारण ट्यूटोरियल को देखकर (http://mherman.org/blog/2013/11/10/social-authentication-with-passport-dot-js/) ने इसे मेरे लिए हल किया। मैं Node.js करने कोणीय से एक API कॉल है, जो हमेशा क्या आप सर्वर, CORS या नहीं पर कॉन्फ़िगर के बावजूद आप उन XMLHttpRequest त्रुटियों लाने के लिए जा रहा है बनाने की कोशिश कर रहा था! CORS स्थिरता नहीं है - अगर आप अपने Chrome नेटवर्क कंसोल खोला, तो आप पाएंगे कि गूगल या फेसबुक या जो कुछ भी 3 पार्टी साइट के लिए आपके अनुरोध अपने नियंत्रण को बदलने के लिए से बाहर है - यह एक 302 रीडायरेक्ट कि वापस करने के लिए भेजा गया था से ट्रिगर किया गया था अपने दृश्यपटल, कुछ है कि Angular.js या किसी अन्य ढांचे को नियंत्रित करने के कोई शक्ति नहीं है, इस प्रकार आप वास्तव में नहीं जोड़ सकते हैं कि अनुरोध करने के लिए वैसे भी "अभिगम नियंत्रण की अनुमति दें उत्पत्ति"।

समाधान केवल बटन या टेक्स्ट बनाने के लिए है जो "एक _____ के साथ साइन इन करें" लिंक कहता है। एक शाब्दिक <a href="/auth/facebook"></a> लिंक। बस।

बेशक, मैंने प्रक्रिया में कई अन्य ठोकरें और गेटचा भी मुलाकात की। मैंने passport.authenticate ('facebook') के लिए डिफ़ॉल्ट मिडलवेयर का उपयोग करने की कोशिश नहीं की, लेकिन इसे function(req, res, next){ ... } में लपेटने की कोशिश की, यह सोचकर कि कुछ ऐसा होगा, लेकिन ऐसा नहीं है।

Answer 3

इसके बजाय जीईटी अनुरोध करने के लिए एक HTML टैग बनाएं, फेसबुक XMLHttpsRequests की अनुमति नहीं देता है।

तो जैसा: <a href="http://localhost:8080/auth/facebook">sign in with facebook</a>

की