requireJS и API JavaScript Javascript

Question

Я пробовал это некоторое время, и я полностью застрял в этой проблеме и надеюсь, что кто-то может дать мне несколько идей, как я могу это решить. Проблема здесь.

Я бы хотел использовать API Javascript Google для входа на сайт. Мой браузер

define(function (require) { 
    init = function(){ 
     require(['https://apis.google.com/js/platform.js?onload=renderButton'], function(gapi){ 
      renderButton(); 
     }); 
    }, 
    renderButton = function(){ 
     console.log("renderbutton called"); 
     gapi.signin2.render('google-signin', { 
      'scope': 'https://www.googleapis.com/auth/plus.login', 
      'width': 151, 
      'height': 25, 
      'longtitle': true, 
      'theme': 'dark' 
     }); 
    }, 
}); 

Когда я делаю это, он возвращает сообщение об ошибке с «ReferenceError: GAPI не определен»

поэтому я попытался, как показано ниже, но не повезло.

define(function (require) { 
    init = function(){ 
     require(['https://apis.google.com/js/platform.js?onload=renderButton'], function(gapi){ 
      renderButton(gapi); 
     }); 
    }, 
    renderButton = function(gapi){ 
     console.log("renderbutton called"); 
     gapi.signin2.render('google-signin', { 
      'scope': 'https://www.googleapis.com/auth/plus.login', 
      'width': 151, 
      'height': 25, 
      'longtitle': true, 
      'theme': 'dark' 
     }); 
    }, 
}); 

Answer 1

Я знаю, что задал вопрос, но, наконец, смог заставить его работать. Я не уверен, правильно ли я сделал. Итак, пожалуйста, дайте мне знать, если есть лучший способ приблизиться.

Мой браузер

define(function (require) { 
    "use strict"; 
    var $ = require('jquery'), 
    .... 
    .... 
    .... includes other codes 

    require(['https://apis.google.com/js/platform.js'], function(){ 
     var renderButton; 

     window.gapi.signin2.render('google-signin', { 
      'scope': 'https://www.googleapis.com/auth/plus.login', 
      'width': 151, 
      'height': 25, 
      'longtitle': true, 
      'theme': 'dark', 
      'onsuccess': onSuccess, 
      'onfailure': onFailure 
     }); 
    }); 
} 

Answer 2

Я создал requirejs конфигурации, как это:

window.require = { 
    "shim": { 
     "gapi": { 
      "exports": "gapi" 
     } 
    }, 
    "paths": { 
     "gapi": "https://apis.google.com/js/platform" 
    } 
} 

Тогда я могу сделать:

require(['gapi'], function (gapi) { 
    gapi.load("", function() { 
    // ..whatever.. 
    }); 
}); 

Это ... странно библиотека, хотя , Я пытался сделать библиотеку подписи и в конечном итоге нужно сделать это

gapi.load('auth2', function() { 
    gapi.auth2.init({ 
    client_id: GOOGLE_SIGN_IN_CLIENT_ID 
    }); 
    gapi.load('signin2', function() { 
    gapi.signin2.render('g-signin', options); 
    }); 
}); 

Таким образом, вы можете создать «Google-загрузчик» для входа в аккаунт. requirejs loader plugins. В основном это будет выглядеть следующим образом:

define('gapi', { 
    load: function (name, req, onload, config) { 
     //req has the same API as require(). 
     req(['gapi'], function (gapi) { 
      gapi.load(name, function() { 
       onload(gapi[name]); 
      }); 
     }); 
    } 
}); 

И тогда вы можете просто:

require(['gapi!auth2', 'gapi!signin2'], function (auth2, signin2) { 
    auth2.init({client_id: CLIENTID}); 
    signin2.render(...); 
});