首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

iframe域应用 - 使用iframe提交表单数据

之前我们提到了iframe域,今天我们在原有的基础之上进行“实例”的讲解。通过iframe域实现表单数据的提交。...如果想了解iframe域,可以发送“iframe域”到“HTML5学堂”公众号。 为何提交数据还要域?...在使用iframe域之前,可能你的脑海中就出现了这样一个问题:为何提交表单数据还需要域呢?...构建基本的结构样式 2 引入需要依赖的JS文件 3 定义动态创建iframe标签的功能函数 4 获取表单数据并序列化、加密处理 5 通过AJAX发送请求,完成域 代码书写位置 我们依旧在A域当中进行代码书写...标签”的功能函数 JS代码如下(对于这个步骤中的详细介绍,我们之前的文章中已经做了详细的解释,想要了解的可以发送“iframe域”到“HTML5学堂”公众号) var iframeJquery = null

5.2K50

深入剖析iframe域问题

HTML5学堂:本文当中我们介绍了域的基本知识,讲解到了域的相关种类,并讲解了解决域中的一种方法——如何使用iframe域。...讲解了iframe域的基本原理与流程,并配以实战~ 利利的独白:域,是我们的课程中必不可少的一部分,但是我们一直都是在讲解JSONP的域方式,虽然也提到了iframe域方式,但是由于时间因素,...本文仅仅讲明了iframe域问题,想了解更多关于iframe标签的基本知识,直接发送 “iframe标签” 到 “HTML5学堂” 的微信。...能够解决什么类型的域 主域相同,不同子域之间的域请求 例如:http://www.h5course.com/与http://baobao.h5course.com/ iframe实现域的基本原理与流程...iframe域的流程 1 创建iframe - 在a.html文件中,动态创建iframe元素/标签 2 视觉控制 - 为了让用户无法看到这个iframe元素/标签,需要使用CSS将其移出可视区 3

13.6K40

关于iframe域传输

参考了一些博客,至于使用 不使用iframe,我觉得能解决问题就好,而且如果考虑的多的话就考虑以后扩展以及拆分啥的,毕竟前端又不像后端这样。 因为要解决域问题。...有很多方案,比如说iframe,jsonp(不过只支持get,对于一些铭感信息就不行了) 原本需求是登录在一个站点,而注册是另外一个站点。因为要实时反馈到iframe子页面,子页面在进行相应。.../iframePage.html" id='iframe'> <!...元素,当然也可以使用其他的js框架 iFrame = document.getElementById('iframe') //iframe加载完毕后再发送消息,否则子页面接收不到message iFrame.onload...我们知道postMessage是挂载在window对象上的,所以等iframe加载完毕后,用iFrame.contentWindow获取到iframe的window对象, 然后调用postMessage

59610

IE中iframe域访问

1      什么叫域?        指在A系统(第一方)中通过URL直接调用B系统(第三方),并且两个系统分别部署在不同的域内,简单的理解就是访问这两个系统需要不同的IP。...2      域会引发什么问题?        ...在IE中,A系统中的iframe或者frame域访问了B系统一个资源时,IE浏览器默认设置是禁用第三方Cookie的,这就导致向B系统发送请求时丢失了JSESSIONID,从而B系统服务器中就无法得到...IE中如此处理可能也是出于安全考虑,经测试,在Chrome、FireFox中默认是允许第三方Cookie的,也就不会存在域引发的问题。这种域的情况通常出现在多个系统间互相嵌入某些功能。...3.2.2  P3P协议        在B系统中允许被域访问的功能模块中加入P3P响应头,response.setHeader("P3P","CP=CAOPSA OUR");,记住是B系统中加,不是

4.1K00

学员投稿 | iframe 解决

,网上相关内容一抓一大把,但是突然学习到一个关于前端解决域的方式 就是 利用 iframe  不管你有没有了解过,反正我没有 我觉得很有用并且容易忘,所以我记录下来哈哈哈 下面会分三块内容进行描述...1、基本原理 2、简单模拟 2、封装的函数 3、封装函数实战 解决场景 现在我们在 a.com 的域名下有一个页面 我们要请求 b.com 下的一个接口,很明显是会域的,无法直接请求 今天我们使用 iframe... 解决域的问题,但是实际上并不会这么做,肯定是封装得更加适用一些 详情就看下面吧 封装函数 经过上面的说明,我们首先要明确我们的目的 1、iframe 2、两个辅助页 3、数据回调 所以我们封装的函数必须要满足这几个东西...= doc.createElement('iframe')  iframe.src = url  iframe.frameborder = '0'  iframe.style.display =...的确存在能耗高,安全问题...很多小伙伴嫌弃它,但是它毕竟是解决域问题的一种思路,面试可能会问哦,多掌握点总是没错的。

2.4K30

iframe+postMessage实现域通信

需要在本页面跳转到一个图片管理系统上传图片,上传成功后返回图片链接,然后返回管理系统,显示图片 实现思路: 上传图片时,需要在本窗口跳转到图片管理系统,并且两个系统之间要通信 考虑到两个系统是不同的端口号,存在域问题...,这时发现HTML5新增了一个API-window.postMessage(),于是就决定用iframe结合window.postMessage()实现 在页面中嵌入一个iframe,将图片管理系统嵌入到当前的管理系统中...,结合window.postMessage()实现域通信 项目背景 该管理系统基于React.js搭建,在此简称为A页面,地址为http://www.blogoog.com:8000 图片管理系统基于...在页面内嵌入iframe页面的情况下,需要等到页面内的iframe页面,也就是B页面加载完成之后,才能进行postMessage域通信 event.origin中的origin不能保证是该窗口的当前origin...始终是你需要通信的目标窗口 A页面中:A页面向B页面发送域信息,window就是在A页面中嵌入的iframe指向的B页面的window,即:iframe.contentWindow B页面中:B页面想

5.2K40

【JS应用】Iframe 解决

有些都是很普通很常见的知识,但是为了巩固自己的知识面,梳理自己的知识树,所以每个知识点都会写成文章,所有文章都会放在公众号右下角的前端进阶课程总结中~~~也希望能够帮助到需要的人~~ 域的东西, 简直不要接触太多...,网上相关内容一抓一大把,但是突然学习到一个关于前端解决域的方式 就是 利用 iframe 不管你有没有了解过,反正我没有 我觉得很有用并且容易忘,所以我记录下来哈哈哈 下面会分三块内容进行描述...1、基本原理 2、简单模拟 2、封装的函数 3、封装函数实战 解决场景 现在我们在 a.com 的域名下有一个页面 我们要请求 b.com 下的一个接口,很明显是会域的,无法直接请求 今天我们使用 iframe...1、内容页 A 嵌入一个隐藏 iframeiframe 加载 b.com 下的辅助页面 B 2、辅助页面B 开始请求接口 b.com/xxx,请求成功,存放到 window.name 3、隐藏 iframe...解决域的问题,但是实际上并不会这么做,肯定是封装得更加适用一些 详情就看下面吧 封装函数 经过上面的说明,我们首先要明确我们的目的 1、iframe 2、两个辅助页 3、数据回调 所以我们封装的函数必须要满足这几个东西

13.9K10

iframe域调用js_ajax域访问

iframe域访问 js域是个讨论很多的话题.iframe域访问也被研究的很透了. 一般分两种情况: 一....用P3P header解决iframe域访问cookie 1.IE浏览器iframe域丢失Session问题 在开发中,我们经常会遇到使用Frame来工作,而且有时是为了跟其他网站集成,应用到多域的情况下...JS域访问问题描述:应用A访问应用B的资源,由于A,B应用分别部署在不同应用服务器(tomcat)上,属 … IFrame域访问&;&;IFrame域访问自定义高度...1.IFrame域访问: http://blog.csdn.net/fdipzone/article/details/17619673 2.IFrame域访问自定义高度: 由于JS禁止域访问,如...frame 或 iframe 标签),浏览 … IE中iframe域访问 http://blog.csdn.net/ghsau/article/details/13747943 允许CEF域访问iframe

10.7K20

详解使用postMessage解决iframe域通信问题

第一时间想到的就是用iframe了,但问题来了,我和第三方web项目是有交互的,这就违反同源策略了,处理域问题是最让人头疼的事之一。...在window对象下有个postMessage方法,是专门用来解决域通信问题的。...关于postMessage的详细介绍请戳这里,不过MDN的文档太详细了,导致有些同学看完还是一脸懵逼,下面我们就来看看怎么用postMessage实现iframe域通信,当你会用了之后再回去看文档,感觉是完全不同的...是无法通信,因为它们是不同源的(假设存在域问题),这时候就要用到postMessage了。...','*'); } 我们知道postMessage是挂载在window对象上的,所以等iframe加载完毕后,用iFrame.contentWindow获取到iframe的window对象,然后调用

3.4K20

利用iframe和location.hash实现

假设域名a.com下的文件cs1.html要和cnblogs.com域名下的cs2.html传递信息,cs1.html首先创建自动创建一个隐藏的iframeiframe的src指向cnblogs.com...响应请求后再将通过修改cs1.html的hash值来传递数据(由于两个页面不在同一个域下IE、Chrome不允许修改parent.location.hash的值,所以要借助于a.com域名下的一个代理iframe...代码如下: 先是a.com下的文件cs1.html文件: function startRequest(){ var ifr = document.createElement('iframe...var ifrproxy = document.createElement('iframe'); ifrproxy.style.display = 'none';...parent.parent.location.hash = self.location.hash.substring(1); 当然这样做也存在很多缺点,诸如数据直接暴露在了url中,数据容量和类型都有限等…… 原帖地址:JavaScript域总结与解决办法

82220

如何取消Chrome浏览器域请求限制、域名携带Cookie限制、域名操作iframe限制?

取消域限制、域名携带Cookie限制、域名操作iframe限制之后的Chrome可以更加方便Web前端开发,同时也可以作为一个完美的爬虫框架。...不同域之间相互请求资源,就算作“域”,正常情况下浏览器会阻止XMLHttpRequest对象的域请求。 2.如何取消域请求限制?...; 域携带Cookie限制 1.什么是域携带Cookie?...域名操作iframe 1.什么是域名操作iframe限制?...假设我们在A域名的网页上有一个指向B域名的iframe,我们访问A域名的网页时,B域名的iframe正常显示,但是当我们通过js去操作B域名的iframe时,将会被浏览器阻止(同源域名不会被阻止);相应的通过

5.4K30
领券