Вход через социальные сети для аккаунтов клиентов

Помимо стандартного входа без пароля для аккаунтов клиентов, вы можете подключить свои аккаунты Google и Facebook, чтобы клиенты могли входить в систему, используя реквизиты для входа в социальные сети.

Активация входа через социальные сети для аккаунтов клиентов позволяет ускорить этот процесс благодаря использованию знакомых способов аутентификации. В своем магазине вы можете активировать сразу несколько вариантов входа через социальные сети.

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

Что нужно учесть при подключении входа через социальные сети к аккаунтам клиентов

Ознакомьтесь со следующей информацией перед подключением входа через социальные сети к аккаунтам клиентов:

  • У вас должен быть аккаунт разработчика для поставщика, которого вы хотите подключить к аккаунтам клиентов.
  • При использовании входа через социальные сети с Shopify синхронизируется только адрес электронной почты клиента.

Подключение Google к аккаунтам клиентов

Чтобы подключить Google к аккаунтам клиентов, необходимо поочередно выполнить следующие задачи:

В процессе настройки вам нужно будет переключаться между вкладками браузера для Google Cloud Console и панелью администратора Shopify. Для подключения Google к аккаунтам клиентов у вас должен быть настроен аккаунт Google Cloud. Подробнее о Google Cloud можно узнать в справочной документации Google.

Шаг 1. Откройте страницу «Вход с Google» в панели администратора Shopify

  1. В панели администратора Shopify перейдите в раздел Настройки > Аккаунты клиентов.

  2. В разделе Аутентификация нажмите Управлять.

  3. Нажмите Подключить рядом с Google, чтобы открыть страницу Вход с Google.

На этой странице содержится информация, которую необходимо скопировать и вставить при настройке клиента OAuth для вашего приложения Google. Держите эту страницу открытой на отдельной вкладке браузера.

Шаг 2. Создайте приложение в Google Cloud Console

  1. На другой вкладке браузера выполните вход в свою Google Cloud Console.
  2. Выберите существующий проект или создайте новый. Вы будете перенаправлены на панель управления проектом.
  3. Нажмите Меню, а затем — API и сервисы > Учетные данные.
  4. Нажмите Настроить окно запроса доступа > Начать.
  5. Заполните данные для настройки OAuth в вашем проекте:
    1. Дайте приложению название, которое будет узнаваемо для клиентов (например, название вашего интернет-магазина). Укажите адрес электронной почты для технической поддержки и нажмите Далее.
    2. В разделе Аудитория выберите Внешняя, а затем нажмите Далее.
    3. Укажите контактный адрес электронной почты для получения уведомлений от Google о вашем проекте и нажмите Далее.
    4. Примите Политику использования пользовательских данных сервисов API Google и нажмите Продолжить.
    5. Нажмите Создать.
  6. Настройте информацию о политике приложения, которая будет отображаться для клиентов в окне запроса доступа:
    1. Нажмите Брендинг.
    2. В разделе Домен приложения укажите ссылку на вашу главную страницу, а также ссылки на общедоступную политику конфиденциальности и условия обслуживания. Подробнее о создании политик магазина.

Шаг 3. Настройте клиент OAuth вашего приложения в Google Cloud Console

На этом шаге необходимо скопировать данные из раздела Инструкции по настройке на странице Вход с Google в панели администратора Shopify и вставить их в соответствующие поля на вкладке Google Cloud Console.

  1. В приложении вашего проекта в Google Cloud Console нажмите Обзор.
  2. В разделе Метрики нажмите Создать клиент OAuth.
  3. Настройте параметры клиента OAuth:
    1. В выпадающем меню Тип приложения выберите Веб-приложение.
    2. В поле Название введите название.
  4. Настройте Разрешенные источники JavaScript для вашего приложения:
  5. В разделе Разрешенные источники JavaScript нажмите + Добавить URI.
  6. На странице Вход с Google в панели администратора Shopify скопируйте значение из поля Разрешенные источники JavaScript.
  7. В Google Cloud Console вставьте это значение в поле URI 1.
  8. Если в разделе Разрешенные источники JavaScript в вашей панели администратора Shopify указано несколько URI, повторите эти шаги для дополнительных полей URI.
  9. Настройте Разрешенные URI перенаправления для вашего приложения:
  10. В Google Cloud Console в разделе Разрешенные URI перенаправления нажмите + Добавить URI.
  11. На вкладке браузера с панелью администратора Shopify скопируйте значение из поля Разрешенный URI перенаправления.
  12. Вернитесь в Google Cloud Console и вставьте это значение в поле URI 1.
  13. Если в разделе Разрешенные URI перенаправления в вашей панели администратора Shopify указано несколько URI, повторите эти шаги для дополнительных полей URI.
  14. В Google Cloud Console нажмите Создать.

Не закрывайте появившееся диалоговое окно Создан клиент OAuth до перехода к Шагу 4: Настройка реквизитов для входа в панели администратора Shopify, поскольку вам потребуется скопировать информацию из Google Cloud Console и вставить ее в панель администратора Shopify.

Шаг 4: Настройте реквизиты для входа в панели администратора Shopify

  1. В диалоговом окне Создан клиент OAuth в Google Cloud Console скопируйте Идентификатор клиента.
  2. На странице Вход с помощью Google в панели администратора Shopify, в разделе Реквизиты для входа, вставьте Идентификатор клиента.
  3. В диалоговом окне Создан клиент OAuth в Google Cloud Console скопируйте Секрет клиента.
  4. На странице Вход с помощью Google в панели администратора Shopify в разделе Реквизиты для входа вставьте Секрет клиента.
  5. На странице Вход с помощью Google в панели администратора Shopify нажмите Сохранить.

Шаг 5: Опубликуйте приложение в Google Cloud Console

  1. В приложении вашего проекта в Google Cloud Console нажмите Аудитория.
  2. Нажмите Опубликовать приложение.

Подключение Facebook к аккаунтам клиентов

Чтобы подключить Facebook к аккаунтам клиентов, необходимо выполнить следующие задачи по порядку:

Во время настройки вам нужно будет переключаться между вкладками браузера с панелью управления Meta for Developers и панелью администратора Shopify. Чтобы подключить Facebook к аккаунтам клиентов, у вас должен быть аккаунт разработчика Meta. Узнайте, как зарегистрироваться в качестве разработчика Meta.

Шаг 1: Откройте страницу «Вход с помощью Facebook» в панели администратора Shopify

  1. В панели администратора Shopify перейдите в раздел Настройки > Аккаунты клиентов.

  2. В разделе Аутентификация нажмите Управлять.

  3. Нажмите Подключить рядом с Facebook, чтобы открыть страницу Вход с помощью Facebook.

Шаг 2: Создайте приложение на панели управления Meta for Developers

  1. В отдельной вкладке браузера перейдите на панель управления Meta for Developers и нажмите Вход, чтобы войти в систему. Если у вас нет аккаунта разработчика Meta, вам необходимо создать новый аккаунт на странице входа, прежде чем переходить к следующему шагу.
  2. Нажмите Приложения.
  3. Нажмите Создать приложение.
  4. Заполните поля Название приложения и Контактный адрес электронной почты приложения, а затем нажмите Далее.
  5. На странице Добавить сценарии использования выберите Аутентификация и запрос данных у пользователей с помощью входа через Facebook, а затем нажмите Далее.
  6. На странице Какое бизнес-портфолио вы хотите подключить к этому приложению? выберите бизнес-портфолио или выберите Я пока не хочу подключать бизнес-портфолио., а затем нажмите Далее.
  7. Ознакомьтесь с информацией на странице Требования к публикации, а затем нажмите Далее.
  8. Ознакомьтесь с информацией на странице Обзор, а затем нажмите Перейти на панель управления.

Шаг 3: Настройте параметры приложения Meta

  1. После создания приложения на панели управления Meta for Developers нажмите Сценарии использования.
  2. Для сценария использования Аутентификация и запрос данных у пользователей с помощью входа через Facebook нажмите Настроить.
  3. Чтобы гарантировать сбор информации о клиентах при входе в систему, в разделе Разрешения и функции рядом с email нажмите Добавить.
  4. Нажмите Настройки и перейдите в раздел Настройки клиента OAuth.
  5. На странице Вход с помощью Facebook в панели администратора Shopify скопируйте URL-адрес перенаправления из раздела URL-адреса перенаправления.
  6. На странице Настройки на панели управления Meta for Developers вставьте URL-адрес перенаправления в поле Действительные URI перенаправления OAuth.
  7. Если в разделе URL-адреса перенаправления в панели администратора Shopify указано несколько URL-адресов перенаправления, повторите эти действия для дополнительных URL-адресов перенаправления.
  8. На странице Вход с помощью Facebook в панели администратора Shopify скопируйте URL-адрес из раздела URL-адрес отмены авторизации.
  9. На странице Настройки на панели управления Meta for Developers вставьте URL-адрес в поле URL-адрес обратного вызова для отмены авторизации.
  10. На странице Настройки на панели управления Meta for Developers нажмите Сохранить изменения.

Шаг 4: Настройте реквизиты для входа в панели администратора Shopify

  1. Нажмите значок Главная, чтобы вернуться на панель управления Meta for Developers, а затем выберите Настройки приложения > Основные.
  2. Скопируйте Идентификатор приложения с панели управления Meta for Developers.
  3. На странице Вход с помощью Facebook в панели администратора Shopify вставьте идентификатор приложения в поле Идентификатор приложения в разделе Реквизиты для входа.
  4. На панели управления Meta for Developers нажмите Показать рядом с полем Секрет приложения, а затем скопируйте Секрет приложения.
  5. На странице Вход с помощью Facebook в панели администратора Shopify вставьте секрет приложения в поле Секрет приложения, а затем нажмите Сохранить.
  6. В панели администратора Shopify нажмите Сохранить изменения.

Шаг 5: Протестируйте и активируйте вход с помощью Facebook

  1. На странице Вход с помощью Facebook в панели администратора Shopify нажмите Дополнительные действия > Предварительный просмотр, а затем протестируйте процесс аутентификации Facebook, как если бы вы были клиентом, входящим в ваш магазин.
  2. Нажмите Включить.

После включения входа с помощью Facebook вы можете протестировать клиентский опыт, перейдя в свой интернет-магазин и войдя в аккаунт клиента с помощью Facebook.

Вход с помощью Shop

Если у вас активирован Shop Pay, ваши клиенты могут войти в систему со своими реквизитами для входа Shop и сохраненными ключами доступа. Клиенты также автоматически входят в систему с помощью Shop после того, как оформят заказ в вашем магазине через Shop Pay.

Вход с помощью Shop активируется автоматически для аккаунтов клиентов и может быть удален из вашего магазина только в случае деактивации Shop Pay.

Узнайте, как добавить кнопку Вход с помощью Shop в ваш магазин.

Управление параметрами входа через соцсети

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

После отключения или удаления способа входа через соцсети клиенты остаются в системе во избежание сбоев в работе. Сессии входа через соцсети истекают автоматически или когда клиенты выходят из системы.

Шаги:

  1. В панели администратора Shopify перейдите в раздел Настройки > Аккаунты клиентов.

  2. В разделе Аутентификация нажмите Управлять.

  3. Рядом со способом входа, который вы хотите изменить, нажмите меню .

  4. Выполните одно из следующих действий:

    • Чтобы изменить способ входа, нажмите Управлять, а затем обновите нужные реквизиты для входа.
    • Чтобы отключить способ входа без его удаления, нажмите Отключить.
    • Чтобы удалить способ входа, нажмите Удалить, а затем нажмите Удалить в диалоговом окне.

Обновление входов через соцсети при изменении домена аккаунтов клиентов

Если вы планируете изменить домен аккаунтов клиентов на другой URL, то вам нужно обновить настройки входа через соцсети, прежде чем вносить изменения в Shopify. Это гарантирует, что клиенты смогут беспрепятственно входить в систему.

Эти шаги необходимы, когда вы обновляете URL аккаунтов клиентов в Shopify с устаревшего формата, такого как shopify.com/1234567890/account, на новый формат поддомена account.your-store.com, или с существующего поддомена на другой поддомен, например при обновлении account.your-store.com до customers.your-store.com.

Добавление нового поддомена аккаунтов клиентов в настройки социальных провайдеров

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

Вам нужно повторить эти шаги для каждого активированного вами способа входа через соцсети.

Шаги:

Google
  1. Перейдите в Google Cloud Console и откройте API и сервисы > Учетные данные.
  2. Выберите клиент OAuth 2.0, созданный для Shopify.
  3. В разделе Разрешенные источники JavaScript добавьте новую запись. Например: https://account.your-store.com
  4. В разделе Разрешенные URI перенаправления добавьте новую запись. Например: https://account.your-store.com/authentication/social/google/callback
  5. В разделе URL обратного вызова для отмены авторизации добавьте новую запись. Например: https://account.your-store.com/authentication/social/google/revoke
  6. Сохраните изменения. Пока оставьте как старый, так и новый URL.
  7. Вернитесь в панель администратора Shopify и выполните шаги для изменения домена аккаунтов на новый URL пользовательского поддомена в Shopify.
  8. Проверьте процессы входа и выхода для каждого способа входа через соцсети на вашей витрине, чтобы убедиться, что все работает.
  9. Необязательно. Убедившись, что процесс входа работает корректно, вы можете вернуться в Google и удалить старые записи домена.
Facebook
  1. Перейдите в Meta for Developers и откройте свое приложение.
  2. Перейдите в раздел Вход через Facebook > Настройки.
  3. В разделе Действительные URI перенаправления для OAuth добавьте новую запись. Например: https://account.your-store.com/authentication/social/facebook/callback
  4. В разделе URL обратного вызова для отмены авторизации добавьте новую запись. Например: https://account.your-store.com/authentication/social/facebook/revoke
  5. Перейдите в Настройки > Основное.
  6. В разделе Домены приложения добавьте новую запись. Например: account.your-store.com
  7. Сохраните изменения. Пока оставьте как старый, так и новый URL.
  8. Вернитесь в панель администратора Shopify и выполните шаги для изменения домена аккаунтов на новый URL пользовательского поддомена в Shopify.
  9. Проверьте процессы входа и выхода для каждого способа входа через соцсети на вашей витрине, чтобы убедиться, что все работает.
  10. Необязательно. Убедившись, что процесс входа работает корректно, вы можете вернуться в Facebook и удалить старые записи домена.