Использование неявного потока OpenId Connect в onelogin

Архитектура

Введение

onelogin поддерживает различные режимы подключения OpenId Connect.В прошлой статье мы говорили о потоке аутентификации с использованием openId.Сегодня мы объясним, как использовать неявный поток.

OpenId Implicit Flow

Неявный поток также называется неявным предоставлением.

На рисунке выше показан пример неявной авторизации, в отличие от режима кода авторизации сервер аутентификации возвращает фрагмент токена доступа, только этот фрагмент мы не можем получить токен доступа.

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

Режим неявной авторизации обычно используется, когда приложения или веб-сайты не имеют фоновой логики. Другими словами, вся авторизация выполняется на внешнем интерфейсе.

Особенно для таких одностраничных приложений режим неявного предоставления особенно полезен.

Давайте еще раз взглянем на неявный процесс авторизации в onelogin:

  1. Пользователь пытается установить соединение с вашим клиентским приложением, запрос будет перенаправлен на onelogin с настроенным уникальным client_id.

  2. onelogin будет аутентифицировать и авторизовать информацию о пользователе.

  3. Информация авторизованного пользователя будет передана на адрес обратного вызова, настроенный в onelogin, в виде id_token (JWT).

  4. Клиентское приложение использует открытый ключ onelogin для проверки id_token, если все в порядке, соединение будет установлено.

Мы рассматриваем безопасность режима неявной авторизации.

В режиме неявной авторизации клиентское приложение должно получить открытый ключ от onelogin, а затем использовать открытый ключ для анализа id_token, возвращенного onelogin.

Хотя злоумышленники могут получить открытый ключ client_id и onelogin, возвращенный id_token будет отправлен только на настроенный адрес обратного вызова, поэтому он по-прежнему безопасен.

Создать конфигурацию onelogin

Хотя мы создали приложение в onelogin в предыдущей статье, из-за другого обратного вызова здесь мы создаем новое приложение.

Заполните наш обратный адрес:http://localhost:3000

Остальные аналогичны предыдущей конфигурации.

Давайте взглянем на последнюю конфигурацию SSO:

Здесь нам нужно сохранить последний client_ID, потому что это не режим Authentication Flow, нам не нужно использовать client_secret.

Обратите внимание на два URL-адреса эмитента, где хранится информация о конфигурации onelogin.

Работа страницы и процесс запроса

Качаем неявно авторизованное одностраничное приложение с примера официального сайта onelogin.

GitHub.com/один логин/на…

Измените конфигурацию OIDC в ​​javascript/main.js:

const ONELOGIN_CLIENT_ID = '90a0e970-f2b6-0138-6171-0a5535c40b31178911';
const ONELOGIN_SUBDOMAIN = 'flydean-dev';

Затем запустите npm install;npm start, чтобы запустить одностраничное приложение.

Нажмите кнопку входа, он перейдет к интерфейсу входа в систему onelogin:

Введите имя пользователя и пароль, и мы вернемся на страницу локального хоста.

Здесь мы позвонимFloyd Press — Dev.one login.com/o IDC/2/cert…Перейдите, чтобы получить открытый ключ onelogin.

С помощью этого открытого ключа и возвращенного id_token вы можете получить информацию о пользователе.

ключевой код

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

Для того, чтобы использовать протокол openid, в примере здесь используется oidc-client.min.js, через который осуществляется подключение протокола openid.

Ниже приведена информация о конфигурации openid connect на странице:

var settings = {    
    authority: 'https://' + ONELOGIN_SUBDOMAIN + '.onelogin.com/oidc/2',
    client_id: ONELOGIN_CLIENT_ID,
    redirect_uri: window.location.origin,
    response_type: 'id_token token',
    scope: 'openid profile',

    filterProtocolClaims: true,
    loadUserInfo: true
};

С помощью этой информации о конфигурации мы можем создать менеджер oidc:

var mgr = new Oidc.UserManager(settings);

Код ключа очень прост, когда вы нажимаете «Войти», вам нужно перейти к onelogin, чтобы авторизоваться:

function redirectToLogin(e) {
  e.preventDefault();

  mgr.signinRedirect({state:'some data'}).then(function() {
      console.log("signinRedirect done");
  }).catch(function(err) {
      console.log(err);
  });
}

После завершения авторизации, после перехода обратно на локальную страницу, вам необходимо проверить информацию обратного вызова, разобрать информацию о пользователе из информации и отобразить ее на странице:

function processLoginResponse() {
  mgr.signinRedirectCallback().then(function(user) {
      console.log("signed in", user);

      document.getElementById("loginResult").innerHTML = '<h3>Success</h3><pre><code>' + JSON.stringify(user, null, 2) + '</code></pre>'

  }).catch(function(err) {
      console.log(err);
  });
}

Вся логика инкапсулирована в oidc-client.min.js, что очень удобно для программистов.

Суммировать

Вышеизложенное является основной идеей и процессом использования неявного потока OpenId Connect в onelogin. Надеюсь, всем понравится.

Автор статьи: о программе flydean

Ссылка на эту статью:Уууу. Флойд нажал .com/open ID-imp...  

Источник этой статьи: блог flydean

Добро пожаловать на мой официальный аккаунт: самая популярная интерпретация, самая глубокая галантерея, самые краткие уроки и множество трюков, о которых вы не знаете, ждут вас!

Категории