✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

Sosiaalinen kirjautumisjärjestelmä Laravel Socialiten avulla

16

Luotto: Tämä artikkeli on innoittamana tästä viestistä Laravel Social Authentication with Socialite

Etsitkö sosiaalisen sisäänkirjautumisen järjestelmää Laravel-verkkosivustollasi? Sallimalla sosiaalisen kirjautumisen käyttäjien ei tarvitse rekisteröityä verkkosivustollesi. Se säästää myös paljon työtä, kuten aktivointilinkin lähettäminen, sähköpostitilin tarkistaminen. Tässä artikkelissa tutkitaan, miten sosiaalinen sisäänkirjautumisjärjestelmä lisätään Laravel-seuran avulla.

Laravel Socialite -kirjasto tarjoaa OAuth-todennuksen Facebookin, Twitterin, Googlen, LinkedInin, GitHubin ja Bitbucketin avulla. Meidän on asennettava tämä kirjasto Laravel-verkkosivustollemme, määritettävä se, haettava API-avaimet sosiaalisesta sivustosta ja olemme hyviä.

Sosiaalinen kirjautumisjärjestelmä Laravel Socialiten avulla

Luo käyttäjien taulukko

Sosiaalisen sisäänkirjautumisjärjestelmän toteuttamiseksi meidän on luotava käyttäjien taulukko, joka tallentaa sosiaalisen sivuston tarjoamat tiedot.

Jos sinulla on uusi Laravel-asennus, avaa komentorivityökalu projektin juurihakemistossa ja suorita komento php artisan make:auth. Tämä komento luo todennuksen ohjaimet, kuten LoginController, RegisterController jne., Jotka sijaitsevat hakemistossa app / Http / Controllers / Auth. Se luo myös näkymät login.blade.php, register.blade.php resurssien / näkymän / todennushakemistoon.

Avaa seuraavaksi käyttäjien siirtotaulukko. Muutamme tätä oletussiirtoa ja lisätään vielä kaksi saraketta, joita kutsutaan palveluntarjoajaksi ja tarjoajan tunnukseksi.

public function up()
{
    Schema::create('users', function (Blueprint $table) {
        $table->increments('id');
        $table->string('name');
        $table->string('email')->nullable();
        $table->string('password')->nullable();
        $table->string('provider');
        $table->string('provider_id');
        $table->rememberToken();
        $table->timestamps();
    });
}

Kuten näette, asetamme sähköposti- ja salasanasarakkeet mitätöitäviksi. Miksi? Kun käytämme sosiaalista kirjautumistodennusta, ei voida taata käyttäjän sähköpostitunnuksen saamista. Ja salasanaa ei myöskään tarvita tällaisessa tapauksessa. Joten pidämme sähköpostin ja salasanan mitätöitävissä. Sarakepalveluntarjoaja tallentaa sosiaalisen sivuston nimen, kuten facebook, twitter jne. Sarake Provider_id tallentaa käyttäjän sosiaalisen sivuston sosiaalisen tunnuksen.

Kun olet muokannut käyttäjän siirtoa yllä olevan mukaisesti, suorita komento php artisan migrate. Se luo tietokantaan taulukon nimeltä käyttäjät.

Luultavasti siirtokomennon suorittamisen aikana saat jonkin verran merkkien pituuteen liittyvää virhettä. Jos näin on, avaa sitten AppServiceProvider.php-tiedosto app / Providers-hakemistosta. Tässä tiedostossa meidän on määritettävä oletusmerkkijonon pituus tietokantataulukon sarakkeille.

Tiedosto AppServiceProvider.php

<?php
 
namespace AppProviders;
 
use IlluminateSupportServiceProvider;
use IlluminateSupportFacadesSchema;
 
class AppServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        Schema::defaultStringLength(255);
    }
 
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

Käyttäjän malli

Oletusarvoisesti Laravel sisältää AppUser Eloquent -mallin sovellushakemistossasi. Avaa User.php sovelluskansiosta. Lisää kaksi sarakkeiden tarjoajaa szolgáltajan_tunnus $ täytettävään muuttujaan.

protected $fillable = [
    'name', 'email', 'password', 'provider', 'provider_id',
];

Asenna ja määritä Laravel Socialite

Tämän kirjaston asentamiseksi sinulla on oltava säveltäjä asennettuna järjestelmään.

Suorita alla oleva komento komentorivityökalussa.

composer require laravel/socialite

Kun olet asentanut kirjaston, rekisteröi LaravelSocialiteSocialiteServiceProvider config / app.php-määritystiedostoon.

'providers' => [
    // Other service providers...
 
    LaravelSocialiteSocialiteServiceProvider::class,
],

Lisää samassa tiedostossa config / app.php aliaksitaulukon alle Socialite-julkisivu.

'Socialite' => LaravelSocialiteFacadesSocialite::class,

Nyt on aika rekisteröidä hakemuksesi sosiaalisella sivustolla. Oletetaan esimerkiksi, että haluat ottaa käyttöön Facebook-kirjautumistodennuksen. Joten mene eteenpäin ja luo sovellus Facebookiin.

Kun olet valmis sovellustunnuksella, Facebook-sovelluksesi sovelluksen salaisuudella, avaa tiedosto config / services.php ja lisää siihen alla oleva koodi.

'facebook' => [
    'client_id' => env('FB_APP_ID'),
    'client_secret' => env('FB_APP_SECRET'),
    'redirect' => env('FB_CALLBACK_URL'),
],

Kuten yllä olevassa koodissa on esitetty, meidän on tallennettava sovellustiedot ja takaisinsoitto-URL.

FB_APP_ID=PASTE_APP_ID_HERE
FB_APP_SECRET=PASTE_APP_SECRET_HERE
FB_CALLBACK_URL=YOU_SITE_URL/login/facebook/callback

Olemme soittaneet takaisinsoiton URL-osoitteeksi YOU_SITE_URL / login / facebook / callback. Nyt on aika luoda kaksi reittiä, yksi käyttäjän uudelleenohjaamiseksi OAuth (meidän tapauksessamme Facebook) palveluntarjoajalle ja toinen takaisinsoiton vastaanottamiseksi palveluntarjoajalta todennuksen jälkeen.

OAuthin käsittelyn todellinen koodi

Tässä vaiheessa kaikki Laravel Socialiten asetukset on suoritettu loppuun. On aika kirjoittaa koodi, joka käsittelee uudelleenohjauksen OAuth ja noutaa käyttäjän tiedot.

Avaa login.blade.php-tiedostosi ja aseta alla oleva koodi todennäköisesti Lähetä-painikkeen jälkeen.

<div class="form-group">
    <div class="col-md-6 col-md-offset-4">
        Login with
        <a href="{{ url('/login/facebook') }}"><i class="fa fa-facebook-official" aria-hidden="true"></i> Facebook</a>
        <a href="{{ url('/login/twitter') }}"><i class="fa fa-twitter" aria-hidden="true"></i> Twitter</a>
        <a href="{{ url('/login/github') }}"><i class="fa fa-github" aria-hidden="true"></i> Github</a>
    </div>
</div>

Lisäämme tähän linkin Githubiin ja Twitteriin. OAuthin lisäämisen vaiheet näille sosiaalisille sivustoille ovat samat kuin Facebook. Sinun tarvitsee vain luoda vastaavien sosiaalisten sivustojen sovellus ja tallentaa nämä tiedot samalla tavalla kuin lisäsimme Facebookiin.

Määritä reittitiedostossa reitit alla esitetyllä tavalla.

Route::get('login/{provider}', 'AuthLoginController@redirectToProvider');
Route::get('login/{provider}/callback', 'AuthLoginController@handleProviderCallback');

Siirry seuraavaksi osoitteeseen app / Http / Controllers / Auth / LoginController.php ja muokkaa tiedostoa. Sinun tulisi lisätä alla oleva koodi siihen.

<?php
 
namespace AppHttpControllersAuth;
 
use AppHttpControllersController;
use IlluminateFoundationAuthAuthenticatesUsers;
use Socialite;
use AppUser;
use Auth;
 
class LoginController extends Controller
{
    /**
     * Redirect the user to the GitHub authentication page.
     *
     * @return Response
     */
    public function redirectToProvider($provider)
    {
        return Socialite::driver($provider)->scopes(['email'])->redirect();
    }
 
    /**
     * Obtain the user information from GitHub.
     *
     * @return Response
     */
    public function handleProviderCallback($provider)
    {
        $user = Socialite::driver($provider)->user();
        $authUser = $this->findOrCreateUser($user, $provider);
        Auth::login($authUser, true);
        return redirect($this->redirectTo);
    }
 
    /**
     * If a user has registered before using social auth, return the user
     * else, create a new user object.
     * @param  $user Socialite user object
     * @param $provider Social auth provider
     * @return  User
     */
    public function findOrCreateUser($user, $provider)
    {
        $authUser = User::where('provider_id', $user->id)->first();
        if ($authUser) {
            return $authUser;
        }
        return User::create([
            'name'     => $user->name,
            'email'    => $user->email,
            'provider' => $provider,
            'provider_id' => $user->id
        ]);
    }
}

Metode redirectToProvider ohjaa käyttäjän uudelleen sosiaalisen sivuston kirjautumissivulle. Kun käyttäjä on valtuuttanut sovelluksen, haemme käyttäjätiedot funktiosta handleProviderCallback. Jos käyttäjää ei ole järjestelmämme kanssa, lisätään heidän tietonsa metodilla findOrCreateUser.

Toivomme, että sait tietää sosiaalisesta kirjautumisjärjestelmästä Laravel Socialiten avulla. Jos sinulla on kysyttävää tai ehdotuksia, jätä kommentti alla.

Aiheeseen liittyvät artikkelit

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja