2013-04-26 14 views
5

をロードします。私はasyncが必要な呼び出しを使用して上記のスクリプトを怠惰にロードしたい。したがって、私の主なrequireJSスクリプトは次のようになります。RequireJSは次のようになり、文字列としてデータベースからロードされている動的な部分がある私のアプリでは、文字列

require(["jquery"], function($){   
    $(document).ready(function(){ 
     // logic to load specific script from database 
     var scriptString = functionToLoadTheStringAbove(); 

     // ideally i would like to call it like this    
     require([scriptString], function(){ 
      // scriptString, dependency1, dependency2 are loaded 
     } 
    }); 
}); 

これらの文字列をrequireJSにロードするにはどうすればよいですか?私はテキストプラグインについて知っていますが、ファイルからの読み込みのみが可能です。私はevalを試しましたが、依存関係を正しく解決しません。

+0

明確にしてください。あなたの質問にお答えください。 –

+0

ああ、あなたは本当にこのようなデータベースに評価可能なコードを格納していますか? –

+0

はい。私の場合は、ブラウザの拡張機能です。したがって、RESTエンドポイントを作成する/ファイルシステムに動的コードを保存するという選択肢はありません。 – bradnoriega

答えて

5

これはかなり遅れているが、私はちょうど、誰もが必要とする場合に、ここに私の解決策を投稿してください。

私はrequireJSフォーラムで質問し、text! pluginjson! pluginの出所を調べました。 RequireJSのStringからモジュールをロードする最もクリーンな方法は、文字列をロードする独自のプラグインを作成し、onLoad.fromText()を使用してevalの文字列を使用し、すべての依存関係を解決することです。私のプラグインの

例(のはdb!プラグインを呼びましょう):いいえあります

  1. :注

    require(["jquery", "db!myScript"], function($, myScript){   
        // jQuery, myScript and its dependencies are loaded from database 
    }); 
    

    define([], function(){ 
        var db = new Database(); // string is loaded from LocalStorage 
        return { 
         load: function(name, req, onLoad, reqConfig){ 
          db.get(name, function(err, scriptString){ 
           if (err) onLoad(err); 
           else onLoad.fromText(scriptString); 
          }); 
         } 
        } 
    }); 
    

    その後、同様にプラグインを使用することができます方法evalなしのrequire()からの文字列。これは内部で行うのはonLoad.fromText()です。 evalは悪いので、あなたはeval()に行くStringを知っている場合にのみ使用するべきです。ブラウザの拡張機能で使用している場合は、CSPポリシーを緩和することができます。

  2. 文字列モジュールに名前を付けるには、explicit naming syntaxを使用できます。この方法では、モジュールの絶対名は常に同じになります。
-1

あなたは行うことができる必要があります:

require(["jquery"], function($){   
    $(document).ready(function(){ 
     // logic to load specific script from database 
     var scriptString = functionToLoadTheStringAbove(); 

     var olddefine = define; // require js define 
     var runme; // capture function 
     define = function (args,func){ 
      runme = func; 
     } 
     eval(scriptString); 
     runme(); // run the function in current scope 
     define = olddefine; // restore requirejs function 

     // dependency1, dependency2 are loaded   
    }); 
}); 
+2

動作しません。 runme()を実行するだけで依存関係が解決されず、requireによって提供されるスコープ/クロージャが失われます。 – bradnoriega

0

そうのようなpluginを作成し、もう少し直接質問に答えるために:

define("load-string",[], function(){ 
    var strings=[], 
     re_package_name = /^string_module_(\d+)$/; 
    return { 
     normalize: function(name, _){ 
      if(re_package_name.test(name)){ 
       return name 
      } 
      var nml = "string_module_" + (strings.push(name)-1); 
      return nml; 
     }, 
     load: function(name, _, onLoad, config){ 
      if(re_package_name.test(name)){ 
       onLoad.fromText(strings[name.match(re_package_name)[1]]); 
      }else{ 
       onLoad.error("Invalid package name: ",name); 
      } 
     } 
    } 
}); 

などのようにそれを使用する:任意の質問をしながら、

var world_module = "define([],function(){return 'world!'})"; 

require(["load-string!" + world_module], 
    function(x){ 
     console.log("Hello "+x); 
    }) 
関連する問題