dir.by  
  Поиск  
Компьютер, программы
Meta (Facebook) используемя для входа на наш сайт
 Пишем html, js код для логина в Facebook и получении имени пользователя 
посмотрели 2173 раз
обновлено: 12 июня 2023
Шаг 1. Добавляем наш сайт в Facebook API
Шаг 2. Пишем html, js код для логина в Facebook и получении имени пользователя
  Файл my.html
<meta http-equiv='Content-Type' content='text/html;charset=utf-8' >

<html xmlns='http://www.w3.org/1999/xhtml'>
     <HEAD>
          <title>Hello!</title>
          <meta http-equiv='Content-Type' content='text/html;charset=utf-8' >
     </HEAD>

     <BODY>

     <!-- Facebook init (took from Facebook site) -->
     <script>
          window.fbAsyncInit = function() {
               FB.init({
                    appId : '290004326783306', // <-- Facebook Application id !!!!!!!!!!!!
                    cookie : true,
                    xfbml : true,
                    version : 'v17.0' // <-- Facebook API version !!!!!!!!!!!
               });

               FB.AppEvents.logPageView();
          };

          (function(d, s, id){
               var js, fjs = d.getElementsByTagName(s)[0];
               if (d.getElementById(id)) {return;}
               js = d.createElement(s); js.id = id;
               js.src = "https://connect.facebook.net/en_US/sdk.js";
               fjs.parentNode.insertBefore(js, fjs);
          }(document, 'script', 'facebook-jssdk'));

     </script>

     <!-- get logined info from Facebook (took from Facebook site) -->
     <script>
          function ShowMeFacebookStatus()
          {
               FB.getLoginStatus(function(response)
               {
                    if (response.status === 'connected')
                    {
                         alert("Connected");

                         // show user name, last name, email, id
                         GetUserInfo();
                    }

                    else if (response.status === 'not_authorized')
                    {
                         alert("Not authorized");
                    }

                    else
                    {
                         alert("Error");
                    }
               });
          }
     </script>

     <!-- Facebook LogIn button (took from Facebook site) -->
     <fb:login-button scope="public_profile,email">
     </fb:login-button>

     <!-- my button when click we see user info -->
     <button onclick="ShowMeFacebookStatus();">Get Facebook status()</button>
     </BODY>

     <!-- get user name, last name, email, id -->
     <script>
          function GetUserInfo()
          {
               FB.api('/me', 'get', { fields: 'id, first_name, last_name, email' }, function (response)
               {
                    alert(
                         'user name: ' + response.first_name + '\n' +
                         'user last name: ' + response.last_name + '\n' +
                         'user email: ' + response.email + '\n' +
                         'user id: ' + response.id
                    );
               });    
          }
     </script>

</html>
Шаг 3. Запускаем html, js код
В Google Chrome открываем ссылку https://dir.by/developer/meta/html_js_login_facebook/my.html и увидим:
 
Нажимаем на кнопку Log In.
Нажимаем на кнопку Get Facebook status() и увидим:
Как обработать событие, когда нажаимаем на кнопку Login ?
Вот код кнопки:
  Html  
<!-- Facebook LogIn button (took from Facebook site) -->
<fb:login-button scope="public_profile,email">
</fb:login-button>
 
Решение:
Я кнопку делаю другим способом, вот так:
  Html  
<button onclick='window.FB.login(function (response) {
     // add your action here ...
     }, { scope: \"public_profile,email\" });'>
     Login
</button>
 
← Предыдущая тема
Делаем на своем сайте логин используя Meta (Facebook)
 
Следующая тема →
Ошибка! JSSDK Option is Not Toggled. | JavaScript Meta (Facebook) API
 
Ваши Отзывы ... комментарии ...
   
Вашe имя
Ваш комментарий (www ссылки может добавлять только залогиненный пользователь)

Экскурсии по Москве Экскурсии по Москве: пешеходные, автобусные и речные прогулки на любой вкус
  Объявления  
  Объявления  
 
Делаем на своем сайте логин используя Meta (Facebook)
Пишем html, js код для логина в Facebook и получении имени пользователя
Ошибка! JSSDK Option is Not Toggled. | JavaScript Meta (Facebook) API
Как узнать Facebook Application ID и Facebook API version?

  Ваши вопросы присылайте по почте: info@dir.by  
Яндекс.Метрика