Подключаем Facebook SDK для Xamarin.Forms

Социальные сети, и особенно Facebook, уже давно используются в мобильных приложениях. Сегодня мы рассмотрим, как подключить нативные Facebook SDK к проекту на базе Xamarin.Forms (iOS и Android) для удобной авторизации пользователей и получения о них базовой информации. Вы также легко сможете расширить описанные в статье методы для того, чтобы реализовать полноценное взаимодействие с этим замечательным сервисом. Тема простая и понятная, поэтому без теорий и прелюдий перейдем сразу к практике.

65cd3dc4255c46e2b669fc90b0c251d7.jpg

Создаем приложение в Facebook


Для тех, кто впервые создает своё приложение в Facebook, мы кратко расскажем о том, как это делается.

Сам по себе процесс это довольно простой и потребует от вас следующих данных:

  • Package Name для Android-проекта (например, com.binwell.login)
  • Bundle Identifier для iOS-проекта (например, com.binwell.login)

Для Android ещё потребуются Key Hashes, которые можно получить командой:

Windows:

keytool -exportcert -alias androiddebugkey -storepass android -keystore C:\Users\[USERNAME]\AppData\Local\Xamarin\Mono for Android\debug.keystore | openssl sha1 -binary | openssl base64

macOS:
keytool -exportcert -alias androiddebugkey -storepass android -keystore /Users/[USERNAME]/.local/share/Xamarin/Mono for Android/debug.keystore | openssl sha1 -binary | openssl base64

Вместо [USERNAME] необходимо подставить ваше имя пользователя в системе. Плюс можно прописать путь до openssl, если путь до него не указан в PATH. Скачать openssl для Windows можно здесь.

На выходе мы и получим нужные Key Hashes следующего вида: kGP2WMxohvxm/NiwR7H+Eb3/8qw=

Теперь заходим на сайт и создаём новое приложение. Отдельно для iOS и Android. При создании приложения мы можем использовать режим с подсказками (Quick Start), где дополнительно описано как настроить проект. Из этого руководства нам и потребуются примеры кода.

cfc01f0b5b1142488b1dc28f70dce027.jpg

67a29255dd2b45f0a7ab5304c52138d4.jpg

Подключаем Facebook SDK к проектам iOS и Android


Для начала необходимо установить пакеты Facebook SDK от Xamarin для iOS и Android из Nuget:

18e51b7fcaea4f689dbc9525013705f4.jpg

Обратите внимание, что с Xamarin.Forms 2.3 на текущий момент совместима только версия Xamarin.Facebook.Android 4.11.0.1. Версия Xamarin.Facebook.iOS ограничений по совместимости не имеет.

Подключаем в Android


Для начала нам необходимо прописать специальные значения в файле Resources/values/strings.xml:
1102463466549096
fb1102463466549096

Где, 1102463466549096 это ваш App ID из настроек приложения Facebook. Дополнительно нам потребуется внести следующие изменения в AndroidManifest.xml:
  
  
  
  
    
    
      
        
        
        
        
      
    
    
  

Далее вносим небольшие доработки в MainActivity.cs:
protected override void OnCreate(Bundle bundle)
        {
            TabLayoutResource = Resource.Layout.Tabbar;
            ToolbarResource = Resource.Layout.Toolbar;

            base.OnCreate(bundle);
            FacebookSdk.SdkInitialize(ApplicationContext);
            Forms.Init(this, bundle);
            LoadApplication(new App());
        }

        protected override void OnResume()
        {
            base.OnResume();
            AppEventsLogger.ActivateApp(Application);
        }

На этом первичная инициализация Facebook SDK завершена.

Подключаем в iOS


По аналогии с Android, нам будет необходимо внести правки в файл Info.plist, вставить следующие строки между ...:
CFBundleURLTypes

  
  CFBundleURLSchemes
  
    fb1102463466549096
  
  

FacebookAppID
1102463466549096
FacebookDisplayName
Binwell Social Demo
LSApplicationQueriesSchemes

  fbapi
  fb-messenger-api
  fbauth2
  fbshareextension

NSAppTransportSecurity

	NSExceptionDomains
	
		facebook.com
		
			NSIncludesSubdomains
			
			NSThirdPartyExceptionRequiresForwardSecrecy
			
		
		fbcdn.net
		
			NSIncludesSubdomains
			
			NSThirdPartyExceptionRequiresForwardSecrecy
			
		
		akamaihd.net
		
			NSIncludesSubdomains
			
			NSThirdPartyExceptionRequiresForwardSecrecy
			
		
	

И немного кода в AppDelegate.cs:
public override bool FinishedLaunching(UIApplication app, NSDictionary options)
        {
            Xamarin.Forms.Forms.Init();
            LoadApplication(new App());
            Facebook.CoreKit.Profile.EnableUpdatesOnAccessTokenChange(true);            Facebook.CoreKit.ApplicationDelegate.SharedInstance.FinishedLaunching(app, options);

            return base.FinishedLaunching(app, options);
        }

        public override bool OpenUrl(UIApplication application, NSUrl url, string sourceApplication, NSObject annotation)
        {
            return Facebook.CoreKit.ApplicationDelegate.SharedInstance.OpenUrl(application, url, sourceApplication, annotation);
        }

        public override void OnActivated(UIApplication application)
        {
            Facebook.CoreKit.AppEvents.ActivateApp();
        }

На этом предварительная подготовка завершена и мы можем переходить к использованию Facebook SDK в нашем приложении.

Интегрируем с Xamarin.Forms


Использовать Facebook SDK мы будем через механизм DependencyService. Для этого в первую очередь опишем нужные данные и интерфейс сервиса:
public interface IFacebookService
    {
        Task Login();
        void Logout();
    }

    public enum LoginState
    {
        Failed,
        Canceled,
        Success
    }

    public class LoginResult
    {
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Email { get; set; }
        public string ImageUrl { get; set; }
        public string UserId { get; set; }
        public string Token { get; set; }
        public DateTimeOffset ExpireAt { get; set; }
        public LoginState LoginState { get; set; }
        public string ErrorString { get; set; }
    }

Одной из целей подключения социальных сетей является возможность простого и удобного получения пользовательских данных, поэтому нам потребуется дополнительный запрос для получения email, который Facebook не отдает по умолчанию. Данные запросы будет необходимо реализовать отдельно для каждой платформы.

Реализация для Android


Для Android реализация интерфейса выглядит следующим образом:
[assembly: Dependency(typeof(AndroidFacebookService))]
namespace Login.Droid
{
    public class AndroidFacebookService: Java.Lang.Object, IFacebookService, GraphRequest.IGraphJSONObjectCallback, GraphRequest.ICallback, IFacebookCallback
    {
        public static AndroidFacebookService Instance => DependencyService.Get() as AndroidFacebookService;

        readonly ICallbackManager _callbackManager = CallbackManagerFactory.Create();
        readonly string[] _permissions = { @"public_profile", @"email", @"user_about_me" };

        LoginResult _loginResult;
        TaskCompletionSource _completionSource;

        public AndroidFacebookService()
        {
            LoginManager.Instance.RegisterCallback(_callbackManager, this);
        }

        public Task Login()
        {
            _completionSource = new TaskCompletionSource();
            LoginManager.Instance.LogInWithReadPermissions(Forms.Context as Activity, _permissions);
            return _completionSource.Task;
        }

        public void Logout()
        {
            LoginManager.Instance.LogOut();
        }

        public void OnActivityResult(int requestCode, int resultCode, Intent data)
        {
            _callbackManager?.OnActivityResult(requestCode, resultCode, data);
        }

        public void OnCompleted(JSONObject data, GraphResponse response)
        {
            OnCompleted(response);
        }

        public void OnCompleted(GraphResponse response)
        {
            if (response?.JSONObject == null)
                _completionSource?.TrySetResult(new LoginResult {LoginState = LoginState.Canceled});
            else
            {
                _loginResult = new LoginResult
                {
                    FirstName = Profile.CurrentProfile.FirstName,
                    LastName = Profile.CurrentProfile.LastName,
                    Email = response.JSONObject.Has("email") ? response.JSONObject.GetString("email") : string.Empty,
                    ImageUrl = response.JSONObject.GetJSONObject("picture")?.GetJSONObject("data")?.GetString("url"),
                    Token = AccessToken.CurrentAccessToken.Token,
                    UserId = AccessToken.CurrentAccessToken.UserId,
                    ExpireAt = FromJavaDateTime(AccessToken.CurrentAccessToken?.Expires?.Time),
                    LoginState = LoginState.Success
                };

                _completionSource?.TrySetResult(_loginResult);
            }
        }

        public void OnCancel()
        {
            _completionSource?.TrySetResult(new LoginResult { LoginState = LoginState.Canceled });
        }

        public void OnError(FacebookException exception)
        {
            _completionSource?.TrySetResult(new LoginResult
            {
                LoginState = LoginState.Failed,
                ErrorString = exception?.Message
            });
        }

        public void OnSuccess(Java.Lang.Object result)
        {
            var facebookLoginResult = result.JavaCast();
            if (facebookLoginResult == null) return;

            var parameters = new Bundle();
            parameters.PutString("fields", "id,email,picture.type(large)");
            var request = GraphRequest.NewMeRequest(facebookLoginResult.AccessToken, this);
            request.Parameters = parameters;
            request.ExecuteAsync();
        }

        static DateTimeOffset FromJavaDateTime(long? longTimeMillis)
        {
            var epoch = new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc);
            return longTimeMillis != null ? epoch.AddMilliseconds(longTimeMillis.Value) : DateTimeOffset.MinValue;
        }
    }
}

Дополнительно потребуется добавить обработчик в MainActivity.cs:
protected override void OnActivityResult(int requestCode, Result resultCode, Intent data)
        {
            base.OnActivityResult(requestCode, resultCode, data);
            AndroidFacebookService.Instance.OnActivityResult(requestCode, (int)resultCode, data);
        }

Реализация для iOS


Делаем реализацию интерфейса для Facebook iOS SDK.
[assembly: Dependency(typeof(AppleFacebookService))]
namespace Login.iOS
{
    public class AppleFacebookService: IFacebookService
    {
        readonly LoginManager _loginManager = new LoginManager();
        readonly string[] _permissions = { @"public_profile", @"email", @"user_about_me" };

        LoginResult _loginResult;
        TaskCompletionSource _completionSource;

        public Task Login()
        {
            _completionSource = new TaskCompletionSource();
            _loginManager.LogInWithReadPermissions(_permissions, GetCurrentViewController(), LoginManagerLoginHandler);
            return _completionSource.Task;
        }

        public void Logout()
        {
            _loginManager.LogOut();
        }

        void LoginManagerLoginHandler(LoginManagerLoginResult result, NSError error)
        {
            if (result.IsCancelled)
                _completionSource.TrySetResult(new LoginResult {LoginState = LoginState.Canceled});
            else if (error != null)
                _completionSource.TrySetResult(new LoginResult { LoginState = LoginState.Failed, ErrorString = error.LocalizedDescription });
            else
            {
                _loginResult = new LoginResult
                {
                    Token = result.Token.TokenString,
                    UserId = result.Token.UserID,
                    ExpireAt = result.Token.ExpirationDate.ToDateTime()
                };

                var request = new GraphRequest(@"me", new NSDictionary(@"fields", @"email"));
                request.Start(GetEmailRequestHandler);
            }
        }

        void GetEmailRequestHandler(GraphRequestConnection connection, NSObject result, NSError error)
        {
            if (error != null)
                _completionSource.TrySetResult(new LoginResult { LoginState = LoginState.Failed, ErrorString = error.LocalizedDescription });
            else
            {
                _loginResult.FirstName = Profile.CurrentProfile.FirstName;
                _loginResult.LastName = Profile.CurrentProfile.LastName;
                _loginResult.ImageUrl = Profile.CurrentProfile.ImageUrl(ProfilePictureMode.Square, new CGSize()).ToString();

                var dict = result as NSDictionary;
                var emailKey = new NSString(@"email");
                if (dict != null && dict.ContainsKey(emailKey))
                    _loginResult.Email = dict[emailKey]?.ToString();

                _loginResult.LoginState = LoginState.Success;
                _completionSource.TrySetResult(_loginResult);
            }
        }

        static UIViewController GetCurrentViewController()
        {
            var viewController = UIApplication.SharedApplication.KeyWindow.RootViewController;
            while (viewController.PresentedViewController != null)
                viewController = viewController.PresentedViewController;
            return viewController;
        }
    }
}

Подключаем в Xamarin.Forms


Для доступа к созданным реализациям достаточно вставить следующий обработчик события Clicked для кнопки «Facebook Login»:
var loginResult = await DependencyService.Get().Login();

                switch (loginResult.LoginState)
                {
                    case LoginState.Canceled:
                        // Обработать
                        break;
                    case LoginState.Success:
                        var str = $"Hi {loginResult.FirstName}! Your email is {loginResult.Email}";
                        break;
                    default:
                        // Обработать ошибки
                        break;
                }

На этом кодирование завершено!

Используем


Итак, волнительный момент. Делаем сборку, запускаем и… легко авторизуемся с помощью нативных SDK.

34367a2299cd490cbbfb21bbe53bc4fd.jpg

Полный код проекта с пошаговыми изменениями расположен в репозитории на Bitbucket.

Итак, сегодня мы подключили нативные Facebook SDK к приложению на Xamarin.Forms. Уже работает авторизация и получение базовой информации о пользователе, но при желании вы можете легко расширить набор доступных методов для доступа ко всем возможностям Facebook SDK, доступным на каждой из платформ. В следующий раз мы возьмем задачку поинтересней и подключим нативные ВКонтакте SDK.

Оставайтесь на связи, задавайте ваши вопросы в комментариях и вступайте в группу Xamarin Developers в Telegram!

Об авторе


f70e9ce7a2bd45a98e19652a08b15e26.JPG Вячеслав Черников — руководитель отдела разработки компании Binwell. В прошлом — один из Nokia Champion и Qt Certified Specialist, в настоящее время — специалист по платформам Xamarin и Azure. В сферу mobile пришел в 2005 году, с 2008 года занимается разработкой мобильных приложений: начинал с Symbian, Maemo, Meego, Windows Mobile, потом перешел на iOS, Android и Windows Phone.

Предыдущие части


1. Быстрое создание MVP (minimum viable product) на базе Microsoft Azure и Xamarin.Forms.
2. Готовим Xamarin.Forms: настройка окружения и первые шаги.
3. Повышаем эффективность работы в Xamarin.Forms.
4. Работаем с состояниями экранов в Xamarin.Forms.
5. Удобный REST для Xamarin-приложений.

Комментарии (0)

© Habrahabr.ru