Регистрация через соцсети php
PHPixie Social — простая интеграция с соцсетями
Авторизация через соцсети это одна из самих частых задач с которыми сталкиваются разработчики развлекательных сайтов. Казалось бы там и делать нечего, ведь для каждого API существует PHP библиотека от самого вендора. Но что делать если надо подключить сразу несколько? Не хочется тянуть в проект кучу библиотек которые имплементируют один и тот же протокол OAuth, к тому же хотелось бы иметь какой-то единый интерфейс. PHPixie Social — маленькая библиотека с только одной зависимостью, которая позволяет легко работать сразу с Facebook, Twitter, Google и Вконтакте, а если вы используете PHPixie фреймворк то также сразу получаете авторизацию всего в несколько строчек кода.
Но сначала рассмотрим компонент сам по себе.
Итак первое что нам надо сделать это запросить у пользователя авторизацию, для этого нам понадобится придумать какую-то ссылку куда API пришлет нам токен доступа. Тогда мы перенаправляем пользователя на страницу авторизации. Вот простой пример:
Интеграция с фреймворком
В фреймворке по умолчанию доступен плагин к модулю авторизации, который обрабатывает логин пользователя и легко включается в его конфигурации. Те кто уже работает с фреймворком не найдут в этом ничего сложного, так что в этот раз вместо описания я оставлю ссылку на демо проект: https://github.com/phpixie/demo-socialauth
В нем пользователь сам выбирает через какую сеть авторизоваться. Если он зашел впервые, ему сразу-же создастся запись в табличке Users и логин запомнится через сессию. При последующем логине будет уже использоваться сущность с базы.
Чтобы попробовать Social, достаточно просто composer require phpixie/social, ну и как всегда, если у вас возникнуть какие-либо вопросы, обращайтесь сразу к нам в чат.
Авторизация на сайте с помощью ВК, простой и понятный способ на PHP!
В данной статье Вас ждет действительно рабочий,а самое главное понятный туториал, как сделать авторизацию с помощью ВК!
Я заинтересовался как сделать авторизацию, почитав официальную документацию понял, что ничего не понял. и так давайте приступим.
Если Вы заинтересованы в этом вопросе, как же все-таки сделать авторизацию используя ВК, то у Вас уже есть сайт, или как минимум вы обладаете базовыми знаниями. Для начала нам нужно создать приложение Вконтакте, самый простой шаг.
1. Переходим на сайт https://vk.com/apps?act=manage и создаем новое приложение:
2. Заполняем следующие данные:
Название: Любое, его видно только во время авторизации, например авторизовавшись на нашем сайте с помощью ВК, Вы видите это, без количества участников.
Платформа: Выбираем «Сайт»
Адрес сайта: Ссылка на ваш сайт
Базовый домен: Ссылка на ваш сайт
Отлично, нажимаем подключить сайт.
3. Переходим в настройки приложения, копируем ID приложения и Защищенный ключ, сохраняем куда-нибудь и на этом работа на стороне ВК окончена, переходим к написанию скрипта.
4. Теперь самое интересное, нам нужно написать скрипт (обработчик), давайте создадим на нашем сервере в корне сайта файл auth.php и приступим к его редактированию. Хочу отметить, что на локальном сервере (OpenServer) авторизация работать не будет! 
Открываем файл, я использую для этого PHPStorm и давайте создадим несколько переменных с пояснениями:
Тут все понятно, подставляем параметры из нашего приложения, ссылку указывать полностью, где лежит сам скрипт.
Далее формируем ссылку, которая будет ввести на сайт ВК с передаваемыми параметрами:
Ссылка сформирована, теперь нужно получить и обработать ответ от ВК, после того как пользователь перешел по ссылке:
После того как пользователь перешел по ссылке и подтвердил передачу данных, Вам на сервер в GET запросе вернется code, используя его мы запрашиваем у ВК токен пользователя, отправляем запрос в ВК с параметрами указанные в массиве
ВК возвращает нам токен пользователя, его можно сохранить в базу данных.
Теперь следующим запросом мы получаем данные о пользователе, используя его токен и обращаясь к API VK https://api.vk.com/method/users.get мы получаем json от VK, который мы можем распарсить. Давайте попробуем авторизоваться, заходим на нашу страницу и нажимаем авторизация:
Разрешаем и у нас на сайте появляются данные об аккаунте:
Авторизация работает. Далее можете сохранить ID в сессию и проверять авторизован пользователь или нет. Давайте доработаем код:
В самый конец добавляем:
А ссылку заменяем на:
Авторизация через ВК готова! Скачать исходник можно ниже
Каковы основные принципы регистрации и авторизации через социальные сети OAuth2?
Здравствуйте.
С обычной регистрацией и авторизацией все понятно.
Регистрация.
1) Получаем от пользователя логин и пароль.
2) Сохраняем в БД.
3) Используем его ID для своих целей (заказы в интернет-магазине, напр. и пр.)
Авторизация.
1) Спрашиваем у пользователя логин и пароль.
2) Если они найдены в базе, то создаем сессию.
3) Работаем все с тем же ID (отображаем персональную информацию, работаем с ней)
А вот как быть с регистрацией, авторизацией через социальные сети, объединением стандартной регистрации с соц. сетями? Что нужно хранить в БД, нужно ли вообще? Как с этим работать? Обрисуйте алгоритм.
Отвечу сам себе.
Здесь есть полезная конкретная информация о технической реализации.
Для авторизации, регистрации используется все та же таблица ‘users’. Вместе с обычной регистрацией и авторизацией, когда при регистрации (в самом простом виде) в таблицу ‘users’ добавляются email, password и login пользователя, а при авторизации проверяется соответствие введенных login’а и password’а существующим в базе данных, аналогичным образом используется и регистрация/авторизация через социальные сети. Только в данном случае источником данных о пользователе для его регистрации является не непосредственный пользователь, который вводит данные в форму, а соц. сеть. Регистрация в данном случае достаточно прозрачная, т.е. не видна пользователю. Схема примерно следующая (без особенностей работы Oauth-протокола):
Таким образом, к существующей таблице «родной» регистрации пользователей сайта присоединяется, условно говоря, таблица, поля, необходимые для регистрации/авторизации через соц. сети., и друг-другу они не мешают.
Для пользователя, зарегистрированного из соц. сети пароля и логина, естественно, нет. Они нужны для авторизации. А т.к. пользователь авторизуется с помощью своих логина и пароля в соц. сети, то и указывать здесь нечего. И еще, можно при авторизации, к запросу проверки логина и пароля, добавить условие
‘AND WHERE `auth_via`=»native»‘
, чтобы исключить пользователей, зарегистрированных из соц. сетей.
Как видно, для каждого пользователя в таблице создается внутренний (внутрисайтовый, если так можно выразиться) первичный, автоинкрементный ключ. Соответственно, нет разницы для логики сайта между пользователем, зарегистрированным через соц. сеть и через сайт. Если говорить об интернет-магазине, то, для привязки заказов к пользователю, можно использовать единый, внутренний идентификатор ID.
Как настроить регистрацию на сайте через соцсети
В статье:
Пользователь регистрируется на сайте и попадает в базу, которую владелец сайта может использовать в свою пользу: делать стимулирующие продажи рассылки, повышать лояльность и трафик, собирать статистику заказов и налаживать обратную связь с клиентами. А еще регистрация улучшает поведенческие факторы, пока пользователь находится на сайте и совершает какие-то действия.
Но для пользователя регистрация на сайте — дополнительная нагрузка, так что веб-мастер должен предложить ему удобные и быстрые варианты. Обычно дают на выбор авторизоваться в системе через email, номер телефона или профиль в социальной сети.
Регистрация на asos.com
В этом материале разберем, какими способами можно настроить регистрацию через профили в популярных в России соцсетях. Материал актуален для начинающих веб-мастеров.
Чем так хороши соцсети для регистрации
От этого способа авторизации выигрывают и клиенты, и владелец сайта.
Удобно клиентам: меньше заполнять, быстрее регистрация, учетка не теряется
Еще в 2013 году исследование показало, что 77% пользователей считают вход через соцсети хорошим решением. А в 2016 году другие исследователи выяснили, что 93% пользователей чаще выбирают способ авторизации через соцсеть. Остальные опрошенные либо не были зарегистрированы в соцсетях, либо не хотят передавать сайту личные данные профиля, для них нужно оставить возможность авторизации через email.
Регистрация по почте или телефону требует больше действий вручную, а при каждом входе придется вводить данные, если не сохранить их в браузере. Вход через соцсеть быстрее, надо только выбрать соцсеть и нажать «войти».
После того, как платформа для email-рассылок Mailchimp внедрила авторизацию через соцсети, количество неудачных попыток входа в систему снизилось на 66%. С этим способом меньше вероятность забыть логин и пароль, потому что не нужно запоминать отдельную учетку.
Полезно компании: можно собирать данные, больше вероятность репостов
Если пользователь авторизовывается через соцсеть, веб-мастер получает информацию о нем из профиля. Это может быть рабочий адрес почты, возраст, геоданные, семейное положение, интересы — то, что заполнено в профиле. А еще это значит, что пользователь точно не ввел для регистрации одноразовую почту, так что рассылка не пропадет.
Также авторизация через соцсети упрощает репосты материалов с сайта, а значит увеличивает конверсию и реферальный трафик.
Поскольку регистрация на сайте подразумевает сбор личных данных пользователей, их нужно защитить. Подготовьте сайт к работе с такими данными.
Требования к сайту по защите личных данных
В ФЗ N152-ФЗ «О персональных данных» описаны правила для законного сбора и обработки данных пользователей. За нарушения предусмотрены штрафы.
Сайт должен работать на HTTPS, то есть ему нужен ssl-сертификат.
Хостинг сайта по закону должен находиться на территории РФ.
До публикации сайта владелец или разработчик должен подать в Роскомнадзор уведомление об обработке персональных данных в бумажном или электронном виде.
На сайте должны быть:
согласие на обработку персональных данных в свободной форме;
либо ссылка на единую публичную оферту, но тогда придется хранить логи на случай требования Роскомнадзора доказать посещение сайта пользователем;
документ с политикой в отношении обработки персональных данных с перечислением информации, которые собирает сайт, и обоснованием необходимости;
уведомление о сборе cookies и других данных.
Google намерен прекратить поддержку в Chrome сторонних файлов cookie. Как это повлияет на работу сайтов, разбирали в статье.
Ссылки на документы на сайте ikea.ru
С 1 марта 2021 года вступил в силу ФЗ от 30.12.2020 № 519-ФЗ об изменении правил обработки общедоступных персональных данных, которые есть в профилях соцсетей и на сайтах объявлений. Это имя, город проживания, контакты, личные фото и другая информация.
Владельцам сайтов придется дополнить согласия на обработку персональных данных. Теперь до начала обработки нужно взять с пользователя отдельное согласие, в котором он определит конкретный перечень данных, который разрешает использовать.
Настройки cookie на booking.com
Если владелец сайта — юридическое лицо, к нему есть дополнительные требования относительно документации, штрафы за несоблюдение закона сильно выше.
Как добавить на сайт регистрацию через профили в соцсетях
Если вы предложите пользователям все существующие соцсети плюс вариант с электронной почтой, форма регистрации разрастется и будет выглядеть громоздко. Изучите вашу аудиторию и выделите парочку соцсетей, которыми пользуется большинство, добавьте регистрацию по почте или телефону и достаточно.
Регистрация на сайте lamoda.ru
Авторизация через соцсети идет по цепочке:
Пользователь выбирает регистрацию через одну из предложенных соцсетей и кликает на ее кнопку.
В приложение социальной сети приходит запрос.
Пользователя перебрасывает в закрытое защищенное приложение соцсети, которое создал веб-мастер. На экране появляется кнопка «Продолжить как…» или «Разрешить».
По клику пользователь разрешает войти в систему через учетную запись соцсети. Кликнул — разрешил передать данные.
Соцсеть отправляет сайту ключ доступа к личным данным пользователя.
Сайт отправляет соцсети запрос на получение данных и подтверждает его полученным ранее ключом доступа.
Соцсеть передает данные сайту. Количество данных может быть разным из-за того, что пользователь разрешит передать.
Для добавления регистрации через соцсети есть несколько способов — ручной и автоматизированные.
Способ 1. Ручная настройка форм для каждой социальной сети
Каждая соцсеть требует отдельных настроек:
со стороны соцсети нужно зарегистрировать сайт в системе и получить ключи;
со стороны сайта нужно настроить интеграцию с социальной сетью.
ВКонтакте
Настроить авторизацию на сайте через ВКонтакте можно с помощью API. На странице создания приложения заполните поля, в качестве платформы выберите «Сайт».
Создание приложения
Нажмите «Подключить сайт», действие нужно подтвердить через телефон или устройство с приложением. В настройках вы увидите id приложения и ключ — эти данные понадобятся для работы с API.
Список дальнейших действий подробно разобран на странице Документации для разработчиков.
Если вам нужен только ВКонтакте, можно использовать официальный виджет авторизации. На странице создания виджета нужно заполнить поля и скопировать код для вставки на сайт. Подробная документация расскажет, как правильно его вставить.
Виджет для входа через сайт ВКонтакте
Фейсбук
Зарегистрируйтесь в системе Фейсбука для разработчиков, кликните на «Создать приложение» и выберите «Создание кросс-сервисных функций:
Дальше после заполнения полей и клика на «Создать приложение» откроются настройки. Выберите «Настроить» у плашки «Вход через Facebook»:
Дальше выберите платформу — Веб, введите адрес сайта, сохраните и нажмите продолжить.
Теперь надо все настроить. Откройте настройки приложения на боковой панели, добавьте добавьте домен сайта, URL политики конфиденциальности и пользовательского соглашения.
Фейсбук придерживается общего регламента по защите данных (GDPR), согласно ему у пользователей должна быть возможность сделать запрос на удаление данных. В пункте «Удаление данных пользователей» выберите «URL инструкций для удаления данных» и вставьте ссылку на описание таких инструкций. Это обязательный пункт.
Все сохраните, Скопируйте ID приложения и секрет.
В меню настроек вашего сайта нужно найти настройку авторизации через соцсети, выбрать Фейсбук и ввести ID приложения и код секрета.
Дальше откройте настройки главы «Вход через Фейсбук»:
В настройках должны быть отметки «Да» у опций «Клиентская авторизация Oauth», «Веб-авторизация Oauth», «Требовать HTTPS» и «Использовать строгий режим для URI перенаправления». В поле «Действительные URI перенаправления для OAuth» нужна ссылка в формате http://site.ru/auth/facebook/callback. OAuth — это единый стандарт авторизации.
Сохраните изменения. Вверху вы увидите «Статус: в разработке», его нужно активировать, чтобы он сменился на «Опубликовано».
Другие соцсети настраиваются по похожему механизму с помощью API. К примеру, в Одноклассниках тоже надо начать с создания приложения, у Твиттера также есть платформа для разработчиков. Быстрее это можно сделать через инструменты или плагины.
Способ 2. Сервисы для настройки авторизации через соцсети
Это не все существующие сервисы, но более-менее популярные из тех, что нам встретились, по большей части платные. Если вы используете что-то из перечисленного, дайте свой отзыв в комментариях!
ULogin
Простой генератор универсального кода для вставки виджета авторизации через соцсети. Нужно выбрать внешний вид, найти из списка CMS вашего сайта или выбрать универсальный вариант для всех и код виджета готов. Русскояызчный..
Akamai
Более серьезный сервис. Поможет настроить авторизацию через Фейсбук, LinkedIn, PayPal, Твиттер и Yahoo!, есть функциональность для сбора и анализа информации из пользовательских профилей. Интерфейс на английском.
Gigya
Подходит для установки регистрации через ВКонтакте, Facebook, Twitter и LinkedIn,интеграции с другими сервисами и платформами, а также для обработки статистики по зарегистрированным пользователям. Интерфейс на английском.
Способ 3. CMS-плагины для регистрации на сайте через соцсети
Если пользуетесь CMS, можно поискать решение через модули и расширения в каталогах.
WordPress
Для этого движка есть много расширений, к примеру:
miniOrange Social Login для регистрации через ВКонтакте, Твиттер, Инстаграм, Фейсбук и другие соцсети. Есть дополнительные премиальные возможности, например, отправка приветственных писем зарегистрировавшимся;
Social Login & Register тоже предлагает много соцсетей, среди которых ВКонтакте, Фейсбук, Инстаграм, Твиттер и другие. Есть возможность аналитики данных пользователей;
Social Login by BestWebSoft для добавления формы авторизации через соцсети и комментирования. Работает с Фейсбуком, Твиттером, аккаунтом Google и LinkedIn;
Super Socializer включает в себя не только авторизацию, но и возможность делать репосты и комментировать контент на сайте через профили в соцсетях.
Joomla
Модулей авторизации довольно много, а работа с ними одинаковая: установить модуль, зарегистрировать специальное приложение в соцсети и получить ключи, как мы писали в примерах с ВКонтакте и Фейсбуком, добавить эти данные в настройки модуля и опубликовать.
Модули можно найти в разделе Расширения — Менеджер расширений. Например:
Slogin для регистрации через ВКонтакте, Твиттер, Фейсбук, Одноклассники, Инстаграм, Twitch, Telegram, Github и другие платформы;
Social Login — ВКонтакте, Фейсбук, Твиттер, Pinterest, LinkedIn, Инстаграм, GitHub, WordPress, Reddit, Vimeo, Steam, Mail.ru, Яндекс, Одноклассники и другие соцсети;
Instant Facebook Login для Фейсбука, Твиттераи LinkedIn, дополнительно с его помощью можно работать с комментариями, чатом и другими функциями;
BT Social Login для Фейсбука и Твиттера;
Akeeba SocialLogin для регистрации с помощью Фейсбука и Твиттера или через профили в GitHub, Google и Microsoft.
OpenCart
Для OpenCart тоже есть модули, к примеру:
бесплатный модуль авторизации через социальные сети Фейсбук и Инстаграм для версий OpenCart 2.1, 2.2, 2.3;
платный модуль для регистрации через Вконтакте, Фейсбук, Одноклассники, Твиттер, Gmail.com, Mail.ru.
Битрикс
У CMS Битрикс авторизация на сайте через социальные сети входит в функциональность основного модуля входа на сайт.
Нужно только настроить:
В выбранных вами соцсетях нужно зарегистрировать приложение и получить ключи.
В настройках Битрикса открыть Настройки модулей — Социальные сервисы — Внешние сервисы, выбрать нужные соцсети и внести данные в настройки панели администрирования.
Посоветуйте плагины и сервисы, которые вам нравится использовать для настройки авторизации через соцсети! Ждем в комментариях.
Регистрация и авторизация через соцсети
Инструменты настройки регистрации и авторизации через соцсети для сайтов, веб и мобильных приложений, по сути, представляют собой no-code и low-code решения разной степени сложности. Есть масса готовых плагинов, виджетов, модулей, даже платформы с наборами инструментов для таких интеграций.
Общий механизм такой:
Данные, которые относятся к публичным (они отличаются у разных ресурсов). Чаще всего в них входят: логин, ID или адрес страницы, фотография или аватар, фамилия, имя, электронный адрес, локация, часовой пояс, пол, возраст.
Многое зависит от того, доступ к какой информации разрешили сами пользователи в настройках аккаунтов. Часто при регистрации или редактировании профиля люди на автомате проставляют лишние «галочки», что открывает доступ к дополнительной информации. Списки разрешений на предоставление данных можно найти в документации или настройках конкретной соцсети.
Владельцам сайтов, мобильных и веб-приложений это поможет собрать больше информации о целевой аудитории, предпочтениях, интересах, круге общения. Историю в Facebook, данные о работе в LinkedIn или страничку в Instagram люди заполняют более тщательно, чем форму регистрации или анкету — поэтому информация будет более точной.
Также меньше вероятность, что ваши клиенты забудут учетные данные, под которыми авторизовались. История взаимодействия будет более актуальной, а конверсии, соответственно — выше.
Дополнительный плюс — если кроме входа настроить возможность ставить лайки, комментировать, делать репосты, клиенты будут чаще рассказывать о вас и своих впечателениях от работы с вами (увы, не только положительными, но и отрицательными).
Пользователям удобнее нажать кнопку «Войти» через привычные Google, Facebook, Twitter, Linkedin (в которых они, скорее всего, уже авторизованы), чем добавлять данные в отдельную форму на сайте или в приложении. Некоторые пользователи, особенно те, что много времени проводят в интернете, вообще отказываются заходить на новые ресурсы, если для входа нужно заводить новую учетную запись или заполнять анкету.
Однако традиционную форму регистрации тоже стоит оставить, ведь некоторые люди, особенно старшего поколения, с недоверием относятся к кнопкам авторизации через соцсети, особенно если ресурс, на котором нужно зарегистрироваться, им незнаком.
Придется делать это отдельно для каждой соцсети, также добавлять блоки кода, зачастую сложные для новичков настройки — как на стороне вашего сайта или приложения, так и внешнего сервиса. Для no-code решений этот вариант не особо подходит, разве что вы пришли в разработку без кода из обычного программирования и у вас уже есть подобный опыт.
Такие сервисы предоставляют не только целые списки различных ресурсов, через которые можно настроить вход, но также удобные инструменты статистики, аналитики, интеграции в личном кабинете. Это сократит время разработки, а также упростит работу с клиентами в уже готовом приложении. Из недостатков — инструменты менее гибкие, чем созданные самостоятельно или под конкретную платформу, плюс вы будете так или иначе привязаны к сервису.
Варианты, отлично подходящие для решений, созданных на CMS / no-code платформах. Функция авторизации и регистрации необходима как для сайтов, так и для приложений — неважно web или mobile — поэтому даже на непопулярных платформах можно найти множество вариантов, особенно если ваше комьюнити достаточно активно.
Какой бы вариант вы не выбрали, стоит придерживаться основных правил.
Конечно, они тоже есть:
Сейчас на нашей платформе доступны основной модуль аутентификации и 4 модуля авторизации через сторонние сервисы:
В чем их особенность? Прежде всего, в простоте настройки. Только для модуля LinkedIn нужно указать Секрет клиента, URL перенаправления и ID клиента. Для остальных модулей достаточно ID клиента или приложения — в зависимости от модуля.