Socitumを用いたLaravel 8におけるソーシャルネットワークを介したAPI認証



ララヴェルサンクチュアリ
以前に書きました.
今、私はAPIを経由して社会的なログインを追加するつもりです.
この例では、FacebookやGoogle、Githubを介してラルヴェルSanctum認証をソーシャルネットワークと統合する方法を紹介します.
確認してください、あなたはすでにこれに続くならば、ララヴィルSanctumをインストールして、そして、ここに来てください.

ララベル社交構成
Step 1 : Socialiteパッケージのインストールcomposer require laravel/socialite
Step 2 : Config Socialite
すべてのソーシャル設定の詳細をconfig\services.php ファイル.下記の通り
'github' => [
    'client_id' => env('GITHUB_CLIENT_ID'),
    'client_secret' => env('GITHUB_CLIENT_SECRET'),
    'redirect' => 'GITHUB_REDIRECT_URI',
],
'facebook' => [
    'client_id' => env('FACEBOOK_CLIENT_ID'),
    'client_secret' => env('FACEBOOK_CLIENT_SECRET'),
    'redirect' => 'FACEBOOK_REDIRECT_URI',
],
'google' => [
    'client_id' => env('GOOGLE_CLIENT_ID'),
    'client_secret' => env('GOOGLE_CLIENT_SECRET'),
    'redirect' => 'GOOGLE_REDIRECT_URI',
],
手順3 : OAuthサービスプロバイダーから設定詳細を取得する
ここで、それぞれのソーシャルデベロッパーアカウントからClientCird IDとClientCount秘密を取得する必要があります
ギタブhttps://github.com/settings/developers
グーグルhttps://console.developers.google.com/apis/dashboard
フェイスブックhttps://developers.facebook.com/apps/
これは、すべての社会的ネットワークでは、ClientRageのIDとClientRule秘密鍵を得ることができるセットアップの開発者アカウントに簡単です.最後に、コールバックURLを設定する必要があります.首尾よく認証の後、それはそのURLにトークンを送ります.
Step 4 :アプリケーションの設定詳細を設定する
あなたはすべてのClientRoundのIDとClientCount秘密キーを持って、今これらのキーを追加します.env ファイル
GITHUB_CLIENT_ID=XXXXXXXXX
GITHUB_CLIENT_SECRET=XXXXXXX
GITHUB_REDIRECT_URI=http://127.0.0.1:8000/api/login/github/callback

アカウント設定
同様に他のすべてのOAuthサービスプロバイダを追加
Step 5 :パスワードを無効にする
OAuthサービスを使用してユーザーを認証すると、パスワードではなくトークンが表示されます.それで、我々のデータベースでは、パスワードフィールドは許容できなければなりません.
ユーザ名表移動ファイルでnull可能なパスワードフィールドを変更します.
public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->string('email')->unique();
            $table->timestamp('email_verified_at')->nullable();
            $table->string('password')->nullable();
            $table->rememberToken();
            $table->timestamps();
        });
    }
Step 6 :プロバイダーを作成する
さて、プロバイダの別のテーブルを作成する必要がありますphp artisan make:migration create_providers_tableプロバイダの移行ファイルで
    public function up()
    {
        Schema::create('providers', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('provider');
            $table->string('provider_id');
            $table->bigInteger('user_id')->unsigned();
            $table->string('avatar')->nullable();
            $table->timestamps();

            $table->foreign('user_id')->references('id')->on('users')->onDelete('cascade');
        });
    }
Step 7 :プロバイダーテーブルを作成する
プロバイダーモデルphp artisan make:model Providerオープンプロバイダーモデル
<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Provider extends Model
{
    use HasFactory;

    protected $fillable = ['provider','provider_id','user_id','avatar'];
    protected $hidden = ['created_at','updated_at'];
}
Step 8 :ユーザテーブルへのプロバイダ関係の追加
ここでは、ユーザーモデルでプロバイダー機能を作成しました
<?php

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\Sanctum\HasApiTokens;


class User extends Authenticatable
{
    use HasApiTokens, HasFactory, Notifiable;

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

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

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


    public function providers()
    {
        return $this->hasMany(Provider::class,'user_id','id');
    }
}

ステップ9 :ルートを追加する
オープンroutes/api.php ルート追加URL
Route::get('/login/{provider}', [AuthController::class,'redirectToProvider']);
Route::get('/login/{provider}/callback', [AuthController::class,'handleProviderCallback']);
コントローラに上記の機能を追加

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Http\Response;
use Illuminate\Support\Facades\Hash;
use GuzzleHttp\Exception\ClientException;
use Illuminate\Http\JsonResponse;
use Laravel\Socialite\Facades\Socialite;
use App\Models\User;

class Authcontroller extends Controller
{


    /**
     * Redirect the user to the Provider authentication page.
     *
     * @param $provider
     * @return JsonResponse
     */
    public function redirectToProvider($provider)
    {
        $validated = $this->validateProvider($provider);
        if (!is_null($validated)) {
            return $validated;
        }

        return Socialite::driver($provider)->stateless()->redirect();
    }

    /**
     * Obtain the user information from Provider.
     *
     * @param $provider
     * @return JsonResponse
     */
    public function handleProviderCallback($provider)
    {
        $validated = $this->validateProvider($provider);
        if (!is_null($validated)) {
            return $validated;
        }
        try {
            $user = Socialite::driver($provider)->stateless()->user();
        } catch (ClientException $exception) {
            return response()->json(['error' => 'Invalid credentials provided.'], 422);
        }

        $userCreated = User::firstOrCreate(
            [
                'email' => $user->getEmail()
            ],
            [
                'email_verified_at' => now(),
                'name' => $user->getName(),
                'status' => true,
            ]
        );
        $userCreated->providers()->updateOrCreate(
            [
                'provider' => $provider,
                'provider_id' => $user->getId(),
            ],
            [
                'avatar' => $user->getAvatar()
            ]
        );
        $token = $userCreated->createToken('token-name')->plainTextToken;

        return response()->json($userCreated, 200, ['Access-Token' => $token]);
    }

    /**
     * @param $provider
     * @return JsonResponse
     */
    protected function validateProvider($provider)
    {
        if (!in_array($provider, ['facebook', 'github', 'google'])) {
            return response()->json(['error' => 'Please login using facebook, github or google'], 422);
        }
    }

}

Step 10 :最終段階、OAuthサービスURLを呼び出します
私のケースでは、私はローカル、オープンですべてを設定しますhttp://127.0.0.1:8000/api/login/github
ログイン後のログイン

このトピックについて何か私に聞いてください!