Melden Sie sich mit Twitter in Laravel mit Laravel Socialite an Social

Kürzlich habe ich einen Artikel über Login mit Twitter in PHP veröffentlicht. Einer unserer Leser bat darum, einen Artikel über das Einloggen mit Twitter in Laravel zu schreiben. Obwohl Laravel auf der Programmiersprache PHP basiert und ich über die Twitter-Anmeldung in PHP geschrieben habe, weiß ich, dass das bisherige Tutorial nicht für das Laravel-Framework geeignet ist. Laravel hat seine eigene Ordnerstruktur, den Entwicklungsfluss. Ein Entwickler sollte beim Erstellen von Webanwendungen darin die Standards von Laravel befolgen.

Laravel hat seine offiziellen Pakete, die Entwicklern helfen, bestimmte Funktionen zu erreichen. Eines der Pakete ist Socialite. Mit Socialite können Sie Social Login mit verschiedenen Anbietern wie Facebook, Twitter, LinkedIn, Google usw. integrieren.

In diesem Artikel untersuchen wir Login mit Twitter in Laravel mit Laravel Socialite.

Einstieg

Beginnen wir mit der frischen Laravel-Installation. Es ist nicht zwingend erforderlich, eine neue Laravel-Installation zu verwenden, Sie können auch Ihr bestehendes Projekt verwenden.

Führen Sie den folgenden Befehl aus, um das neueste Laravel zu installieren:

composer create-project --prefer-dist laravel/laravel twitterlogin

Erstellen Sie nach der Installation die Datenbank und fügen Sie die Anmeldeinformationen in die .envDatei ein. Wir bauen ein Login-System, damit wir Benutzerdaten in der Datenbank speichern sollten.

Dieses Tutorial basiert auf Mit Twitter anmelden, sodass wir die Twitter-ID des Benutzers nach erfolgreicher Authentifizierung erhalten. Um diese soziale ID zu speichern, fügen wir Spalten providerund provider_idzur Tabelle ‘Benutzer’ hinzu. Die Spalte providerspeichert den Wert als ‘twitter’ und eine Spalte provider_idist für die Twitter-ID des Benutzers.

Wenn wir Social Login verwenden, müssen wir keine Passwörter speichern, daher sollte die Passwortspalte standardmäßig den Wert ‘NULL’ akzeptieren. Es gibt keine Garantie, die E-Mail des Benutzers nach der Anmeldung in sozialen Netzwerken zu erhalten, daher müssen wir aus Neugier auch die E-Mail-Spalten so einstellen, dass sie den Wert ‘NULL’ akzeptieren.

Öffnen Sie die Tabellenmigrationsdatei ‘users’ und fügen Sie den folgenden Code hinzu.

/**
 * Run the migrations.
 *
 * @return void
 */
public function up()
{
    Schema::create('users', function (Blueprint $table) {
        $table->increments('id');
        $table->string('name');
        $table->string('email')->nullable();
        $table->timestamp('email_verified_at')->nullable();
        $table->string('password')->nullable();
        $table->string('provider');
        $table->string('provider_id');
        $table->rememberToken();
        $table->timestamps();
    });
}

Führen Sie danach den Migrationsbefehl aus, der Tabellen in Ihrer Datenbank erstellt.

php artisan migrate

Außerdem müssen Sie dem Benutzermodell die Spalten providerund hinzufügen provider_id.

app/User.php

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

Holen Sie sich Twitter-Anmeldeinformationen

Da wir das Twitter-Login in Laravel integrieren werden, müssen Sie zuerst Ihre Twitter-Anmeldeinformationen abrufen. Befolgen Sie die folgenden Schritte, um eine Twitter-App zu erstellen und Ihre Anmeldeinformationen abzurufen.

• Melden Sie sich beim Twitter-Entwicklerkonto an und erstellen Sie eine neue Anwendung.
• Füllen Sie alle erforderlichen Felder wie den Anwendungsnamen und die Beschreibung aus.
• Fügen Sie Ihre Website-Domain im Feld Website hinzu.
• Legen Sie die Rückruf-URL als http://localhost:8000/twitter/callback. Passen Sie die URL gemäß Ihren Anforderungen an.
• Nachdem Sie sich registriert haben, kopieren Sie die erstellten Anmeldeinformationen (Consumer Key und Secret), die einige Zeit benötigen, und fügen Sie sie ein.

Mit diesen kopierten Anmeldeinformationen schließt Ihre Laravel-Anwendung den OAuth-Flow ab, wenn sich Benutzer mit ihrem Twitter-Konto anmelden.

Routen und Controller erstellen

Um die Funktionalität der Anmeldung mit Twitter zu integrieren, müssen wir unserem Laravel-Projekt einen Code hinzufügen. Erstellen wir eine LoginControllermit dem Befehl:

php artisan make:controller LoginController

Wir müssen einen Login-Link in der Blade-Datei hinzufügen. Erstellen Sie eine login.blade.phpund fügen Sie den folgenden HTML- Code hinzu.

<a href="{{ url('/login/twitter') }}" class="btn btn-success">
    {{ __('Login with Twitter') }}
</a>

Sie können diese Ansicht aus der indexMethode von aufrufen LoginController.

/**
 * Call the view
 */
public function index()
{
    return view('login');
}

Als nächstes fügen Sie die Route dafür hinzu. Ich füge auch einige weitere Routen hinzu, die für den nächsten Teil des Tutorials erforderlich sind.

Route::get('login', 'LoginController@index');
Route::get('login/{provider}', 'LoginController@redirectToProvider');
Route::get('{provider}/callback', 'LoginController@handleProviderCallback');
Route::get('/home', function() {
    return 'User is logged in';
});

Nachdem sich der Benutzer bei Twitter angemeldet hat, werde ich ihn auf die homeRoute umleiten. Es ist nur für Demozwecke. Sie sollten diese Route in etwas anderes ändern.

Einloggen mit Twitter in Laravel

Jetzt ist es an der Zeit, das Socialite-Paket zu nutzen. Mit dem folgenden Befehl können Sie das Socialite-Paket in Ihrem Laravel-Projekt installieren.

composer require laravel/socialite

Nach der Installation von Socialite müssen wir es konfigurieren. Öffnen Sie die config/services.phpund fügen Sie die Twitter-Konfiguration wie folgt zu dieser Datei hinzu:

'twitter' => [
    'client_id' => env('TWITTER_API_KEY'),
    'client_secret' => env('TWITTER_API_SECRET_KEY'),
    'redirect' => env('TWITTER_CALLBACK_URL'),
],

Sie werden vielleicht feststellen, dass ich die envMethode verwendet habe, um die angegebenen Werte zu erhalten. Das bedeutet, dass wir diese Konstanten in der .envDatei definieren müssen.

TWITTER_API_KEY=PASTE_TWITTER_API_KEY
TWITTER_API_SECRET_KEY=PASTE_TWITTER_API_SECRET_KEY
TWITTER_CALLBACK_URL=http://localhost:8000/twitter/callback

Stellen Sie sicher, dass Sie die Platzhalter durch Ihre tatsächlichen API-Schlüssel ersetzen. Als nächstes LoginControllerschreiben wir eine Funktion, die einen Benutzer auf die Twitter-Anmeldeseite umleitet und bei erfolgreicher Autorisierung den Benutzer einloggt.

LoginController.php

<?php
 
namespace AppHttpControllers;
 
use IlluminateHttpRequest;
use Socialite;
use AppModelsUser;
use Auth;
 
class LoginController extends Controller
{
    /**
     * Where to redirect users after login.
     *
     * @var string
     */
    protected $redirectTo = '/home';
  
    /**
     * Call the view
     */
    public function index()
    {
        return view('login');
    }
  
    /**
     * Redirect the user to the Twitter authentication page.
     *
     * @return Response
     */
    public function redirectToProvider($provider)
    {
        return Socialite::driver($provider)->redirect();
    }
    
    /**
     * Obtain the user information from Twitter.
     *
     * @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
        ]);
    }
}

Gehen Sie zur Anmeldeseite und klicken Sie auf den Link „Mit Twitter anmelden”. Schließen Sie den Vorgang ab und Sie sollten sich über Twitter beim System anmelden. In der usersTabelle können Sie auch Einträge von Benutzern finden .

Ich hoffe, Sie erfahren mehr über die Anmeldung bei Twitter in Laravel mit dem Socialite-Paket. Ich würde gerne Ihre Gedanken oder Vorschläge im Kommentarbereich unten hören.

Zum Thema passende Artikel

• Melden Sie sich mit LinkedIn in Laravel mit Laravel Socialite an
• Google-Login in Laravel mit Laravel Socialite