`
gp562
  • 浏览: 10697 次
  • 性别: Icon_minigender_2
  • 来自: 长沙
社区版块
存档分类
最新评论

页面跨域传参 nginx iframe

阅读更多

设定TT和KB为不同的域

1、TT set-ticket-type.html页面div中装iframe(指向KB页面 documentDisplay.jsp
    <div id ="tt-type-kb" style="display:none">
          <iframe   name ="tt-type-kb-display" src= "/CS/cs/kb/query/documentDisplay.jsp?multiselect=true&crossPage=true&PERMIT_CHANNEL=2&routeSrc=troubleticket" width ="100%" height= "500px">
          </iframe >
    </div >
 
    $.openPopupDiv('tt-type-kb','Knowledge Base','1024','545',
       { "onConfirm": "ticketType.closePopupDivForKBPage()","draggable" :true,"resizable" :true});
 
2、nginx配置反向代理
     #设置知识库的菜单代理
        location /CS {
           #设置主机头和客户端真实地址,以便服务器获取客户端真实IP
           proxy_set_header Host $Host;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
           #禁用缓存
           proxy_buffering off;
           #设置反向代理的地址
           proxy_pass http://xxxx.xxxx.xxx.xx:0000/CS;                                                                                      
        }
     只有配置反向代理,tt才能访问kb页面的方法:
     window.frames["tt-type-kb-display"].submitSelected();
     submitSelected()为kb的方法,包含下面的逻辑(获取数据,传参)
 
3、KB页面操作结束时创建一个Iframe,指向TT的页面,将数据作为参数发送到TT页面kbCallback.html  
     var list = new Array();
     var obj = new Object();
     obj.documentId = docTable.getValue(rows[i], "DOCUMENT_ID");
     obj.documentName = docTable.getValue(rows[i], "DOCUMENT_NAME");
     list.push(obj);
     var ff = document.createElement( "iframe");
     ff.style.visable = "hidden";
     ff.style.display= 'none';
     ff.src= "/ARIESRES/crm-bj/trouble-ticket/ticket-type/kbCallback.html?kbId=" +JSON.stringify(list);
     document.body.appendChild(ff);
 
4、在kbCallback.html页面获取KB传过来的值,再传给set-ticket-type.js
<!DOCTYPE html>//文档头,在ie8需要强制使用标准渲染模式才能使用json
<html><body ></body ></html>
<script>
      window.onload = function (){
             var url = location.search;
             var str = "";
             if (url.indexOf( "?") != -1) {
                  str = url.substr(url.indexOf( "=")+1);
                  str = decodeURIComponent(str);
            }
             var param = JSON.parse(str);
            parent.parent.ticketType.doAfterActionForKBPage(param);
      }
</script>
 
注意1: kbCallback.html的parent是documentDisplay.jspdocumentDisplay.jsp的parent是set-ticket-type.html,所以用parent.parent.function
注意2:kbCallback.html是个空页面,作为桥梁使用
 
 
 
 
 
分享到:
评论

相关推荐

    ajax jsonp跨域传参

    ajax jsonp跨域传参,里面有源码,不过写在txt中了,很适合调用别人的接口

    iframe 跨域访问session

    然而,当涉及到跨域时,`iframe` 遇到的问题之一就是无法正常访问父页面或被嵌入页面的`session`。这是因为浏览器的同源策略(Same-Origin Policy)限制了不同源之间的交互,包括`session`和`cookie`。 同源策略是...

    完美解决iframe跨域问题

    3. **iframe跨域问题**:当iframe加载的页面与包含它的页面不在同一个域时,就会出现跨域问题,导致无法直接通过JavaScript进行通信,如获取iframe内的内容、设置iframe的属性等。 **二、iframe跨域的解决方案** 1...

    iframe 跨域解决方法

    然而,由于浏览器的同源策略限制,当`iframe`加载的页面与包含它的页面不在同一个域名下时,就会遇到跨域问题。这篇博客将深入探讨如何解决`iframe`的跨域问题。 首先,理解同源策略是至关重要的。同源策略是浏览器...

    nginx跨域问题,解决多端口,多ip问题

    Nginx 跨域问题解决方案 Nginx 是一个流行的开源 Web 服务器软件,广泛应用于 Web 服务器管理。然而,在使用 Nginx 进行服务器管理时,经常会遇到跨域问题。跨域问题是指在不同的域名、端口或协议下,无法访问...

    nginx部署步骤,vue解决跨域

    vue 跨域解决 Linux上部署nginx

    nginx安装, 解决跨域问题

    **Nginx安装与解决跨域问题** 在现代Web开发中,由于浏览器的同源策略,跨域问题经常出现,限制了不同源之间的通信。Nginx作为一个高性能的反向代理服务器,常被用于处理此类问题。本篇将详细介绍如何在Linux环境下...

    Vue中跨域及打包部署到nginx跨域设置方法

    本文将详细介绍Vue项目开发中遇到的跨域问题及其解决方法,以及如何将打包后的Vue项目部署到Nginx服务器,并设置跨域。 ### 跨域问题的概述 跨域问题是指由于浏览器的同源策略限制,前端项目中的JavaScript代码...

    解决JS跨域访问IFrame的解决方案

    "解决JS跨域访问IFrame的解决方案"这一主题关注的就是如何克服这个限制,使得在JSP页面中嵌入的跨域IFrame能够正常通信。下面我们将详细探讨这个问题以及可能的解决方案。 首先,理解同源策略是关键。同源策略是...

    iframe跨域常用问题和iframe页面自适应

    本篇文章将深入探讨两个关键知识点:`iframe`跨域问题以及`iframe`页面的自适应。 一、`iframe`跨域问题 跨域是Web开发中的一个重要概念,它限制了浏览器从一个源获取另一个源的资源,以保护用户的安全。当`iframe...

    Ajax跨域传输参数

    可以将book.aa.com用iframe添加到 www.aa.com的某个页面下,在www.aa.com和iframe里面都加上document.domain = "aa.com",这样就可以统一域了,可以实现跨域访问。就和平时同一个域中镶嵌iframe一样,直接调用里面的...

    nginx 配置跨域失效修复的方法示例

    nginx 配置跨域不生效 如下配置 server { listen 80; server_name localhost; # 接口转发 location /api/ { # 允许请求地址跨域 * 做为通配符 add_header 'Access-Control-Allow-Origin' '*'; # 设置请求...

    nginx解决跨域问题的实例方法

    跨域是指由于浏览器的同源策略,JavaScript只能请求与当前页面同源(协议、域名和端口都相同)的资源。当尝试请求不同源的资源时,就会触发跨域问题。 解决跨域的一种方法是通过Nginx作为反向代理服务器。Nginx可以...

    使用docker部署nginx前后端解决跨域问题.docx

    使用docker部署nginx前后端解决跨域问题

    layer弹窗:top.layer弹窗到父页面跨域解决办法

    然而,由于浏览器的安全策略,不同的源(origin)之间存在同源策略,阻止了不同域的iframe与父页面直接通信,这就引出了跨域问题。 其次,我们来谈谈**跨域**。同源策略是浏览器为了安全而实施的一项策略,它限制了...

    ARM32-Nginx服务,支持RTMP/HTTP-FLV推拉流,支持flv.js跨域拉流,支持web端跨域代理/上传文件

    “支持flv.js跨域拉流”意味着Nginx配置了允许跨域资源共享(CORS)策略,使得使用flv.js库的网页应用可以从Nginx服务器拉取FLV流。flv.js是一个JavaScript库,可以在没有Flash支持的现代浏览器中播放FLV内容,实现...

    Tomcat+Nginx反向代理部署前后端分离项目解决跨域问题

    最近自己做了一个前后端分离项目,前端采用HBuilderX开发,后端采用IDEA开发,在本地开发也跨域,部署到云服务器也跨域,下面介绍两种解决方案。 出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定...

    页面中iframe相互传值传参

    但同时,它也引入了父页面与iframe之间进行数据交换的需求,也就是所谓的“传值传参”。随着浏览器技术的发展,不同浏览器间的兼容性问题成为开发者需要考虑的重要方面。特别是早期的浏览器,如Internet Explorer和...

    关于iframe跨域POST提交的方法示例

    以前在面试的时候经常遇到问关于跨域的事儿,所以自己对跨域有一定的概念性了解,知道什么是跨域以及解决跨域的方法,但是具体实际从来没有操作过,直到最近在公司项目中,遇到了一个需要使iframe跨域进行POST提交的...

    跨域控制iframe高度

    然而,由于浏览器的同源策略限制,不同源的iframe(跨域iframe)之间的交互受到严格控制,包括无法直接访问或修改iframe的某些属性,如高度。这在需要动态调整iframe高度以适应内容时会带来挑战。本文将深入探讨如何...

Global site tag (gtag.js) - Google Analytics