5

我试图在单个父页面上使用两个 easyXDM 套接字但没有成功。两个套接字都连接到同一个远程域，但端点不同。父页面有两个 divfalse_app_div和dummy_app_div. 下面显示了代码片段 -

在父页面上，我有两个 JS 函数activate_false_app()和activate_dummy_app().

window.loadScript = function(src, onload, onerror) {
   var head = document.getElementByTagName('head')[0];
   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = src;
   if (script.readyState) {
      script.onreadystate = function() {
         var state = this.state;
         if (state === 'loaded' || state === 'complete') {
             script.onreadystate = null;
             onload();
         }
      };
   }
};
window.activate_false_app = function() {
   var exdm_url = 'http://localhost:8000/js/easyXDM/easyXDM.min.js';
   on_load_fn = function() {
      window.init_false_app_communication();
   };
   on_error_fn = function() {
      return false;
   };
   window.loadScript(exdm_url, on_load_fn, on_error_fn);
};
window.init_false_app_communication = function() {
   var false_app_socket = new easyXDM.Socket({
      remote : 'http://localhost:8000/false_app',
      swf : 'http://localhost:8000/js/easyXDM/easyXDM.swf',
      container : 'false_ap_div',
      onMessage : function(message, origin) {
         alert('false_app onMessage');
         alert(message);
      }
   });
};
window.activate_dummy_app = function() {
  var exdm_url = 'http://localhost:8000/js/easyXDM/easyXDM.min.js';
  on_load_fn = function() {
     window.init_dummy_app_communication();
  };
  on_error_fn = function() {
     return false;
  };
  window.loadScript(exdm_url, on_load_fn, on_error_fn);
};
window.init_dummy_app_communication = function() {
   var dummy_app_socket = new easyXDM.Socket({
       remote : 'http://localhost:8000/dummy_app',
       swf : 'http://localhost:8000/js/easyXDM/easyXDM.swf',
       container : 'dummy_app_div',
       onMessage : function(message, origin) {
           alert('dummy_app onMessage');
           alert(message);
       };
   });
};

如果在父页面中，我调用activate_dummy_app()or activate_false_app()，它可以工作 - 这两者都可以单独工作。但是，如果我同时调用两者，那么它们中只有一个可以工作，并且我在 JS 控制台上收到一个错误，即某些东西是未定义的（我找不到）。

另外，我知道问题与加载两个easyXDM有关，因为如果我放入init_dummy_app_communicationof on_load_fn（activate_false_app()除了init_false_app_communication已经存在的），那么两者都可以。

但是，我不能确定 easyXDM 是否已经加载，所以两者activate_false_app都activate_dummy_app必须加载 easyXDM，这样它们才能独立工作，也可以一起工作。我尝试使用noConflict函数，但那里的文档很差，最终没有具体的内容。

有人遇到过类似的问题或知道我在这里缺少什么吗？

4

2 回答 2

0

EasyXDM 允许您在每个站点上拥有它的多个实例。您可以使用noConflict.

例如，如果您正在构建将在您无法控制的站点上运行的 JavaScript，您始终可以创建一个 EasyXDM 实例并将其设置为您想要的任何内容。

我为我们的 JavaScript 小部件执行此操作（可以在此处查看用法）。然后每个脚本都可以调用ns.NSEasyXDM并引用它，而不会破坏全局命名空间中的 easyXDM（因为它喜欢将自己放在window.

如果您需要与多个端点通信，您可以根据需要发送不同的consumerRpcConfig端点consumerJsonRpcConfig。

this.ns = this.ns || {};
(function(ns, window, document) {
    var base = this,
        consumerRpcConfig = {
            remote: document.location.protocol+ "//my.path.org/Scripts/easyXDM/cors/"
        },
        consumerJsonRpcConfig = {
            remote: {
                request: {}
            }
        },
        init = function(el, callback) {
            var easyXDMElement,
                scripts = document.getElementsByTagName('script'),
                scriptIdx;
            for (scriptIdx = 0; scriptIdx < scripts.length; scriptIdx = scriptIdx + 1) {
                if (scripts[scriptIdx].src === document.location.protocol + '//my.path.org/Scripts/EasyXDM/easyXDM.js') {
                    base.isEasyXDMPresent = true;
                }
            }
            if (!base.isEasyXDMPresent || ns.NSEasyXDM === undefined) { 
                easyXDMElement = document.createElement('script');
                easyXDMElement.type = 'text/javascript';
                easyXDMElement.src = document.location.protocol + '//my.path.org/Scripts/EasyXDM/easyXDM.js';
                el.parentNode.insertBefore(easyXDMElement, el);
            }
             easyXDMElement.onload = function () {
                 ns.NSEasyXDM = { easyXDM: window.easyXDM.noConflict("NSEasyXDM") };
                 callback();
             };

        }
    return ns;
}(this.ns, window, document));

如上图定义EasyXDM的多个副本，使用“noConflict”，将每个实例分配给一个变量；然后你可以传递它。

于 2014-12-13T20:47:14.217 回答
-2

在这个页面中； https://groups.google.com/forum/#!topic/easyxdm/bOoznzUrkjE

它被称为；

(function(){
    var easyXDM;
    // paste easyXDM's minified code here

    var rpc = easyXDM.Rpc(.....
    ...
})();
于 2014-03-13T15:05:48.120 回答