From 6b8c2e62363ca479d2c4d08a771245cf9dec54a1 Mon Sep 17 00:00:00 2001 From: sipp11 Date: Thu, 19 Nov 2015 06:26:52 +0700 Subject: [PATCH] Facebook Javascript SDK implementation --- index.html | 1 - src/components/Login.js | 57 +++++++++++++++++++++++++++++++++ src/constants/LoginConstants.js | 3 +- src/services/AuthService.js | 13 +++++++- 4 files changed, 71 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index cbdc783..af6ccff 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,6 @@
- diff --git a/src/components/Login.js b/src/components/Login.js index 4845409..6acd78f 100644 --- a/src/components/Login.js +++ b/src/components/Login.js @@ -24,6 +24,7 @@ export default class Login extends React.Component { render() { return (
+ {/*

Login

@@ -36,9 +37,65 @@ export default class Login extends React.Component {
+ */} + FB Login
); } + + componentDidMount() { + window.fbAsyncInit = function() { + FB.init({ + appId : '147935535403714', + xfbml : true, + version : 'v2.5' + }); + FB.getLoginStatus(function(response) { + this.statusChangeCallback(response); + }.bind(this)) + }.bind(this) + } + + componentWillMount() { + (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')); + } + + statusChangeCallback(response) { + if (response.status === 'connected') { + var access_token = response.authResponse.accessToken; + Auth.socialLogin('facebook', access_token); + // console.log(access_token); + // FB.api('/me', { locale: 'en_US', fields: 'first_name, email, picture' }, + // function(response) { + // console.log(response); + // Auth.socialLogin('facebook', access_token, response.email, response.first_name); + // } + // ); + } else if (response.status === 'not_authorized') { + console.log('not not_authorized'); + } else { + console.log('not logged into facebook'); + } + } + + checkLoginState() { + FB.getLoginStatus((response) => { + this.statusChangeCallback(response); + }.bind(this)) + } + + handleClickFb() { + FB.login((response) => { + this.statusChangeCallback(response); + }, {scope: 'email', return_scopes: true}); + } + } ReactMixin(Login.prototype, React.addons.LinkedStateMixin); diff --git a/src/constants/LoginConstants.js b/src/constants/LoginConstants.js index b650204..2fb1ec7 100644 --- a/src/constants/LoginConstants.js +++ b/src/constants/LoginConstants.js @@ -2,7 +2,8 @@ var BASE_URL = 'http://rocket.dev/'; export default { BASE_URL: BASE_URL, LOGIN_URL: BASE_URL + 'api-token-auth/', - SIGNUP_URL: BASE_URL + 'users', + SOCIAL_LOGIN_URL: BASE_URL + 'rest-auth/', + SIGNUP_URL: BASE_URL + 'user/', LOGIN_USER: 'LOGIN_USER', LOGOUT_USER: 'LOGOUT_USER' } diff --git a/src/services/AuthService.js b/src/services/AuthService.js index 8d05393..6e819eb 100644 --- a/src/services/AuthService.js +++ b/src/services/AuthService.js @@ -1,6 +1,6 @@ import request from 'reqwest'; import when from 'when'; -import {LOGIN_URL, SIGNUP_URL} from '../constants/LoginConstants'; +import {LOGIN_URL, SIGNUP_URL, SOCIAL_LOGIN_URL} from '../constants/LoginConstants'; import LoginActions from '../actions/LoginActions'; class AuthService { @@ -17,6 +17,17 @@ class AuthService { }))); } + socialLogin(provider, token) { + return this.handleAuth(when(request({ + url: SOCIAL_LOGIN_URL + provider + "/", + method: 'POST', + crossOrigin: true, + data: { + access_token: token + } + }))); + } + logout() { LoginActions.logoutUser(); }