Перейти к содержанию

Единая авторизация (SSO)

Единая авторизация (англ. Single Sign-On) — технология, при использовании которой аутентификация пользователя происходит на вашем сайте, при этом аутентифицированный пользователь получает доступ к сервисам платформы Shoppilot без повторной аутентификации.

Shoppilot использует JSON Web Token (JWT) для безопасного обмена данными пользователя.

Логин

После включения SSO в личном кабинете запросы на аутентификацию отправляются на указанный внешний URL.

Шаги, которые выполняются в процессе обмена данными:

  1. Неаутентифицированный в Shoppilot пользователь нажимает на вашем сайте кнопку «Оставить отзыв»
  2. Скрипт Shoppilot открывает всплывающее окно с указанным URL (например, https://yoursite.ru/shoppilot-sso)
  3. Ваш сайт аутентифицирует пользователя (например, отображает форму логина/регистрации)
  4. Ваш сайт создает JWT токен, который содержит информацию о пользователе
  5. И делает редирект на URL https://app.shoppilot.ru/auth/sso/jwt/login?token=TOKEN&store_id=STORE_ID
  6. После этого всплывающее окно автоматически закроется (в ответе будет скрипт, который вызывает window.close()) и отзыв отправится в Shoppilot.

Все процессы происходят в браузере, прямого взаимодействия вашего сайта и платформы Shoppilot нет.

Как сформировать JWT токен читайте ниже.

Логаут

Чтобы разлогинить пользователя, нужно сформировать JWT токен аналогичным образом, но отправить его на https://app.shoppilot.ru/auth/sso/jwt/logout?token=TOKEN&store_id=STORE_ID.

Допустим, пользователь разлогинился на вашем сайте и вы хотите, чтобы Shoppilot также его разлогинил. Возможные варианты:

Через редирект

После логаута на вашем сайте вы формируете токен, добавляя "return_to": "https://yoursite.ru" в payload, и делаете редирект на https://app.shoppilot.ru/auth/sso/jwt/logout?token=TOKEN&store_id=STORE_ID. Тогда пользователь разлогинится в Shoppilot и сразу будет отправлен на https://yoursite.ru.

Через iframe

После логаута на вашем сайте вы формируете токен и создаете на странице скрытый фрейм <iframe src="https://app.shoppilot.ru/auth/sso/jwt/logout?token=TOKEN&store_id=STORE_ID".

Чтобы очистить форму отзыва и заставить скрипт Shoppilot «забыть» об уже загруженной сессии пользователя, достаточно закрыть Омнибокс:

1
2
var Omnibox = Shoppilot.require('omnibox');
Omnibox.close({force: true});

При следующем взаимодействии с формами Shoppilot устаревшей сессии уже не будет (пользователь будет анонимен).

Свой JS сценарий

По умолчанию, скрипт Shoppilot открывает SSO диалог в новом окне (window.open()). Если вам это не подходит, можно написать свой обработчик SSO, например, открывающий форму входа в модальном окне.

Обработчик — функция без аргументов, возвращающая Promise (then-able object). Скрипту Shoppilot нужно указать ваш обработчик одним из двух способов:

1
2
3
4
5
// Через команду
_shoppilot.push(['_setSSOHandler', function () { /* */ }]);

// Через JS API
Shoppilot.require('user_config').set('sso_handler', function () { /* */ });

В примере ниже минималистичный обработчик, который логинит пользователя по заранее сгенерированному JWT токену, используя скрытый iframe.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
const TOKEN = 'YOUR_JWT';
const STORE_ID = 'YOUR_STORE_ID';
const BASE_SSO_URL = 'https://app.shoppilot.ru/auth/sso/jwt';

let addIframe = function (src) {
  let iframe = document.createElement('iframe');
  iframe.style = 'position:absolute;opacity:0;width:1px;height:1px;top:-1px;left:-1px;';
  iframe.src = src;
  document.body.appendChild(iframe);
};

// Подход с iframe не работает в некоторых браузерах
// Чтобы его использовать в production, потребуется специальная интеграция с настройкой DNS
let login = addIframe.bind(this, `${BASE_SSO_URL}/login?token=${TOKEN}&store_id=${STORE_ID}`);
let logout = addIframe.bind(this, `${BASE_SSO_URL}/logout?token=${TOKEN}&store_id=${STORE_ID}`);

let SSOHandler = function () {
  return new Promise(function (resolve, reject) {
    let Omnibox = Shoppilot.require('omnibox');
    Omnibox.hide();
    login();                  // Ваш сценарий
    setTimeout(function () {  // Таймаут для симуляции работы сценария
      Omnibox.show();
      resolve();
    }, 2000)
  });
};

Shoppilot.require('user_config').set('sso_handler', SSOHandler);

Авто-логин

Бывает так, что пользователь залогинен на сайте, но не залогинен в Shoppilot. В таком случае можно провести процедуру SSO невидимо для пользователя. Для этого используется метод JS API backgroundLogin.

Включение SSO

  1. Перейти в раздел Настройки компании -> Омнибокс -> Аутентификация
  2. Разрешить запрашивать аутентификацию при написании отзыва
  3. Выбрать способ аутентификации Single Sign-On (SSO)
  4. Заполнить секретный ключ для подписи JWT токена
  5. Заполнить URL аутентификации на вашем сайте (см. шаг 2)

Настройки SSO в личном кабинете

JWT Токен

Токен состоит из трех частей, разделенных точкой (.):

  1. Заголовок
  2. Полезные данные
  3. Подпись

Заголовок

Заголовок состоит из двух полей: тип токена и алгоритм формирования подписи:

1
2
3
4
{
  "alg": "HS256",
  "typ": "JWT"
}

Полезные данные

Полезные данные содержат обязательные и необязательные поля.

Параметр Обязательный Описание
jti да Уникальный идентификатор токена
iss да Store Id
iat да Время выпуска токена (Unix epoch)
email да Email
name да Полное имя
exp нет Время экспирации токена (Unix epoch)
picture нет URL аватара
phone нет Телефон
external_id нет Уникальный идентификатор пользователя
custom_attributes нет Произвольные атрибуты

Пример:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
{
              "jti": "b219a441cfc9e6419fe87d1ed55eae7a",
              "iss": "57a1dd0955b4a36599000003",
              "iat": "1471512369",
              "exp": "1471512400",
            "email": "grushenka@yandex.ru",
             "name": "Аграфена Петрова",
            "phone": "+79651755423",
      "external_id": "12345",
"custom_attributes": {"eye_colour": "racing green"}
}

Подпись

Чтобы создать подпись, необходимо иметь закодированные с помощью алгоритма Base64 заголовок и полезные данные, а также секретный ключ.

Пример формирования токена (псевдокод):

1
2
3
4
5
6
7
header      = {...}
header64    = base64UrlEncode(header)
payload     = {...}
payload64   = base64UrlEncode(payload)
signature   = HMACSHA256(header64 + "." + payload64, <YOUR SECRET CODE>)
signature64 = base64UrlEncode(signature)
token       = header64 + "." + payload64 + "." + signature64

Секретный код (YOUR SECRET CODE) указывается в личном кабинете.

Полезные ресурсы