Кнопка "Вход" позволяет запустить процесс входа через Facebook на сайте или в веб-приложении.
Если человек еще не входил в ваше приложение, он увидит эту кнопку и, нажав ее, вызовет диалог "Вход", что инициирует процесс входа. Люди, которые уже вошли в приложение, не увидят эту кнопку, но вы можете отобразить для них кнопку выхода.
Если вы отображаете кнопку выхода и люди используют ее, чтобы выйти, они выходят и из вашего приложения, и из Facebook.
Кнопка "Вход" работает только совместно с JavaScript SDK. Если вы создаете мобильное приложение или не можете использовать JavaScript SDK, следуйте рекомендациям по созданию процесса входа для данного типа приложений.
Кнопка Продолжить с Facebook заменяет предыдущие версии кнопки "Вход". Подробнее об этом см. в разделе Миграция.
Если вход на Facebook был выполнен через тот же браузер, на кнопке Продолжить как {Name} отображается текст "Продолжить как {persons' name}", а также (возможно) фото профиля этого человека на Facebook. Чтобы воспользоваться кнопкой Продолжить как {Name}, необходимо загрузить JavaScript SDK. Инструкции по настройке JavaScript SDK приведены в руководстве по быстрому началу работы с JavaScript SDK. Включите кнопку Продолжить как {Name}, добавив data-use-continue-as="true" в настройки кнопки.
Высоту кнопки Продолжить как {Name} изменить нельзя.
| Размер кнопки | Высота | Ширина | Можно ли изменить ширину? |
|---|---|---|---|
Маленькая | 20 пикселей | 200 пикселей | Нет |
Средняя | 28 пикселей | От 200 до 320 пикселей | Да |
Большая | 40 пикселей | От 240 до 400 пикселей | Да |
Если вы выберете значение больше максимального, по умолчанию будет использоваться кнопка максимальной ширины.
Кнопка Продолжить как {Name} помогает увеличить вовлеченность и количество кликов. Благодаря ей пользователь, выполняющий вход, видит свое фото профиля и имя.
Однако если пользователь не ожидает увидеть свое фото и имя в контексте вашего приложения, это может сбить его с толку. Из этой статьи вы узнаете, подойдет ли кнопка Продолжить как... для вашего приложения.
Даже если кнопка Продолжить как {Name} не подходит для вашего приложения, вы можете воспользоваться новыми кнопками "Продолжить с Facebook" из JavaScript SDK.
Facebook является глобальной платформой, поэтому ожидания наших пользователей из разных регионов могут значительно различаться. Учтите это, если решите воспользоваться данной кнопкой.
В вашем приложении есть социальные функции.
Социальные приложения предлагают людям возможности для общения. Для них кнопка Продолжить как {Name} может стать отличным решением.
Люди на целевом рынке могут вместе пользоваться одним телефоном.Если несколько человек пользуется одним телефоном, кнопка Продолжить как {Name} поможет им выбрать нужный аккаунт.
Вы выпустили новое приложение.
Если ваше приложение появилось на рынке недавно, у него еще нет постоянных пользователей. А новые пользователи могут не понять, почему в нем автоматически отображаются их имена и фото.
Люди на целевом рынке уделяют большое значение конфиденциальности.
Во многих странах фото профиля считается глубоко личной информацией. В этом случае кнопку Продолжить как {Name} лучше не использовать, потому что на ней отображается фото человека, который вошел в систему.
Следуйте общим рекомендациям по использованию функции "Вход через Facebook". При использовании кнопки Продолжить как {Name} вы должны соблюдать эти два условия:
Другие рекомендации:
<script>
var finished_rendering = function() {
console.log("finished rendering plugins");
var spinner = document.getElementById("spinner");
spinner.removeAttribute("style");
spinner.removeChild(spinner.childNodes[0]);
}
FB.Event.subscribe('xfbml.render', finished_rendering);
</script>
<div id="spinner"
style="
background: #4267b2;
border-radius: 5px;
color: white;
height: 40px;
text-align: center;
width: 250px;">
Loading
<div
class="fb-login-button"
data-max-rows="1"
data-size="large"
data-button-type="continue_with"
data-use-continue-as="true"
></div>
</div>Вы можете задать следующие настройки помимо указанных выше:
| Настройка | Атрибут HTML5 | Описание | Параметры |
|---|---|---|---|
|
| Если эта настройка активирована, после входа пользователя вместо кнопки входа будет отображаться кнопка выхода. |
|
|
| Функция JavaScript, которая запускается после завершения процесса входа. |
|
|
| Список разрешений, которые запрашиваются при входе. |
|
|
| Выбирает один из вариантов размера кнопки. |
|
|
| Определяет, какая аудитория будет выбрана по умолчанию при запросе разрешений записи. |
|
Старые кнопки будут заменены на новые. В таблице ниже указаны соответствия при замене.
| Старая кнопка | Старая высота | Новая кнопка | Новая высота |
|---|---|---|---|
Значок | 18 пикселей | Больше не используется | Больше не используется |
Маленькая | 18 пикселей | Маленькая | 20 пикселей |
Средняя | 22 пикселя | Маленькая | 20 пикселей |
Большая | 25 пикселей | Маленькая | 20 пикселей |
Очень большая | 39 пикселей | Маленькая | 20 пикселей |
У новой кнопки Продолжить как {Name} есть параметр button_type, который не нужен старым кнопкам. С его помощью можно задать тип кнопки Продолжить с Facebook или Вход через Facebook. Если вы не укажете тип кнопки, мы отобразим ее как новую маленькую кнопку. По сравнению со старыми кнопками эта кнопка имеет средний размер. Кнопка типа x-large немного уменьшится. Если указать задать значение параметра button_type, кнопки будут отображаться в соответствии с этим значением.
Вы можете ускорить загрузку кнопок, если запустите JavaScript SDK как можно быстрее. Но браузер не в состоянии загрузить кнопки, пока не закончилась загрузка кода JavaScript и HTML-кода веб-страницы. Поэтому создается окно iframe, и ресурсы кнопки загружаются в него.
<div
class="fb-login-button"
data-max-rows="1"
data-size="<medium, large>"
data-button-type="continue_with"
data-width="<100% or px>"
data-scope="<comma separated list of permissions, e.g. public_profile, email>"
></div>
}Чтобы загрузить кнопку с текстом на другом языке, необходимо загрузить JavaScript SDK для этого языка. Подробнее о локализации JavaScript SDK см. в разделе, посвященном локализации социальных плагинов и JavaScript SDK.
Когда человек нажмет кнопку "Вход" и подтвердит вход в диалоге, в результате чего будет выполнен процесс входа, ваше приложение сможет использовать Facebook SDK для JavaScript, чтобы совершать вызовы API от имени этого человека.
Здесь не требуется каких-либо дополнительных настроек, но вы можете использовать настройку onlogin для кнопки, чтобы запускать собственную функцию JavaScript после выполнения входа.
Да, но частично вам все же придется использовать JavaScript SDK. После завершения процесса входа, запущенного нажатием кнопки "Вход", SDK получит доступ к объекту authResponse с помощью FB.getLoginStatus(). Эта функция позволяет передать объект ответа вашему коду на стороне сервера, чтобы завершить регистрацию.
Кнопка "Вход" не поддерживает повторные запросы, так как запрос отклоненных разрешений не соответствует назначению кнопки. Если вам нужно повторно запросить разрешение, настройте специальную кнопку и используйте FB.login(), как описано в документации по функции "Вход через Facebook" для сайтов.
Для того, чтобы теги <div> отображались в виде кнопок, применяется технология XFBML. Она использует JavaScript, содержащийся в SDK, чтобы проанализировать страницу и внести соответствующие изменения. Возможно, материалы страницы динамически изменяются и теги div добавляются после того, как метод init SDK был запущен (так происходит, например, при использовании динамических диалогов). Чтобы изменения отобразились, заново вызовите функцию FB.XFBML.parse().
