未捕獲的類型錯誤：FB.login 不是函數

Question

我正在使用 Facebook JavaScript API 創建具有 Facebook 功能的登錄並從 API 中獲取用戶詳細信息。

當我以正常方式使用相同的代碼時，我從 Facebook api 獲取數據。

當我嘗試用 requireJS 做同樣的事情時，我收到了這個錯誤

“未捕獲的類型錯誤：FB.login 不是函數”

我見過像 undefined function 這樣的錯誤，但這對我來說是新的。

我遵循的格式

https://developers.facebook.com/docs/javascript/howto/requirejs/v2.7

我的代碼 fb.js 在這里

define(['jquery','facebook'], function($,FB){

window.fbAsyncInit = function() {
    FB.init({
        appId   : '89080988080545753578',
        oauth   : true,
        status  : true, // check login status
        cookie  : true, // enable cookies to allow the server to access the session
        xfbml   : true ,// parse XFBML
        version    : 'v2.5' 
    });

  };

window.fb_login = function(){
FB.login(function(response) {

        if (response.authResponse) {
            console.log('Welcome!  Fetching your information.... ');
            //console.log(response); // dump complete info
            access_token = response.authResponse.accessToken; //get access token
            user_id = response.authResponse.userID; //get FB UID

            FB.api('/me', function(response) {
                user_email = response.email; //get user email
                $("#name").val(response.name);
                $("#user-id").val(response.id);
                if(response.gender == 'male') {
                    $('input[name="gender"][value="female"]').attr('checked', false);
                    $('input[name="gender"][value="male"]').attr('checked', true);

                } else {

                    $('input[name="gender"][value="male"]').attr('checked', false);
                    $('input[name="gender"][value="female"]').attr('checked', true);
                }


                $("#birthday").val(response.birthday);
                $("#email").val(response.email);
          // you can store this data into your database             
            });

        } else {
            //user hit cancel button
            console.log('User cancelled login or did not fully authorize.');

        }

    }, {
        scope: 'publish_stream,email'
    });
};
 });

以及按鈕單擊的 html 代碼

<button type="button" class="btn btn-lg btn-block sm fb" value="Login" id="FB">Facebook</button>

和點擊事件的JS代碼

$( document ).ready(function() {
    $(".btn").click(function(){
        //getting button id value in variable
        var method = $(this).attr('id');
        $("#sign_method").val(method);
        if(method == 'FB') {

            alert('Facebook');
            fb_login();
            //fbData();
            //$("#signup").submit();

        } else if(method == 'GP') {

            alert('Google Plus');
            login();
           // $("#signup").submit();

        } else {

            alert('Email');               
            $("#signup").remove();
            alert('form removed');

            window.location.href = "signup.html";

        }
    });

Answer 1

錯誤信息表示 JS SDK 尚未加載。 您的代碼中缺少這一點：

(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 = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

FB.login必須在FB.init之后FB.init 。 確保FB.init被調用。

更多信息： http : //www.devils-heaven.com/facebook-javascript-sdk-login/

對於 RequireJS，這將是包含 JS SDK 的官方方式： https : //developers.facebook.com/docs/javascript/howto/requirejs/v2.7#adding-a-shim-to-the-facebook-sdk

Answer 2

就我而言，我有一個阻止 SDK 正確初始化的廣告攔截器擴展。 我只是在嘗試使用沒有廣告攔截器擴展程序的其他瀏覽器后才意識到