历史版本1 :跨域调用 JS 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:
1. 问题描述
用户想要实现在自己的OA系统里点击按钮,就能触发我们的报表的提交事件。但是如果报表和他们的OA不在一个应用中,会存在js跨域调用的权限问题,这个问题该如何解决呢?
2. 实现思路
如果是谷歌和火狐等支持html5的浏览器,则可通过postMessage()方法即可跨域通信;如果是ie8之前等不支持html5的,则通过一个可以跨域的全局属性window.name,外部应用可以访问并修改iframe中的window.name。然后iframe中的页面每隔一段时间检查一下,如果window.name的值变化了则做出相应的事件响应。下面我们将这两种方法放在一起,这样不论在fiefox或者ie8等浏览器下都可以实现跨域提交,避开了浏览器的问题。
3. 解决方案
3.1 模板设置
在需要进行填报的模板添加加载结束事件,我们这边选择新建一张模板CrossSubmit.cpt,直接在填报预览处添加加载结束事件,代码如下:
  1. function send(val){     sendMessage(val);   
  2.         }   
  3.         (function(win, doc){   
  4.             var ifr = win.parent;   
  5.                
  6.             var cb = function(msg){   
  7.                 eval(msg);             
  8.             };   
  9.             var sendMessage = function(){   
  10.                 if(win.postMessage){   
  11.                     if (win.addEventListener) {   
  12.                         win.addEventListener("message",function(e){   
  13.                         cb.call(win,e.data);   
  14.                     },false);   
  15.                     }else if(win.attachEvent) {   
  16.                         win.attachEvent("onmessage",function(e){        cb.call(win,e.data);   
  17.                 });   
  18.                     }   
  19.   
  20.                     return function(data){   
  21.                         ifr.postMessage(data,'*');   
  22.                     };   
  23.                 }else{   
  24.                     var hash = '';   
  25.                        
  26.                     setInterval(function(){   
  27.                         if(win.name!==hash){   
  28.                             hash = win.name;   
  29.                             cb.call(win,hash);   
  30.                         }   
  31.                     },200);   
  32.                     return function(data){   
  33.                         ifr.name = data;   
  34.                     };   
  35.                 }   
  36.             }   
  37.             win.sendMessage = sendMessage();   
  38.         })(window, document);   
  39.