Laravel 開発: Laravel Socialite を使用して Github ログインを実装する方法は?

PHPz
リリース: 2023-06-13 14:46:48
オリジナル
946 人が閲覧しました

今日のインターネット時代では、ほとんどの Web アプリケーションでユーザー ログインを考慮する必要があります。これは、ユーザーのログインの難しさを軽減し、ユーザー エクスペリエンスを最適化するために、Web アプリケーションがオプションの複数のログイン方法をユーザーに提供する必要があることも意味します。

現在最も人気のある PHP フレームワークの 1 つとして、Laravel はユーザー認証を実装するための非常に便利な方法をいくつか提供しています。Laravel Socialite は、アプリケーションが認証プロバイダーとして機能するサードパーティのプラットフォームを使用できるようにする非常に強力なユーザー認証ソリューションです。

この記事では、Laravel Socialiteを使ってGithubログイン機能を実装する方法を紹介します。この目標を達成するために、段階的にアプローチしてみましょう。

ステップ 1: Github アプリケーションを作成する

この記事を始める前に、まず Github アカウントを登録して作成し、Github で OAuth アプリケーションを作成する必要があります。アプリケーションを作成するプロセスは比較的簡単で、次の手順に従うだけです:

  1. Github アカウントにログインし、Github の設定 -> 開発者設定 -> OAuth で新しい OAuth アプリを作成します。アプリページ
  2. 最初の部分でアプリ名、ホームページURL、コールバックURLを入力します

    ##コールバックURLはログイン成功後に返されるWebサイトアドレスであり、Laravelで定義する必要があります。ウェブサイトの背景

  3. Github アプリケーションの client_id と client_secret は、フォームの送信後に返されるページに表示されます。 client_id は、Laravel Socialite の Github ドライバーを構成するために使用されます。
ステップ 2: Laravel Socialite をインストールする

Laravel Socialite のインストールは、Composer を通じて簡単に行うことができます。プロジェクト ディレクトリのコマンド ラインに次の手順を入力するだけです。

composer require laravel/socialite
ログイン後にコピー

ステップ 3: サービス プロバイダーとファサード参照を構成する

config/app.php 構成ファイルを開いて、プロバイダー配列を見つけます。およびエイリアス配列に、Socialite サービス プロバイダーとファサード参照を対応する配列に追加します。

'providers' => [
    // Other service providers...

    LaravelSocialiteSocialiteServiceProvider::class,
],

'aliases' => [
    // Other aliases...

    'Socialite' => LaravelSocialiteFacadesSocialite::class,
],
ログイン後にコピー

ステップ 4: Github ドライバー構成を定義する

次の構成を config/services.php 構成ファイルに追加します:

'github' => [
    'client_id' => env('GITHUB_CLIENT_ID'),
    'client_secret' => env('GITHUB_CLIENT_SECRET'),
    'redirect' => env('GITHUB_REDIRECT'),
],
ログイン後にコピー

ステップ 5: Github ログイン リンクを定義する

ログイン ページのブレード テンプレート ファイルを開き、次のコードを追加します。

<a href="{{ url('auth/github') }}" class="btn btn-github"><i class="fa fa-github"></i> Github 登录</a>
ログイン後にコピー

これにより、/auth/github にアクセスして Github ログイン ページにジャンプするリンクが作成されます。

ステップ 6: Github コールバック関数を定義する

Github に登録したときにコールバック URL ページを開き、リンク内のコード パラメーターを取得し、Laravel ルートに次のコードを追加します。 ##
Route::get('auth/github/callback', function () {
    $user = Socialite::driver('github')->user();

    // 如果在本地没有找到该用户,则创建新用户
    $existingUser = User::where('email', $user->getEmail())->first();
    if ($existingUser) {
        auth()->login($existingUser, true);
    } else {
        $newUser                  = new User;
        $newUser->name            = $user->getNickname();
        $newUser->email           = $user->getEmail();
        $newUser->github_id       = $user->getId();
        $newUser->avatar          = $user->getAvatar();
        $newUser->provider        = 'github';
        $newUser->save();
        auth()->login($newUser, true);
    }

    return redirect()->to('/home');
});
ログイン後にコピー

ここで注意する必要があるのは、必要に応じてログイン検証のために github_id をデータベースに保存する必要があることと、簡単に表示できるようにユーザーのニックネームとアバターも保存する必要があることです。

ステップ 7: .env ファイルを作成する

プロジェクトのルート ディレクトリで .env ファイルを開き、次の Github 関連の設定を追加します:

GITHUB_CLIENT_ID=your-github-client-id-here
GITHUB_CLIENT_SECRET=your-github-client-secret-here
GITHUB_REDIRECT=http://localhost:8000/auth/github/callback
ログイン後にコピー

上記の設定では、 ##your-github-client-id-here

your-github-client-secret-here を、Github から取得した client_id と client_secret に # 置き換える必要があります。 GITHUB_REDIRECT の値は、Github にアプリケーションを登録するときのリダイレクト URI パラメーターである必要があります。 さて、Github にログインしてアプリケーションをテストしてみましょう。 /auth/github にアクセスすると、Github のログイン ページにリダイレクトされるはずです。 Github アカウントを入力すると、コールバック URI 経由で指定したアドレスにリダイレクトされるはずです。

Laravel Socialite を使用すると、認証を実装するための迅速かつ簡単な方法になります。また、Facebook、Twitter、Google など、他の多くのアカウント認証サービス プロバイダーもサポートしています。快適で効率的なサードパーティのログイン方法はユーザー エクスペリエンスを大幅に向上させることができるため、Web アプリケーションに複数のログイン方法を追加することが徐々に必要になってきています。 Laravel Socialite を使用すると、独自に認証システムを実装する場合と比較して、既存の優れた認証サービスプロバイダーを活用して、本人認証ソリューションの実装を簡素化できます。

以上がLaravel 開発: Laravel Socialite を使用して Github ログインを実装する方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート