Laravel Facebook Login (Socialite Provider)

Merhabalar,

bu yazımda Laravel 5 üzerinde Laravel’in kendi yayımladığı bir paket olan Socialite Provider ile Facebook Login olayının nasıl yapıldığını anlatmaya çalışacağım.

Provider Nedir?

Provider’ın türkçe karşılığı “sağlayıcı”dır. Laravel üzerindeki Provider’ların da yaptığı temel işlem tam olarak budur. Size bir servisin sağlayıcılığını yaparlar.

Socialite Nedir?

Socialite, Laravel tarafından yayınlanan, $site = [‘Facebook’, ‘Twitter’, ‘GitHub’, ‘Google Plus’]; gibi sitelerin API’larını kullanarak $site’ların API’ları üzerinden işlem yapılabilinmesini sağlayan bir sağlayıcıdır (provider’dır).

Socialite’ın kullanabileceğimi 5 adet default user method’u vardır. Bunlar;

  • getId();
  • getNickname();
  • getName();
  • getEmail();
  • getAvatar();

dır.

1. Kurulum part.1

Gerçi Laravel’in kurulumunu anlatmaya gerek yok, bu yazıyı okuyan birisi zaten Laravel’in ne olduğu biliyordur ama ben yinede en baştan alayım.

element@ry:~$ cd /var/www/html/
element@ry:/var/www/html$ laravel new laravel
element@ry:/var/www/html$ cd laravel/

Yukarıdaki komutlar ile Laravel kurulmuş oldu. Laravel’de default auth sistemini kurduğunuzu varsayıyorum. Eğer olurda kurulmamış ise aşağıdaki artisan komutu ile kurulabilir.

element@ry:/var/www/html/laravel$ php artisan make:auth

Sistem hazır. Laravel’in ayağı kaldırılması gerekiyor. Aşağıdaki artisan komutu ile sistem ayağı kaldırılabilir.

element@ry:/var/www/html/laravel$ php artisan serve --host localhost --port 80

* Artisan’ın serve komutu sadece development ortamında kullanılmalıdır. Production ortamında apache, nginx gibi bir servis ile çalışılmalıdır.
** Development ortamınızda hali hazırda 80 portunu kullanan apache, nginx veya farklı bir web servisi varsa servis durdurulmalıdır. Web servisini durdurmak için aşağıdaki komut kullanılmalıdır.

element@ry:/var/www/html/laravel$ sudo service apache2 stop

2. Kurulum part.2

Önceki kurulum bölümünde Laravel’in kurulumunu göstermiş oldum. Şimdi ise Socialite’ı kuralım.

Socialite’ı Composer üzerinden kuracağız. Bunun için aiağıdaki komut kullanılmalıdır.

element@ry:/var/www/html/laravel$ composer require laravel/socialite

3. Konfigürasyon

Kurulan Provider’ı Laravel’e tanıtmalıyız. Bu yüzden config/app.php içindeki providers ve aliases array’lerine aşağıdaki gibi gerekli elemanlar eklenmelidir.

'providers' => [
    /*
    * Laravel Framework Service Providers...
    */

    // ......
    // mevcut provider'lar
    // ......

    Laravel\Socialite\SocialiteServiceProvider::class,
],
'aliases' => [
    
    // ......
    // mevcut alias'lar
    // ......

    'Socialite' => Laravel\Socialite\Facades\Socialite::class,
],

4. Facebook Application Oluşturma

  1. Facebook Developer sayfasına gidiyoruz.
  2. Sağ üstte, profile picture’ın yanında bulunan “My Apps” menüsünden “Add a New App” seçeneğine tıklıyoruz.
  3. Açılan window’da “Website” seçeneğini seçiyoruz.
  4. Karşımıza focused oalrak gelen input’a uygulamamızın adını yazıyoruz ve “Create New Facebook App ID” butonuna basıyoruz.
    1. “Is this a test version of another app?” seçeneği “NO” olarak kalsın. Bu seçenek, oluşturacağınız uygulamayı, daha önceden oluşturduğunuz production ortamındaki bir uygulamanın test’i olarak oluşturacaksanız seçmelisiniz. Yani şuan bizim bunla bir işimiz yok.
    2. “Contact Email” kısmına email adresinizi yazın
    3. “Choose a Category” de ise uygulamanız hangi kapsama giriyor ise o kategoriyi seçin.
    4. “Create App ID” butonuna tıklayın
  5. “Tell us about your website” input’una web sitenizi yazın. Şuan localhost’ta çalışacağımızdan dolayı “localhost” yazın. Proje tamamlandıktan sonra Laravel’i remote bir production server’a deploy ederseniz burayı tekrardan deploy ettiğiniz domain ile değiştirmeniz gerekecek.
  6. Ardından “Skip To Developer Dashboard” linkine tıklayarak uygulamanın dashboard’ına gidin.
  7. Oradaki “App ID” ve “App Secret” bize ilerde lazım olacak, aklınızda bulunsun.
  8. “Setting” menüsünün altındaki “Basic” sayfasına giderek “App Domain” input’una “localhost” yazın. Proje tamamlandıktan sonra Laravel’i remote bir production server’a deploy ederseniz burayı tekrardan deploy ettiğiniz domain ile değiştirmeniz gerekecek.
  9. Son olarak “App Review” menüsünden “Make Public?” seçeneğini aktif etmeliyiz. Aksi taktirde uygulamamız development modunda olduğundan sadece siz kullanabileceksiniz.

5. Facebook Application’ın Socialite’a Tanıtılması

config/services.php dosyasını açıyoruz ve en altına aşağıdaki array’i yerleştiriyoruz.

'facebook' => [
    'client_id' => '', // 15 karakterli Facebook uygulamasının "App ID"si
    'client_secret' => '', // 32 karakteli Facebook uygulamasının "App Secret"ı
    'redirect' => env('APP_URL', 'https://localhost') . '/callback', // .env file'da APP_URL belirtilmiş ise onu çek, belirtilmemiş ise  localhost olarak kabul et
],

Bu arada .env file demişken şu yazıma da göz atmanızda fayda var; Laravel 5 ile Gelen Güvenlik Zafiyeti (.env file)

6. Route İşlemleri

Facebook API’ın collback ve redirect url’leri için route tanımlamamız gerekiyor.

app/Http/route.php dosyasına aşağıdaki route’ları tanımlamamız gerekiyor.

Route::get('/redirect', 'SocialiteController@redirect');
Route::get('/callback', 'SocialiteController@callback');

7. Database İşlemleri

Öncelikle make:auth ile oluşturulan user tablosunda email kolonunun unique olduğundan emin olun. Eğer unique değil ise createusertable migration’ına gidip aşağıdaki tanımlamayı yapmalısınız.

$table->string('email')->unique()->nullable();

User tablosu ile işimiz bitti. Facebook’tan gelen user’ların facebook id’lerini tutmak için 2. bir tabloya ihtiyacımız var. Hemen oluşturalım.

element@ry:/var/www/html/laravel$ php artisan make:migration create_socialite_users_table

ve migration dosyamızın içeriğini aşağıdaki gibi düzenleyip gerekli kolonların ve tablo adının tanımlamasını yapıyoruz.

Schema::table('socialite_users', function (Blueprint $table) {
    $table->integer('user_id');
    $table->string('provider_user_id');
    $table->string('provider');
    $table->timestamps();
});

ve ardından migration işlemini gerçekleştirelim

element@ry:/var/www/html/laravel$ php artisan migrate:refresh

8. Model İşlemleri

Öncelikle oluşturduğumuz migration için bir model’e ihtiyacımız var. Onu oluşturalım;

element@ry:/var/www/html/laravel$ php artisan make:model SocialiteUser

Oluşan model dosyamızın içine fillable kolonları ve 1 adet relationship tanımlamamız gerekiyor. Yani model dosyamızın içeriği aşağıdaki gibi olmalıdır;

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class SocialiteUser extends Model
{
    protected $fillable = ['user_id', 'provider_user_id', 'provider'];
    protected $table = "socialite_users";
    public function user()
    {
        return $this->belongsTo(User::class);
    }
}

9. Socialite Service İşlemleri

element@ry:/var/www/html/laravel$ touch app/SocialiteUserService.php

komutu ile SocialiteUserService.php adında dosyayı oluşturtan sonra içeriğini aşağıdaki şekil dolduruyoruz

<?php

namespace App;

use Laravel\Socialite\Contracts\User as ProviderUser;

class SocialiteUserService
{
    public function createOrGetUser(ProviderUser $providerUser)
    {
        /* 
        * provider'dan gelen user id ile kullanıcı getir
        */
        $socialiteUser = SocialiteUser::whereProvider('facebook')->whereProviderUserId($providerUser->getId())->first();

        /*
        * eğer kullanıcı var ise, yani daha önceden 1 kere sisteme kayıt olmuş ise kullanıcı otomatik olarak giriş yapsın
        */
        if ($socialiteUser)
            return $socialiteUser->user;

        /*
        * eğer ilk defa geliyor ise
        */
        } else {

            /*
            * database'de "socialite_user" tablosuna kaydet kullanıcıyı ve facebook id'sini kaydet
            */
            $socialiteUser = new SocialiteUser([
                'provider_user_id' => $providerUser->getId(),
                'provider' => 'facebook'
            ]);

            /*
            * normal kullanıcıların olduğu yani "user" tablosundan kullanıcı çek
            */
            $user = User::whereEmail($providerUser->getEmail())->first();

            /*
            * eğer "user" tablosunda da bu kullanıcı yok ise siteye ilk defa gelmiştir, user tablosuna da kaydet
            */
            if (!$user) {
                $user = User::create(
                    [
                        'email' => $providerUser->getEmail(),
                        'name' => $providerUser->getName(),
                    ]
                );
            }

            $socialiteUser->user()->associate($user);
            $socialiteUser->save();

            return $user;

        }

    }
}

10. Controller İşlemleri

Aşağıdaki komut ile Socialite için gerekli işlemlerimizi yapacağımız Controller’ı oluşturmalıyız.

element@ry:/var/www/html/laravel$ php artisan make:controller SocialiteController

oluşturduğumuz kontroller dosyasına, Route bölümünde tanımladığımız callback ve redirect route’larının methodlarını yazmamız gerekiyor.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;
use App\SocialiteUserService;
use Socialite;

class SocialiteController extends Controller
{
    public function redirect()
    {
        return Socialite::driver('facebook')->redirect(); 
    }

    public function callback(SocialiteUserService $service)
    {
        $user = $service->createOrGetUser(Socialite::driver('facebook')->user());

        auth()->login($user);

        return redirect()->to('/');
    }
}

11. View İşlemleri

Geldik son bölüme! View bölümünde ise klasik “Facebook ile Bağlan” butonunu koyacağız ve sistemimiz bitmiş olacak.

resources/views/auth dizinindeki login.blade.php ve register.blade.php dosyalarını açıyoruz ve uygun olan bir yere aşağıdaki gibi Facebook Connect url’ini yani redirect route’umuzu veriyoruz

{{ link_to('redirect', 'Facebook ile bağlan!') }}

ve bitti!

Umarım faydam dokunmuştur…

Linkler

Socialite: https://github.com/laravel/socialite

Social Authentication: https://laravel.com/docs/5.1/authentication#social-authentication

Socialite Laracast: https://laracasts.com/series/whats-new-in-laravel-5/episodes/9

Comments on this post

  1. mehmet

    Teşekkürler hocam çok detaylı ve güzel bir anlatım olmuş

Leave a Reply to mehmet Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Trackbacks and Pinbacks

No trackbacks.

TrackBack URL