2012-12-06 40 views
0

是否可以在define塊中使用require?在RequireJS中使用require定義

我想加載Facebook的JS API,但需要將其包裝在一個不同的上下文需求,因爲我不希望整個應用程序停止加載,如果Facebook被防火牆阻止。

我遇到的問題是如何從嵌套的require()調用中返回模塊。

我的代碼看起來是這樣的:

define([ 'require' ], 
    function(require) 
{ 
    var fbRequire = require( 
    { 
     context: 'fb', 
     waitSeconds: 3 
    }); 

    fbRequire.onError = function() 
    { 
     console.warn('fbRequire.onError', arguments); 
    }; 

    fbRequire([ 'https://connect.facebook.net/en_US/all/debug.js' ], 
     function() 
    { 
     console.log('facebook file now loaded'); 

     // init the Facebook JS SDK 
     var facebookSettings = { 
      channelUrl: '//' + window.location.hostname + '/facebook-channel.html', // Channel File for x-domain communication 
      status: true, 
      cookie: true, 
      xfbml: true, 
      appId: '1234567890' 
     }; 

     FB.init(facebookSettings); 

     // this is the bit I'm confused about 
     // how do I... 
     return FB; 
     // ...because it's asynchronous and needs to be returned from the define() call? 
    }); 
}); 

這是一個道場項目,如果這能幫助(我需要使用Dojo /遞延?)。

+0

是否使它成爲依賴不起作用? – Bergi

+0

這就是我最初編寫它的方式,但如果Facebook被阻止,整個應用程序就會崩潰,因爲require會拋出錯誤,然後不會加載任何其他內容。如果Facebook沒有被封鎖,那麼它就可以正常工作。在不同的上下文中使用require()顯然是答案。請參閱:https://groups.google.com/forum/?fromgroups=#!topic/requirejs/go-RbejZ7Zg – voidstate

+0

嘗試[catch the error](http://requirejs.org/docs/api.html#errbacks )並重新定義Facebook到本地 – Bergi

回答

0

我已經解決了這個問題,但是無法在Facebook被封鎖的時候讓Dojo加載器無法轉移。相反,我用直接的JS來加載SDK。希望這會幫助別人。

define([ 'require' ], 
    function(require) 
    { 
     return { 
      /** 
      * Loads a facebook asynchronously using require() and a "bang" (!). 
      * 
      * @example require(['my-project/facebookLoader!'], function(facebook) { ... }); 
      */ 
      load: function(store, require, callback) 
      { 
       // already loaded? 
       if(window.FB !== undefined) 
       { 
        console.log('facebook already loaded - using global FB object.'); 
        callback(window.FB); 
       } 
       else 
       { 
        require([ 'dojo/dom-construct', 
         'dojo/_base/window', 
         'dojo/on', 
         'dojo/_base/event' ], // remove "/debug" in live env 
        function(domConstruct, win, on, event) 
        { 
         // add Facebook div 
         domConstruct.create('div', { id:'fb-root' }, win.body(), 'first'); 

         // init the Facebook JS SDK 
         var facebookSettings = { 
          channelUrl: '//' + window.location.hostname + '/facebook-channel.html', // Channel File for x-domain communication 
          status: false, // check the login status upon init? 
          cookie: true, // set sessions cookies to allow your server to access the session? 
          xfbml: false // parse XFBML tags on this page? 
         }; 

         // app ID from the App Dashboard 
         if(window.location.hostname == 'localhost') 
         { 
          facebookSettings.appId = '123456788'; 
         } 
         else 
         { 
          facebookSettings.appId = '123456789'; 
         } 

         // what do we do if Facebook is blocked or times out? 
         var loadFailed = function(errorEvent) 
         { 
          console.warn('Facebook failed to load. Some features will be unavailable. ' + (errorEvent ? 'Script error.' : 'Timed out.')); 

          // scrap the timer (in case we got here from error event on script tag) 
          if(timerId) 
          { 
           window.clearTimeout(timerId); 
          } 

          if(errorEvent !== undefined) 
          { 
           event.stop(errorEvent); 
          } 

          window.fbAsyncInit = function(){}; // noop 

          // return fake Facebook object 
          callback( 
          { 
           getLoginStatus: function() 
           { 
            return false; 
           } 
          }); 

         }; 

         // give Facebook 5 seconds to load 
         var timerId = window.setTimeout(loadFailed, 5000); 

         // hook into Facebook's load callback 
         window.fbAsyncInit = function() 
         { 
          window.clearTimeout(timerId); 
          FB.init(facebookSettings); 
          callback( window.FB); 
         }; 

         // Load the SDK Asynchronously 
         (function(d) 
         { 
          var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0]; 
          if (d.getElementById(id)) {return;} 
          js = d.createElement('script'); js.id = id; js.async = true; 
          js.src = "//connect.facebook.net/en_US/all/debug.js"; // dev version 
          //js.src = "//connect.facebook.net/en_US/all.js"; // production version 
          on(js, 'error', loadFailed); 
          ref.parentNode.insertBefore(js, ref); 
         }(document)); 

        }); 
       } 
      } 
     }; 
    } 
); 
相關問題