0

나는 또한 건물중인 Node.js/Restify 웹 서비스와 상호 작용할 크롬 확장을 구축 중입니다. passport.js를 사용하여 사용자가 Facebook에 접속하여 인증 할 수있는 몇 개의 API 끝점을 만들었습니다. 그러나 크롬 확장 프로그램이 실행되면 아약스를 통해 내 Facebook 인증 엔드 포인트를 요청할 때 모든 종류의 CORS 문제가 있음을 깨달았습니다.Chrome 확장 프로그램에서 Facebook으로 인증하는 가장 좋은 방법은 무엇입니까?

온라인으로 문제를 조사한 후 대부분의 사람들이 클라이언트 측에서 Facebook 인증을 모두하는 것처럼 보입니다. 이제는 클라이언트 측 Facebook 인증을 사용하도록 확장 프로그램을 다시 작성하고 Restify API를 통해 진행되는 모든 항목 (Facebook 제외)을 유지할 것입니다.

server.get('/facebook_login/callback', auth.authenticate({ 
    failureRedirect: '/error', 
    scope: [ 
    auth.fbPermissions.email, 
    auth.fbPermissions.publicProfile 
    ] 
}), function(req, res, next) { 
    res.redirect('/', next); 
}); 

server.get('/facebook_login', auth.authenticate({ 
    failureRedirect: '/error', 
    scope: [ 
    auth.fbPermissions.email, 
    auth.fbPermissions.publicProfile 
    ] 
})); 

그리고 확장의 유일한 자바 스크립트 코드는 다음과 같습니다 :

내 페이스 북 인증 엔드 포인트

는 다음과 같이

document.addEventListener('DOMContentLoaded', function() { 
    window.open("http://localhost:8080/facebook_login"); 
}); 

사람이 작업 이러한 방법 중 하나를받은 경우, 알려주세요 . 어떤 도움을 주셔서 감사합니다!

+1

_ "모든 종류의 CORS 문제가 있음을 깨달았습니다."- 당신이 의미하는 바를 분명히해야합니다. CORS는 일반적으로 확장을위한 문제가 아닙니다. 또한 'chrome.identity'를 확인하십시오. – Xan

+0

@Xan CORS 오류를 재현하기 위해 내 코드를 변경 한 후에 새 창에서 로그인 URL을 연 경우 더 이상 CORS 오류를 표시하지 못한다는 사실을 깨달았습니다. 또한,'chrome.identity'는 유용하게 보이므로 그 충고에 감사드립니다. –

답변

0

새 창에서 facebook_login 페이지를 열어이 작업을 수행 할 수있었습니다. 이제는 서버 측 Facebook 로그인을 유지할 것 같습니다.

+1

Wise : 클라이언트 측 로그인은 API 키를 추출하기 쉽습니다. – Xan