Настройка авторизации через Facebook
Подробная инструкция по настройке авторизации клиентов через социальную сеть Facebook
Обратите внимание: Для работы авторизации через Facebook необходимо, чтобы Ваш домен использовал SSL сертификат! Подробности спросите у Вашего менеджера.
Для настройки авторизации через Facebook перейдите на страницу Facebook for developers и авторизуйтесь под своей учетной записью Facebook.
После чего нажмите на кнопку «Создать новое приложение» в правом верхнем углу.
В появившемся окне укажите название приложения, к примеру, «Мой магазин», а также Ваш email, который будет использоваться для связи.
Далее нажмите на кнопку «Создайте ID приложения», в появившемся окне введите символы с картинки (капчу) и нажмите на кнопку «Отправить».
После создания приложения у Вас откроется панель управления, где в поле » Добавьте продукт» нажмите «Вход через Facebook» .
В появившемся окне выберите платформу приложения: Веб (WWW).
Укажите URL Вашего сайта и нажмите на кнопку «Save«:
После этого перейдите в левом верхнем меню в пункт «Настройки» — «Основное«
В поля «Домены приложений» и «URL-адрес политики конфиденциальности» укажите ссылки на Ваш магазин и нажмите «Сохранить» в правом нижнем углу.
Далее, в Вашем интернет-магазине перейдите в пункт меню «Настройки» — «Общие настройки» — «Авторизация через соцсети«
Поставьте галочку рядом с facebook, для активации и вставьте «Идентификатор приложения» и «Секрет приложения«, которые указаны в Основных настройках приложения Facebook.
Сохраните изменения в магазине, нажав кнопку «Сохранить» в правом верхнем углу.
Далее, в левом меню, перейдите в продукт «Вход через Facebook» — «Настройки»
Активируйте все кнопки, как показано на скриншоте ниже, а также, в поле «Действительные URI перенаправления для OAuth » добавьте следующую ссылку:
domain/eauth/service/facebook, где domain — URL Вашего магазина и нажмите на кнопку «Сохранить изменения» в правом нижнем углу.
Теперь для активации Вашего приложения Вам необходимо в верхнем меню нажать на серую кнопку «Выкл» для активации приложения.
После чего, в сплывающем окне выберите категорию приложения и нажмите «Подтвердить«.
Настройка авторизации через Facebook завершена
Источник
Авторизация на сайте через Facebook
Инструкция, как получить данные пользователя Facebook через авторизацию OAuth.
Регистрация приложения
Указываем название приложения и контактный e-mail:
Чтобы включить приложение, нужно перейти в основные настройки и указать URL-адрес политики конфиденциальности и категорию.
Ссылка для входа
Создадим PHP-скрипт, который будет обрабатывать ответы от Facebook, к примеру https://example.com/login-facebook.php
Этот URL нужно добавить в список «Действительных URI перенаправления для OAuth» в настройках входа через Facebook.
После этого можно сформировать ссылку для входа:
https://www.facebook.com/dialog/oauth?client_id= Идентификатор_приложения &redirect_uri= https://example.com/login-facebook.php &scope=email&response_type=code
В URL можно добавить параметр « state » для передачи своих данных.
Кликнув по ссылке, пользователь переходит на страницу с диалогом:
После того, как пользователь подтвердил запрос, он будет перенаправлен на redirect_uri с добавлением кода в GET-параметре.
Скрипт получения данных пользователя
В скрипте, полученный код отправляется запросом получения access_token и по нему метод https://graph.facebook.com/me возвращает id, имя, фамилию, e-mail и фото пользователя (полный список полей на https://developers.facebook.com/docs/graph-api/reference/user).
Результат:
«#_=_» в URL
После успешной авторизации Facebook добавляет #_=_ к адресу возврата.
Сделано это специально, поскольку некоторые браузеры, при редиректе переносят хеш из URL-адреса в новый URL. Такой хеш можно удалить:
Источник
Настройка кнопок авторизации Facebook
Авторизация через oAuth позволяет авторизоваться на Вашем сайте через данные аккаунта в facebook.
Чтобы это было возможно, необходимо настроить кнопку авторизации Facebook, чем мы сейчас и займемся.
Для начала необходимо создать приложение сети facebook. Рассмотрим по шагам, как это делается.
1. Для настройки нам необходимо будет перейти по адресу developers.facebook.com и авторизоваться (рис.1)
Рисунок 1.
Далее переходим к самой настройке, нажав на кнопку “Мои приложения” — “Добавить новое приложение”(рис.2)
Рисунок 2.
Затем создаем новый ID приложения (рис.3, 4).
Рисунок 3.
Рисунок 4.
Приложение создано! Затем осуществляем переход к его настройке (рис. 5).
Рисунок 5.
2. После того, как приложение создано, Вам откроется страница.
Здесь необходимо выбрать свое созданное приложение и перейти к его настройке, нажав на кнопку «Панель», затем необходимо выбрать продукт в блоке «Вход через Facebook» (рис.6).
Рисунок 6.
Затем выберите платформу приложения «Веб» (рис. 7):
Рисунок 7.
Далее необходимо указать адрес сайта (рис. 8).
Рисунок 8.
В блоках «Настройка Facebook SDK для Javascript» и «Проверка статуса входа» и «Добавление кнопки «Вход через Facebook»» нажимаем “Далее”.
Следующим шагом мы настроим возможность пользователей авторизовываться через Facebook на Вашем сайте (рис. 9, 10) Для настроек Вашего сайта необходимо перейти в «Настройки» -> «Основное», далее введите домен Вашего сайта, укажите ссылку на страницу политики конфиденциальности, выберите категорию и сохраните изменения.
Рисунок 9.
Затем переходим в «Настройки» -> «Дополнительно» и в настройках безопасности ставим разрешить доступ API к настройкам приложения (рис. 10). Сохраняем изменения.
Рисунок 10.
Далее в пункте “Продукты” перейдите в “Настройки” и укажите “Действительные URI перенаправления для OAuth” Callback URL (с рис. 14).
Рисунок 11.
После сохранения настроек необходимо включить приложение.
Рисунок 12.
Затем переходим в «Настройки — Основное», где прописаны данные — «Идентификатор приложения (API Key)» и «Секрет приложения», которые необходимы для настройки приложения уже на стороне Вашего интернет-магазина (рис. 13).
Рисунок 13.
Полученные Идентификатор приложения и Секрет приложения нужно будет прописать в настройках магазина.
В магазине переходим в Панель администрирования, Меню «Настройки – Системные настройки», вкладка «Авторизация»
Найдите секцию Facebook, включите её, нажав на галочку, и укажите два данных параметра (рис. 14).
Сохраните изменения, нажав на кнопку «Сохранить»
Рисунок 14.
Перейти в клиентскую часть, на странице Войти должна появиться кнопка авторизации facebook (рис. 19).
Рисунок 15.
Источник
Сообщение для входа в Facebook: «URL заблокирован: это перенаправление не удалось, потому что URI перенаправления не занесен в белый список в настройках OAuth клиента приложения.»
если вы регистрируетесь для тестирования, перейдите в настройки своего профиля и в свой интересы добавить удалить профиль.
попытка войти с Facebook в my сайт:
я получаю следующую ошибку:
URL заблокирован: это перенаправление не удалось, потому что URI перенаправления не белый список в настройках OAuth клиента приложения. Убедитесь, что клиент и Вход в систему Web OAuth включен и добавьте все домены приложений как действительные OAuth Перенаправить URIs.
мой settings (основы) в Facebook являются:
- Домены приложений: openstrategynetwork.com
- URL сайта для website : http://openstrategynetwork.com/
на вкладке «Дополнительно», Valid OAuth redirect URIs установлено:
Дополнительные параметры (дополнительно) здесь:
ключ приложения и секрет правильны. Я использую Meteor и его пакеты счетов.
10 ответов
вход с помощью кнопки Facebook на вашем сайте связан с:
обратите внимание: redirect_uri=http://openstrategynetwork.com/_oauth/facebook
если вы вместо этого измените ссылку на:
это должно работать. Или, вы можете изменить ссылку Facebook, чтобы http://openstrategynetwork.com/_oauth/facebook
вы также можете добавить http://localhost/_oauth/facebook к допустимым URIs перенаправления.
Facebook требует, чтобы вы перенаправляли URIs белого списка, так как в противном случае люди могли бы войти в систему с Facebook для вашего сервиса, а затем отправьте их маркер доступа на сервер злоумышленника! И вы не хотите, чтобы это произошло ;]
Как пишет спрашивающий
На вкладке Дополнительно для допустимых URIs перенаправления OAuth установлено значение: .
и у меня была та же проблема (запись url-адреса перенаправления в неправильное поле ввода), я хотел бы выделить это
это не
но
это сэкономило бы мне 2 часа проб и ошибок.
это сработало для меня.
Я получил, что из моего браузера после нажатия кнопки Facebook вы браузер будет перенаправлен на ссылку для интеграции с Facebook API, так где вы получите, что перенаправление. Для моего случая ссылка была такой, откуда я получил redirect_url.
убедитесь, что «Приложение Домена» и Facebook Login => действительный OAuth перенаправить URIs. Там вы должны проверить www или без www. Его лучше использовать с www или без для всех URL-адресов в php,html,css-файлах и настройках приложения Fb.
другое дело, если вы используете » / » конец URL-адресов, вы должны добавить этот URL-адрес в Настройки Приложения допустимый URIs перенаправления OAuth. Образец:- https://www.example.com/index.php/ если этот url если вы используете в url перенаправления, вы должны установить это в Настройки Приложения.
надеюсь, это поможет.
для моего приложения узле
put обратный вызов Url относительный
мой OAuth перенаправляет URIs следующим образом
Убедится «/» в конце Facebook auth перенаправить URI
эти настройки работали для меня.
изменение с hauth.сделано=Facebook to hauth_done=Facebook в действительном OAuth redirect URIs исправил его для меня.
попробуйте добавить http://openstrategynetwork.com/sigin-facebook to Client OAuth Settings действительный URL-адрес перенаправления вместе с вашим собственным URL-адресом перенаправления.
войти помощник вашего сайта
$loginUrl = $helper->getLoginUrl(‘xyz.com/user_by_facebook/’, $permissions);
и в панели мониторинга приложений facebook (на вкладке «продукты»:Логин Facebook )
действительный OAuth перенаправить URIs также должно быть таким же xyz.com/user_by_facebook/
Как упоминалось ранее, делая запрос от web
у нас была такая же проблема, такой кошмар.
убедитесь, что ваши идентификаторы приложений и секретные ключи верны. Если для тестирования используются отдельные приложения разработки, постановки и производства, идентификаторы приложений и секретные ключи различаются для каждого приложения. Это часто является проблемой.
убедитесь, что URL обратного вызова установлен правильно в файле конфигурации приложения (см. ниже). А затем добавьте это как тот же URL в разделе»Логин Facebook» настройки, где говорится»действительный OAuth перенаправить URIs«. Это должно выглядеть так (в зависимости от вашей среды):
http://localhost/auth/facebook/callback http://staging.example.com/auth/facebook/callback http://example.com/auth/facebook/callback
- убедитесь, что ваш домен приложения установлен на правильный домен для каждой среды, включая «www» и «no-www». Facebook также требует, чтобы эти домены соответствовали URL-адресу вашего веб-сайта или платформы приложений. Вам придется выбрать»Добавить Платформы» добавить этот.
Источник