Безопасная аутентификация без пароля с использованием Auth0

Дата публикации: 2018-08-02

От автора: в этой статье вы узнаете, как настроить аутентификацию без пароля с помощью сервиса Auth0. С Auth0 аутентификация может передать свои функции на аутсорсинг для вашего приложения.

Что такое Auth0?

Auth0 — это инструмент authentication-as-a-service, который упрощает реализацию функций, связанных с проверкой подлинности для вашего приложения или сайта. Если вы создали приложение и хотите просто передать функции аутентификации и авторизации, такой сервис, как Auth0, вы должны рассмотреть.

Позвольте мне кратко изложить, что Auth0 может предложить:

единая точка входа

многофакторная аутентификация

вход в систему без пароля

управление пользователями

и многое другое!

Начальная настройка

В этом разделе мы рассмотрим начальную настройку при подготовке к аутентификации без пароля. Прежде чем двигаться вперед, обязательно установите Composer, поскольку он будет использоваться для установки фактических SDK Auth0 с использованием файла composer.json. Кроме того, если вы хотите следовать примерам в этой статье, зарегистрируйте учетную запись в Auth0.

Давайте начнем с клонирования проекта.

git clone //github.com/auth0-samples/auth0-php-web-app.git .

1	git clone //github.com/auth0-samples/auth0-php-web-app.git .

Установка зависимостей

Для установки зависимостей выполните команду composer install.

cd 00-Starter-Seed
composer install

1 2	cd 00-Starter-Seed composer install

Согласно файлу composer.json, вы должны установить пакеты vlucas / phpdotenv и auth0 / auth0-php.

{
    "name": "auth0/basic-webapp-sample",
    "description": "Basic sample for securing a WebApp with Auth0",
    "require": {
         "vlucas/phpdotenv": "2.4.0",
         "auth0/auth0-php": "~5.0"
    },
    "license": "MIT",
    "authors": [
        {
            "name": "Martin Gontovnikas",
            "email": "martin@gon.to"
        },
        {
            "name": "Germán Lena",
            "email": "german.lena@gmail.com"
        }
    ]
}

{

"name": "auth0/basic-webapp-sample",

"description": "Basic sample for securing a WebApp with Auth0",

"require": {

"vlucas/phpdotenv": "2.4.0",

"auth0/auth0-php": "~5.0"

"license": "MIT",

"authors": [

{

"name": "Martin Gontovnikas",

"email": "martin@gon.to"

{

"name": "Germán Lena",

"email": "german.lena@gmail.com"

}

]

}

Библиотека vlucas / phpdotenv используется для инициализации переменных среды из файла .env. Таким образом, она позволяет отделить конфигурацию от кода, который изменяется между средами.

С другой стороны, пакет auth0 / auth0-php позволяет настроить авторизацию в приложении.

Настроить переменные среды

Затем, давайте настроим конфигурацию нашего приложения в файле .env. Идем дальше и создаем файл .env, копируя его из файла .env.example.

cp .env.example .env

1	cp .env.example .env

Он содержит значения конфигурации, которые будут использоваться библиотекой Auth0.

AUTH0_CLIENT_ID={CLIENT_ID}
AUTH0_DOMAIN={DOMAIN_NAME}
AUTH0_CLIENT_SECRET={CLIENT_SECRET}
AUTH0_CALLBACK_URL={CALLBACK_URL}
AUTH0_AUDIENCE=

AUTH0_CLIENT_ID={CLIENT_ID}

AUTH0_DOMAIN={DOMAIN_NAME}

AUTH0_CLIENT_SECRET={CLIENT_SECRET}

AUTH0_CALLBACK_URL={CALLBACK_URL}

AUTH0_AUDIENCE=

Вы должны найти большинство настроек в разделе Приложения> Стандартное приложение> Настройки на панели управления Auth0. Обратите внимание, что я использую приложение по умолчанию, созданное системой. Конечно, вы можете пойти и создать новое приложение, если хотите это сделать.

AUTH0_CALLBACK_URL — это URL вашего приложения, в котором Auth0 будет перенаправлять пользователей после входа в систему и выхода из системы. Значение, заданное в этом поле, должно быть настроено в разделе Разрешенные обратные вызовы в настройках приложения на панели управления Auth0.

Вход в систему без пароля по email

Чтобы включить вход в систему без пароля с помощью электронной почты, откройте Подключения > Без пароля на панели управления Auth0 и включите параметр Email.

В большинстве случаев настройки по умолчанию в разделе Email просто работают из коробки. Конечно, если вы хотите изменить какие-либо настройки, сделайте это. Не забудьте включить приложения, для которых вы хотите аутентификацию без пароля, в Connections > Passwordless > Email > Applications.

При первоначальной настройке мы можем продолжить и создать файл, который реализует вход без пароля с использованием электронной почты.

Реализация входа в систему без пароля

Идем дальше и создаем файл email_auth_example.php со следующим содержимым.

<?php
  // Require composer autoloader
  require __DIR__ . '/vendor/autoload.php';
 
  require __DIR__ . '/dotenv-loader.php';
 
  use Auth0\SDK\Auth0;
 
  $domain        = getenv('AUTH0_DOMAIN');
  $client_id     = getenv('AUTH0_CLIENT_ID');
  $client_secret = getenv('AUTH0_CLIENT_SECRET');
  $redirect_uri  = getenv('AUTH0_CALLBACK_URL');
  $audience      = getenv('AUTH0_AUDIENCE');
 
  if($audience == ''){
    $audience = '//' . $domain . '/userinfo';
  }
 
  $auth0 = new Auth0([
    'domain' => $domain,
    'client_id' => $client_id,
    'client_secret' => $client_secret,
    'redirect_uri' => $redirect_uri,
    'audience' => $audience,
    'scope' => 'openid profile',
    'persist_id_token' => true,
    'persist_access_token' => true,
    'persist_refresh_token' => true,
  ]);
 
  $userInfo = $auth0->getUser();
?>
<html>
    <head>
        <script src="//code.jquery.com/jquery-3.1.0.min.js" type="text/javascript"></script>
 
        <meta name="viewport" content="width=device-width, initial-scale=1">
 
        <!-- font awesome from BootstrapCDN -->
        <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
        <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">
 
        <link href="public/app.css" rel="stylesheet">
    </head>
    <body class="home">
        <div class="container">
            <div class="login-page clearfix">
              <?php if(!$userInfo): ?>
                <script src="//cdn.auth0.com/js/lock/11.6.1/lock.min.js"></script>
                <script type="text/javascript">
                  function login() {
                    var lock = new Auth0LockPasswordless('<?php echo $client_id; ?>', '<?php echo $domain; ?>', {
                      allowedConnections: ['email'],           // Should match the Email connection name, it defaults to 'email'     
                      passwordlessMethod: 'code',              // If not specified, defaults to 'code'
                      auth: {
                        redirectUrl: '<?php echo $redirect_uri; ?>',
                        responseType: 'code'
                      }
                    });
 
                    lock.show();
                  }
                </script>
 
                <a href="javascript:login()">Passwordless Login Using Email</a>
              <?php else: ?>
                <div class="logged-in-box auth0-box logged-in">
                  <h1 id="logo"><img src="//cdn.auth0.com/samples/auth0_logo_final_blue_RGB.png" /></h1>
                  <img class="avatar" src="<?php echo $userInfo['picture'] ?>"/>
                  <h2>Welcome <span class="nickname"><?php echo $userInfo['nickname'] ?></span></h2>
                  <a class="btn btn-warning btn-logout" href="/logout.php">Logout</a>
                </div>
              <?php endif ?>
            </div>
        </div>
    </body>
</html>

<?php

// Require composer autoloader

require __DIR__ . '/vendor/autoload.php';

require __DIR__ . '/dotenv-loader.php';

use Auth0\SDK\Auth0;

$domain = getenv('AUTH0_DOMAIN');

$client_id = getenv('AUTH0_CLIENT_ID');

$client_secret = getenv('AUTH0_CLIENT_SECRET');

$redirect_uri = getenv('AUTH0_CALLBACK_URL');

$audience = getenv('AUTH0_AUDIENCE');

if($audience == ''){

$audience = '//' . $domain . '/userinfo';

}

$auth0 = new Auth0([

'domain' => $domain,

'client_id' => $client_id,

'client_secret' => $client_secret,

'redirect_uri' => $redirect_uri,

'audience' => $audience,

'scope' => 'openid profile',

'persist_id_token' => true,

'persist_access_token' => true,

'persist_refresh_token' => true,

]);

$userInfo = $auth0->getUser();

<html>

<head>

</head>

<?php if(!$userInfo): ?>

function login() {

var lock = new Auth0LockPasswordless('<?php echo $client_id; ?>', '<?php echo $domain; ?>', {

allowedConnections: ['email'], // Should match the Email connection name, it defaults to 'email'

passwordlessMethod: 'code', // If not specified, defaults to 'code'

auth: {

redirectUrl: '<?php echo $redirect_uri; ?>',

responseType: 'code'

}

});

lock.show();

}

</script>

<a href="javascript:login()">Passwordless Login Using Email</a>

<?php else: ?>

<h2>Welcome <span class="nickname"><?php echo $userInfo['nickname'] ?></span></h2>

<a class="btn btn-warning btn-logout" href="/logout.php">Logout</a>

</div>

<?php endif ?>

</div>

</body>

</html>

В начале мы включили автозагрузчики, которые отвечают за загрузку классов, связанных с переменной Auth0 и средой.

После этого мы инициализируем конфигурационные переменные из файла .env, используя функцию getenv.

Затем мы вызываем метод getUser объекта Auth0, чтобы проверить, присутствует ли какой-либо активный сеанс. Исходя из этого, мы показываем ссылку SignIn если нет активного сеанса. В противном случае отображается имя пользователя вошедшего в систему пользователя со ссылкой Logout.

Запустите файл email_auth_example.php, чтобы протестировать ваше приложение!

Вход в систему без пароля по SMS

Чтобы включить вход в систему без пароля с помощью SMS, перейдите в раздел Connections > Passwordless на панели управления Auth0 и включите параметр SMS. По умолчанию Auth0 использует службу Twilio для отправки сообщений. Итак, создайте себе аккаунт Twilio.

На панели инструментов Twilio получите свои ACCOUNT SID и AUTH TOKEN и введите эти значения в поля Twilio SID и Twilio AuthToken в разделе Connections > Passwordless > SMS > Settings на панели управления Auth0.

Кроме того, вам необходимо создать новую службу обмена сообщениями в SMS > Messaging Services на панели инструментов Twilio. После успешного создания службы вы получите идентификатор службы, и это то, что вам нужно будет ввести в поле SID Copilot в Connections > Passwordless > SMS > Settings.

Наконец, давайте посмотрим, как работает пароль без пароля с помощью SMS. Создайте файл sms_auth_example.php. Содержимое такое же, как email_auth_example.php, за исключением функции login() , которая выглядит следующим образом.

function login() {
  var lock = new Auth0LockPasswordless('<?php echo $client_id; ?>', '<?php echo $domain; ?>', {
    allowedConnections: ['sms'],             // Should match the SMS connection name  
      auth: {
        redirectUrl: '<?php echo $redirect_uri; ?>',
        responseType: 'code'
      }
    });
  lock.show();
};

function login() {

var lock = new Auth0LockPasswordless('<?php echo $client_id; ?>', '<?php echo $domain; ?>', {

allowedConnections: ['sms'], // Should match the SMS connection name

auth: {

redirectUrl: '<?php echo $redirect_uri; ?>',

responseType: 'code'

}

});

lock.show();

};

Все почти то же самое, за исключением того, что мы предоставили sms вместо email в свойстве allowedConnections.

Запустите файл sms_auth_example.php, чтобы протестировать ваше приложение!

Заключение

Сегодня мы изучили вход в систему без пароля с помощью службы Auth0. Среди возможных доступных методов мы применили методы электронной почты и SMS с примерами кода. Не стесняйтесь оставлять какие-либо мысли или вопросы в ленте снизу!

Автор: Sajal Soni

Источник: //code.tutsplus.com/

Редакция: Команда webformyself.

Метки: PHP