同源iFrame单例

时间:2013-08-08 16:24:58

标签: javascript iframe singleton

我有一个webapp,作为在单个父窗口(基本上是修改过的GWT)http://en.wikipedia.org/wiki/Google_Web_Toolkit中托管的多个iframe运行。而不是每个iframe分别访问我们的后端服务,我试图让他们通过使用window.parent全局对象共享数据服务。我设置了这个单例模式 -

define(function(){
    var DocumentService = function () {

        //create namespace if not there
        if (!parent.OurApp) {
           parent.OurApp= {};
        }
        //grab the singleton instance and return it if there
        if (parent.OurApp.DocumentService) {

            return parent.OurApp.DocumentService;
        }
        //assign the global
        parent.OurApp.DocumentService= this;

        //start fetch on instantiation
        this.items;
        this.getItems();
        this.startInterval();

    } 
    DocumentService.prototype.getItems = function(){
      //Rest service call here
      //this.items.push(response); some pseudo-code here
    };
    DocumentService.prototype.startInterval = function(){
      var self = this;
      this.intervalId = parent.setInterval(function(){
         console.log("Fetching items @ " +new Date());
         this.getitems();
      },300000);
    };
  //return new instance or singleton instance
  return new DocumentService();
});

因此,此过程适用于初始加载,getItems()从服务加载数据,setInterval启动循环以运行getItems。我可以观察items数组并查看更改和添加内容。

所以现在这就变得棘手了。如果您通过右键单击“重新加载帧”而不是父窗口单独重新加载帧,则服务的父实例化继续运行,但是当iFrame通过获取新的DocumentService()访问“父”实例单例时,线程由于框架不再注册控制台日志或更改items数组,因此不再处于同步或其他状态。有没有理由说明为什么会这样?我的单身人士模式有缺陷吗?

1 个答案:

答案 0 :(得分:0)

我从来没能完全解决这个问题,但我走了另一条路。将来,我将使用内置的跨框架通信机制,如postMessage等。