Windows Phone'da LiveID Authentication

0 dakikada yazıldı

26463 defa okundu

Düzenle

Harici "Identity Provider"ların entegrasyonu çoğu developer için sıkıntılı olabiliyor. Bana gelen sorular arasında da popüper bir yeri ver bu konunun. O nedenle bu yazıda hızlıca bir Windows Phone uygulamasına LiveID Authentication entegrasyonu yapacağız. İlk yapmanız gereken hemen LiveID SDK'i adresinden indirip bilgisayarınıza kurmak. SDK bizim LiveID entegrasyonunu çocuk oyuncağına çevirecek :) Ben bu makaleyi yazarken SDK'in sürümü 5.5 şeklindeydi. Bu sürüm Windows Phone 7.5, 7.8 ve 8.0'ı destekliyor.

LiveSDK'den referansları projeye
ekliyoruz.LiveSDK'den referansları projeye ekliyoruz.

SDK'yi yükledikten sonra yeni bir Windows Phone projesi yarattıktan sonra "Solution Explorer"'da "Add Reference" diyerek yukarıdaki ekran görüntüsünde de görebileceğiniz üzere "Microsoft.Live" ve "Micorosoft.Live.Controls" assemblylerini referans olarak uygulamaya ekliyoruz. Örneğimizde "Live.Controls" içerisindeki kontrollerden birini kullanacağınız ve söz konusu kontrolü XAML tarafındaki kullanabilmek için bu assembly'yi uygun bir XAML NameSpace'ine maplememiz gerekiyor.

[XAML]

<phone:PhoneApplicationPage
    x:Class="LiveIDLogin.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    xmlns:livesdk="clr-namespace:Microsoft.Live.Controls;assembly=Microsoft.Live.Controls"
    shell:SystemTray.IsVisible="True">

Yukarıdaki XAML kodu örnek bir Windows Phone Page'inin en üst markup kısmı. Renkli olan kısım örneği çalıştırmak için eklememiz gereken kısım. Daha önce de bahsettiğimiz gibi yeni bir XAML NameSpace'i yaratarak arkada referans olarak eklediğimiz Assembly'yi bu NameSpace'e bağlıyoruz. Böylece bu Assembly içerisindeki nesneleri XAML tarafında da tanımlayabileceğiz.

[XAML]

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <livesdk:SignInButton Name="btnSignin" 
                          ClientId="CLIENT_ID" 
                          Scopes="wl.signin wl.basic" 
                          Branding="MicrosoftAccount" 
                          TextType="SignIn" 
                          SessionChanged="btnSignin_SessionChanged" 
                          HorizontalAlignment="Left"
                          VerticalAlignment="Top" />
</Grid>

Bir sonraki adım artık "Live.Controls" altından SignInButton kontrolünü ekrana almak. Bu düğme kendi içerisinde LiveID Login ekranını açma ve tüm süreci kontrol etme özelliğine sahip. Normal şartlarda, yani eskiden olsa bizim gidip bir tarayıcı kontrolünü ekrana koymamız, gerekli navigasyonları sağlamamız ve tokenı ele geçirmemiz gerekirdi. "SignInButton"'ın yardımı ile artık bunların hiçbiri ile uğraşmamız gerekmiyor. SignInButton'un özellikleri arasında dikkatinizi çekti ise "Scopes" diye bir değer var. Buradaki değerler aslında sizin Login olan LiveID kullanıcısının hangi bilgilerine ulaşabileceğinizi tanımlıyor. İsterseniz tüm scope'ların bir listesine buradan ulaşabilirsiniz. Bu noktada önemli olan şey olabildiğince düşük bir scope tercih etmeniz. İhtiyacınız olmayan bilgileri istememenizde fayda var. Sonuç itibari ile kullanıcılar bu bilgileri istediğinizi LiveID Login ekranında görecekler ve istediğiniz bilgileri genişliği kullanıcıların Login olmaktan vaz geçmesine de neden olabilir.

CLIENT_ID derken?

Erken davranıp yukarıdaki kodu çalıştıran oldu ise tabi ki hata aldılar. Bahsetmediğimiz çok kritik bir nokta var. XAML kodu içerisinde SignInButton'ın özelliklerinden biri de "ClientId" özelliği. Buraya aslında LiveID Authentication servislerine ulaşabilmek için özel bir ulaşım anahtarı girmemiz gerekiyor. Bu anahtarı tabi ki ben sizlerle paylaşmayacağım :) Herkesin kendisinin gidip alması gerekecek. O nedenle gelin daha fazla ilerlemeden önce bu anahtarı nasıl alabileceğimize göz atalım.

İlk yapmanız gereken Live Connect Management sayfasına gidip uygulamanızın yöneticisi olacak olan LiveID ile login olmak. Söz konusu LiveID uygulamnın Live servislerini kullanabilmesi için gerekli bağlantıyı yönetecek olan LiveID olacak. Bu şirketinizin bir LiveID'si veya basit bir şekilde sizin developer LiveID'niz olabilir. Login olduktan sonra "Create Application" diyerek devam edebilirsiniz.

LiveID Erişimi için uygulamamızı
tanımlıyoruz.LiveID Erişimi için uygulamamızı tanımlıyoruz.p>

Bir sonraki ekran aynen yukarıdaki gibi uygulama bilgilerinizi gireceğiniz ekran olacak. Buradaki bilgilerde gireceğiniz uygulama adı "LiveLogin" ekranında gözükecektir. Sözleşmeyi kabul edip bir sonraki ekrana geçtiğinizde uygulamanız tanımlanmış olacak. Eğer isterseniz uygulamanız için bir logo yükleyebilir, kullanıcı sözleşmesinin linklerini de verebilirsiniz. Bunların hepsi LiveLogin ekranında gösterilir.

Mobile uyumluluğunu aktif hale
getirelim.Mobile uyumluluğunu aktif hale getirelim.

Uygulamayı tanımladıktan sonra yapmamız gereken son bir ayar da "API Settings" kısmında mobil erişimi açmak olacak. Bu işlem de tamamlandıktan sonra "App Settings" kısmına geçerek "ClientID"nizi edinebilirsiniz. Buradan aldığınız ClientID'yi bizim SignInButton'un ClientID özelliğine yazmanız gerekecek.

[C#]

    private Microsoft.Live.LiveConnectClient client;
    private async void btnSignin_SessionChanged(object sender, 
                        Microsoft.Live.Controls.LiveConnectSessionChangedEventArgs e)
    {
        if (e.Status == Microsoft.Live.LiveConnectSessionStatus.Connected)
        {
            client = new Microsoft.Live.LiveConnectClient(e.Session);
            Microsoft.Live.LiveOperationResult operationResult = await client.GetAsync("me");
            try
            {
                dynamic sonuc = operationResult.Result;
                if (sonuc.first_name != null &&
                    sonuc.last_name != null)
                {
                    MessageBox.Show(
                        string.Format("Merhaba {0} {1}!", sonuc.first_name, sonuc.last_name));
                }
                else
                {
                    MessageBox.Show("Merhaba isimsiz kullanıcı!");
                }
            }
            catch (Microsoft.Live.LiveConnectException exception)
            {
                //API'larda problem oldu bir şeyler yapmak gerek.
            }
        }
        else
        {
            MessageBox.Show("Login gerçekleşmedi");
        }
    }

Son olarak SignInButton'ın SessionChanged eventine de login sonrası çalışacak kodlarımızı yazıyoruz. Login sonrası esasen biz bir LiveID Session geliyor. Bu session'ı kullanarak ek bilgiler alabiliyoruz. Bizim örneğimizde "Me" üzerinden giderek kişinin profil bilgilerini istiyoruz.

LiveID'den gelen basit profil
bilgileri.LiveID'den gelen basit profil bilgileri.

Bu noktada kişi bilgilerini almanın yanı sıra bu LiveID credential'ını kendi profil yapınızla birleştirmek de isteyebilirsiniz. Bunu yapabilmek için kullanacağınız unique identifier adından da anlaşılacağı üzere "ID" field'i olacak.

Makaledeki örneğin kodlarına github üzerinden ulaşabilirsiniz.

Görüşmek üzere.