API/Facebook 페이스북
SNS 로그인 기능 구현 하기 페이스북 (JSP, javascript)
KIMSG
2017. 7. 20. 15:32
https://developers.facebook.com/docs/facebook-login
앱이나 웹사이트에 Facebook 로그인 추가
https://developers.facebook.com/docs/facebook-login/web 에서 맨 마지막에 있는 코드를 따라해도 됩니다. (잘 모르겠다면....)
중요한 권한 추가하기.... email을 가져오기 위해선 혹은 기타 다른 사용자 정보를 가져오기 위해서는 아래와 같이 ~을 가져오겠다고 선언을 하고 넘어가야 합니다.
FB.login(function(response) { console.log(response); }, {scope: 'email'});
정보를 하나씩 빼오는 방법을 잘 몰라서 아래처럼 뽑았는데
다른분들은 어떻게 했는지 궁금하다
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId : '키입력',
xfbml : true,
version : 'v2.9'
});
FB.AppEvents.logPageView();
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
}
else {
FB.login(function(response) {
// handle the response
}, {scope: 'public_profile, email, user_birthday '});
}
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
function statusChangeCallback(response) {
if (response.status === 'connected') {
testAPI();
} else {
document.getElementById('status').innerHTML = 'Please log into this app.';
}
}
function testAPI() {
FB.api('/me', function(response) {
console.log(response.id);
console.log(response.name);
});
FB.api('/me/picture?type=large',function(response){
console.log(response.data.url);
});
FB.api('/me', {fields: 'email'}, function(response) {
console.log(response.email);
});
FB.api('/me', {fields: 'age_range '}, function(response) {
console.log(response.age_range );
});
FB.api('/me', {fields: 'gender '}, function(response) {
console.log(response.gender );
});
FB.api('/me', {fields: 'locale '}, function(response) {
console.log(response.locale );
});
}
</script>
<fb:login-button scope="public_profile,email" onlogin="checkLoginState();">
</fb:login-button>