1
 2
 3
 4
 5
 6
 7
 8
 9
10

<div class="fb-login-button" 
     data-size="large" 
     data-button-type="continue_with" 
     data-layout="default" 
     data-auto-logout-link="false" 
     data-use-continue-as="false" 
     data-width="" 
     scope="public_profile,email" 
     onlogin="checkLoginState();">
</div>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

<script>

  function statusChangeCallback(response) {
      console.log(response);
      if (response.status === 'connected') {
          testAPI();
      } else {
          document.getElementById('status').innerHTML = 'Please log ' +
              'into this webpage.';
      }
  }

  function checkLoginState() {
      FB.getLoginStatus(function (response) {
          statusChangeCallback(response);
      });
  }

  window.fbAsyncInit = function () {
      FB.init({
          appId: '{app-id}',
          cookie: true,
          xfbml: true,
          version: 'v8.0'
      });

      FB.getLoginStatus(function (response) {
          statusChangeCallback(response);
      });
  };

  function testAPI() {
		  // 設定取得Email
      FB.api('/me?fields=id,name,email', function (response) {
          console.log(response);
      });
  }
</script>

<script async defer crossorigin="anonymous" src="https://connect.facebook.net/zh_TW/sdk.js#xfbml=1&version=v8.0&appId=2676189852639715&autoLogAppEvents=1" nonce="niZd8nLu"></script>