CI4でソーシャルメディアログインを実装する

Codeigniter4でfacebookやtwitterなどのソーシャルメディアログイン機能を実装する方法について説明します。

ソーシャルメディアログイン機能の実装にはHybridauthのライブラリを使用します。

Hybridauthライブラリのインストール

次のコマンドを実行してHybridauthライブラリをインストールします。

# composer require hybridauth/hybridauth

設定ファイルの作成

Configディレクトリ内にProvider.phpを以下の内容で作成します。

<?php
 
namespace App\Config;

use CodeIgniter\Config\BaseConfig;

class Provider extends BaseConfig
{
  public $configure = [
    // callback
    'callback' => 'https://www.example.com/auth/authenticate',
    'providers' => [
      // facebook.
      'Facebook' => [
        'enabled' => true,
        'keys' => [
          'id' => '<アプリID>',
          'secret' => '<秘密キー>',
        ],
      ],
      // twitter
      'Twitter' => [
        'enabled' => true,
        'keys' => [
          'key' => '<キー>',
          'secret' => '<秘密キー>',
        ],
      ],
    ],
  ];
}

アプリID、キー、秘密キーは各SNSのデベロッパーサイトで発行された値を指定します。

コントローラーの作成

Authコントローラーを作成します。

<?php

namespace App\Controllers;

use Hybridauth\Hybridauth;
use Hybridauth\HttpClient;

class Auth extends BaseController
{
  public function index()
  {
    return view('auth');
  } 
  
  public function authenticate($provider = false)
  {
    $userProfile = [];
    $config = new \App\Config\Provider();
    try {
      $auth = new Hybridauth($config->configure);
      $adapter = $auth->authenticate($provider);
      $tokens = $adapter->getAccessToken();
      $userProfile = $adapter->getUserProfile();
      $adapter->disconnect();
      
    } catch (\Exception $e) {
      echo $e->getMessage();
    }

    return view('result', ['userProfile' => $userProfile]);
  }

ビューの作成

ビューはログインとログイン後の画面を用意します。

auth.phpの作成

Viewsディレクトリにauth.phpを以下の内容で作成します。

<html>
<head>
<title>ソーシャルメディアログインテスト</title>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<a href="<?php echo base_url('auth/authenticate/Facebook') ?>">Facebookアカウントでログイン</a><br>
<a href="<?php echo base_url('auth/authenticate/Twitter') ?>">Twitterアカウントでログイン</a>
</body>
</html>

result.phpの作成

Viewsディレクトリにresult.phpを以下の内容で作成します。

<html>
<head>
<title>ソーシャルメディアログインテスト</title>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<?php var_dump($userProfile) ?>
</body>
</html>