之前我们提到了iframe跨域，今天我们在原有的基础之上进行“实例”的讲解。通过iframe跨域实现表单数据的提交。...在使用iframe跨域之前，可能你的脑海中就出现了这样一个问题：为何提交表单数据还需要跨域呢？...功能需求 在http://A.h5course.com中，进行用户的注册（填写表单），需要将数据提交到http://B.h5course.com的addUser.php中。...实现流程，在A域中的a.html创建iframe标签，iframe标签的内容是B域中的b.html，之后通过a.html控制b.html去申请B域中的addUser.php文件 功能实现的基本流程 1...构建基本的结构样式 2 引入需要依赖的JS文件 3 定义动态创建iframe标签的功能函数 4 获取表单数据并序列化、加密处理 5 通过AJAX发送请求，完成跨域 代码书写位置 我们依旧在A域当中进行代码书写
情况2.输入用户名，密码正确，登陆成功。 上面的效果实现起来很简单，无非就是给按钮绑定点击事件，事件里发送一个ajax请求，请求完成后，回调函数根据返回结果，再操作dom元素。...在表单的下面有一个iframe元素，这个iframe元素上有个name属性，属性值也为“myframe”。...target指向了一个iframe元素，在iframe中打开action的url。 利用iframe方式，返回的数据与ajax返回的数据是不同的。来看一下iframe返回的后端php代码： php } ?> php代码的解释：接受前端发送的数据，之后根据接受到的结果，输出不同的值。...通过这段代码可以获取到当前页面中的dom元素，并对其进行操作，看操作结果： 情况1.账号密码正确时，登陆成功。 情况2，账号或密码不正确时，登陆失败。
所有视频源为swf的文件的视频都需要借助Flash去播放。 解决方案： 在移动端设备上，使用HTML5的video标签基本没有问题。...在PC上，IE低版本(IE8-)浏览器上除了Flash目前没有其它办法 在PC上，IE9+和其它现在浏览器，采用HTML5标签。...跨域请求（Corss Origin Request） 2.1使用Flash进行跨域请求的方案实现 目前在PC端a.qq.com的页面请求b.qq.com的一个接口是理论上跨域的一个请求，旧版本浏览器特别是只支持...那么我们可以在接口域名下放一个统一的html文件，用于代理我们请求b.qq.com的接口，然后将结果告诉a.qq.com就可以了。...条件：无任何条件，支持任何浏览器 做法： 1.在页面上构建一个隐藏的iframe 2.在页面上构建一个form表单，表单中包含文件表单和其它附加字段表单,target设为上述iframe的id 3.上传文件动作触发时
下面从文件上传方式入手，整理大文件上传的思路，并给出了相关实例代码，由于PHP内置了比较方便的文件拆分和拼接方法，因此服务端代码使用PHP进行示例编写。...本文相关示例代码位于github上，主要参考 聊聊大文件上传 大文件切割上传 文件上传的几种方式 首先我们来看看文件上传的几种方式。 普通表单上传 使用PHP来展示常规的表单上传是一个不错的选择。...然后编写index.php上传文件接收代码，使用move_uploaded_file方法即可(php大法好…) form表单上传大文件时，很容易遇见服务器超时的问题。...iframe无刷新页面 在低版本的浏览器（如IE）上，xhr是不支持直接上传formdata的，因此只能用form来上传文件，而form提交本身会进行页面跳转，这是因为form表单的target属性导致的...把form的target属性设置为一个看不见的iframe，那么返回的数据就会被这个iframe接受，因此只有该iframe会被刷新，至于返回结果，也可以通过解析这个iframe内的文本来获取。
作者简介 陈为平，携程市场部前端工程师，目前主要负责“携程运动”项目的大前端相关工作。 前段时间在忙开发携程运动项目和相应的微信小程序，其中和后端通信犹为频繁。...get、post请求方法是很多前端童鞋使用最频繁的；websocket在11年盛行后方便了客户端和服务器之间传输，……and so on ，除了这些，还有很多我们不常使用的其他方式，但是在实际的业务场景中却真实需要...本文用到的源代码都放在Github上，点击下方阅读原文可直达。 关于HTTP协义基础可以参考阮一峰老师的《HTTP协议入门》一文。...; }); }); }); enctype测试 2>表单提交: application...可以使用iframe与window.open打开的页面进行通信.
XSS的攻击过程 反射型XSS漏洞： Alice经常浏览某个网站，此网站为Bob所拥有。Bob的站点需要Alice使用用户名/密码进行登录，并存储了Alice敏感信息(比如银行帐户信息)。...这就是最基本的反射型的XSS漏洞，这种漏洞数据流向是： 前端-->后端-->前端 存储型XSS： 先给出源代码 //前端：2.html //供其他用户访问页面：show2.php 表单，为了防止提交表单后跳转，我们在表单下加了一个iframe框架，并且iframe框架的name等于form表单的target，并且我们设置...实际上这个页面偷偷的进行了表单的提交。 而我们的XSS平台也收到了发送来的数据(这数据中没有Cookie的原因是这个网站我没设置Cookie，只是随便写的一个页面)。
HTML 链接 HTML 使用超级链接与网络上的另一个文档相连。 几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。...命名锚的语法： 锚 例子： 首先，在HTML文档中对锚进行命名(创建一个书签)： 基本的注意事项-有用的提示 然后，在同一个文档中创建指向该锚的链接...HTML 布局 大多数网站可以使用 或者 元素来创建多列。CSS 用于对元素进行定位，或者为页面创建背景以及色彩丰富的外观 HTML 布局-使用 div元素 例子： 源代码中使用字符实体（character entities）。...> 表单 php" method="post/get"> <input type="text" name="email" size="40" maxlength
网页开发者们想了很多办法，试图提升文件上传的功能和操作体验，在各种Javascript库的基础上，开发了五花八门的插件。...文件上传的传统形式，是使用表单元素file： php" method="post" enctype="multipart...在HTML5没有出现之前，只能使用iframe做到这一点。用户点击submit时，动态插入一个iframe元素（以下代码使用了jQuery函数库）。 ...首先，它为表单添加target属性，指向动态插入的iframe窗口，这使得上传结束后，服务器将结果返回iframe窗口，所以当前页面就不会跳转了。...上一节的iframe上传，可以用作老式浏览器的替代方案。
网页开发者们想了很多办法，试图提升文件上传的功能和操作体验，在各种Javascript库的基础上，开发了五花八门的插件。...文件上传的传统形式，是使用表单元素file： php” method=”post” enctype=”multipart/...在HTML5没有出现之前，只能使用iframe做到这一点。用户点击submit时，动态插入一个iframe元素（以下代码使用了jQuery函数库）。 ...首先，它为表单添加target属性，指向动态插入的iframe窗口，这使得上传结束后，服务器将结果返回iframe窗口，所以当前页面就不会跳转了。...上一节的iframe上传，可以用作老式浏览器的替代方案。
PHP b1b1;height:200px;width:400px;vertical-align...表单说明表单是一个包含表单元素的区域；表单元素是允许用户在表单中输入内容；表单使用表单标签 来设置；格式：内容部分2.2 表单标签标签说明 供用户输入的表单... 一个计算结果2.3 输入元素-文本域通过 标签来设定；使用场景：比如用户在表单中输入字母、数字等字符；默认宽度为20个字符；举例：iframe>定义；作用是：通过框架可以在一个窗口中可以显示多个页面；语法：iframe src="url">iframe>3.2 设置iframe宽高使用height 和 width 属性用来定义...>图片3.3 iframe边框移除使用frameborder 属性定义iframe边框；属性值为0，则表示移除边框；举例：<!
而对于前端来说，让前端的第三方js代码能够从本质上产生隔离，并且让后端参与部分安全管控是最理想的状态。在这些方案中，在引擎层面制造隔离的iframe方案显然是最简单可行的。...-- content END --> Run按钮上绑定了一个提交表单的动作，并且表单target指向iframe。iframe将载入POST请求返回的结果页面。...HTML5带来的iframe的sandbox属性为iframe的安全机制提供了规范，在添加了sandbox属性后，默认将禁止iframe中的内容执行脚本、提交表单、访问本地文件、运行插件、导航等各种风险行为...sandbox的通信 在jsFiddle的例子中，他们采用提交表单的方式在iframe直接执行返回结果。...window.name 相比location hash，window.name值最长支持2MB大小的数据，且它绑定至iframe上，即使iframe中重新加载不同页面，window.name的值也不会变
是一种视觉欺骗手段，在web端就是iframe嵌套一个透明不可见的页面，让用户在不知情的情况下，点击攻击者想要欺骗用户点击的位置。...=self.location){ parent.location = self.location; } 建立两个页面： 1.html代码为： iframe src="2.html"> 2.html...%3D+self)+%7B+top.location%3Dself.location%3B+%7D"> 但是测试发现，新版的Chrome并不会拦截了，会直接跳转过去。...五、location劫持 在IE浏览器中，如果能够在防御代码的前面可以插入form表单的话，可以利用form表单对location进行劫持。...中设置示例： header ( "X-FRAME-OPTIONS:DENY"); 二、目前最好的js的防御方案为： body { display : none;} </style
iframe 用于在页面内显示页面，使用 iframe> 会创建包含另外一个文档的内联框架（即行内框架） iframe src="URL">iframe> 二、iframe 的常用属性 1、width...定义 iframe 的宽度 2、height 定义 iframe 的高度 3、name 规定 iframe 的名称 4、frameborder 规定是否显示边框，值为 0（不显示）和 1（显示） 5、...1、防嵌套网页 iframe 享有 click 优先权，当有人在伪造的主页中进行点击的话，如果点在 iframe 上，则会默认是在操作 iframe 的页面。...的嵌套请求 X-Frame-Options: SAMEORIGIN 只允许同源请求，例如网页为 foo.com/123.php，則 foo.com 底下的所有网页可以嵌入此网页，但是 foo.com...DOM 元素慢了 1-2 个数量级 iframe 的创建比其它包括 scripts 和 css 的 DOM 元素的创建慢了 1-2 个数量级，使用 iframe 的页面一般不会包含太多 iframe，
要解决跨域的问题，我们可以使用以下几种方法： 一、通过jsonp跨域 在js中，我们直接用XMLHttpRequest请求不同域上的数据时，是不可以的。...最终那个页面输出的结果是: ? 所以通过http://example.com/data.php?...再看看b.html页面的代码： ? a.html页面载入后3秒，跳转到了b.html页面，结果为： ?...上面的代码只是最简单的原理演示代码，你可以对使用js封装上面的过程，比如动态的创建iframe,动态的注册各种事件等等，当然为了安全，获取完数据后，还可以销毁作为代理的iframe。...在讨论第二种方法的时候，我们说过，不同域的框架间是可以获取到对方的window对象的，而且也可以使用window.postMessage这个方法。下面看一个简单的示例，有两个页面 ? ?
要解决跨域的问题，我们可以使用以下几种方法： 一、通过jsonp跨域 在js中，我们直接用XMLHttpRequest请求不同域上的数据时，是不可以的。...因为是当做一个js文件来引入的，所以http://example.com/data.php返回的必须是一个能执行的js文件，所以这个页面的php代码可能是这样的: ? 最终那个页面输出的结果是: ?...再看看b.html页面的代码： ? a.html页面载入后3秒，跳转到了b.html页面，结果为： ?...上面的代码只是最简单的原理演示代码，你可以对使用js封装上面的过程，比如动态的创建iframe,动态的注册各种事件等等，当然为了安全，获取完数据后，还可以销毁作为代理的iframe。...在讨论第二种方法的时候，我们说过，不同域的框架间是可以获取到对方的window对象的，而且也可以使用window.postMessage这个方法。下面看一个简单的示例，有两个页面 ? ?
phpsetcookie('user_id',123); //创建一个Cookie变量user id=123?>代码作用是创建一个Cookie变量user_id，它的值为123。...获取客户端cookie信息在远程服务器上，有一个接收和记录Cookie信息的文件，代码示例如下:表单该表单可以覆盖原页面显示，强迫用户输入账号和密码等信息。iframe钓鱼iframe钓鱼是通过标签嵌入远程域的一个页面实施钓鱼。...iframe src="http://www.baidu.com" height="100%" width="100%" iframe>高级钓鱼技术注入代码劫持HTML表单、使用JavaScript...本文部分图片摘自深信服安全服务认证工程师课程课件中，为方便个人学习使用，勿作商用！！！！文字内容为自己手打，并非直接搬运！如有侵权，请联系删除！！！
今天在点击客户档案导出的时候，发现先是打开了一个新标签，然后新标签自动关掉，弹出一个文件下载确认的窗口，点击确认后开始下载导出的Excel文件。...检查了一下代码，发现这跟采用服务端导出数据的处理方式有关系，本身整个过程的原理是客户端用POST方式提交表单到服务端，target属性设为空，服务端查询出要导出的数据并且组织成数组并生成header信息为文件...所以这里的原因在于发送导出Excel请求的form中的target属性设置为_blank，这个属性如果不设置，用默认的属性时会导致本身正在访问的页面跳转，是不可行的，那指定到本页面的一个隐藏的iframe...具体的实现方法，先在导出Excel的页面里加一个隐藏的iframe，示例代码：iframe src="about:blank" name="hiddenIframe" class="hide">iframe...> 导出按钮生成的发送请求的表单的示例代码： var tempForm = $('php" target
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
