Публикации - Laravel

Аутентификация и авторизация - Авторизация в Facebook с помощью Jetstream

Facebook_id

Сперва необходимо получить facebook_id. Перейдем по ссылке

http://developers.facebook.com/

Находим Create App

Указываем имя и контактый телефон.

По ссылке dashboard, находим свой App ID

Сейчас необходимо найти Facebook Login. Переходим по ссылке, по которой можно получить APP ID и App Secret, и указать ссылку на форму авторизацию.

Пакет Jetstream

Jetstream быстро создать пользовательский интерфейс аутентификации в Laravel

Устанавливаем Jetstream:

 composer require laravel/jetstream

Генерируем шаблоны авторизации:

php artisan jetstream:install livewire

Устанавливаем зависимости node:

npm install

Запускаем node

npm run dev

И выполняем новые миграции Laravel

php artisan migrate

Socialite Package в Laravel

Установка пакета:

composer require laravel/socialite

После чего в файле config/app.php в массив с провайдером и фасадом добавляем соответстующие записи:

....
....
'providers' => [
    ....
    ....
    Laravel\Socialite\SocialiteServiceProvider::class,
],

'aliases' => [
    ....
    ....
    'Socialite' => Laravel\Socialite\Facades\Socialite::class,
],
....
....

Facebook_id в таблице users

Создадим новую миграцию

php artisan make:migration add_fb_id_column_in_users_table --table=users

В папке databese/migrations открываем последний файл, и вносим в него следующие изменения:

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class AddFbIdColumnInUsersTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::table('users', function (Blueprint $table) {
            $table->string('fb_id')->nullable();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::table('users', function (Blueprint $table) {
            $table->dropColumn('fb_id');
        });
    }
}

После чего находим модель User и вносим следующие изменения в модель:

namespace App\Models;

use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
use Laravel\Fortify\TwoFactorAuthenticatable;
use Laravel\Jetstream\HasProfilePhoto;
use Laravel\Sanctum\HasApiTokens;

class User extends Authenticatable
{
    use HasApiTokens;
    use HasFactory;
    use HasProfilePhoto;
    use Notifiable;
    use TwoFactorAuthenticatable;

    /**
     * The attributes that are mass assignable.
     *
     * @var array
     */
    protected $fillable = [
        'name',
        'email',
        'password',
        'fb_id',
    ];

    /**
     * The attributes that should be hidden for arrays.
     *
     * @var array
     */
    protected $hidden = [
        'password',
        'remember_token',
        'two_factor_recovery_codes',
        'two_factor_secret',
    ];

    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'email_verified_at' => 'datetime',
    ];

    /**
     * The accessors to append to the model's array form.
     *
     * @var array
     */
    protected $appends = [
        'profile_photo_url',
    ];
}

Facebook App ID и Secret

Если facebook_id и секретный ключ уже получен, зарегистрируйте его в файле config/services.

return [
    ....
    ....
    ....
    'facebook' => [
        'client_id' => 'Facebook app id',
        'client_secret' => 'Facebook add secret',
        'redirect' => 'http://localhost:8000/auth/facebook/callback',
    ],
]

Social Контроллер

Создаём SocialController

php artisan make:controller SocialController

Открываем файл app/Http/Controllers/SocialController.php и вносим в него следующие изменения:.

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use App\Models\User;
use Validator;
use Socialite;
use Exception;
use Auth;

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

    public function loginWithFacebook()
    {
        try {
    
            $user = Socialite::driver('facebook')->user();
            $isUser = User::where('fb_id', $user->id)->first();
     
            if($isUser){
                Auth::login($isUser);
                return redirect('/dashboard');
            }else{
                $createUser = User::create([
                    'name' => $user->name,
                    'email' => $user->email,
                    'fb_id' => $user->id,
                    'password' => encrypt('admin@123')
                ]);
    
                Auth::login($createUser);
                return redirect('/dashboard');
            }
    
        } catch (Exception $exception) {
            dd($exception->getMessage());
        }
    }
}

Маршрутизация

Открываем файл routes/web.php и добавляем маршруты:

Route::get('auth/facebook', [SocialController::class, 'facebookRedirect']);
Route::get('auth/facebook/callback', [SocialController::class, 'loginWithFacebook']);

Кнопка авторизации через Facebook и форма

Собственно, теперь при переходе по этому url, будет осуществляться авторизация пользователся через facebook

 url('auth/facebook')

Итоги

Мы рассмотрели, как в приложении Laravel авторизоваться через Facebook; однако, используя пакет Socialite, вы можете войти в систему через Twitter, Google, LinkedIn, GitHub, GitLab и Bitbucket. Загрузите полный код этого руководства с GitHub.

Количество комментариев: 0

Для того, чтобы оставить коментарий необходимо зарегистрироваться


Изображения Видео

1. Подключение CKEditor https://artisansweb.net/install-use-ckeditor-laravel/#comments
2. Регистрация и авторизация https://know-online.com/post/laravel-reg
3. Что нового в Laravel 8 https://sergeymukhin.com/blog/chto-novogo-v-laravel-80
4. Авторизация Sanctum <iframe width="560" height="315" src="https://www.youtube.com/embed/MT-GJQIY3EU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>