iframe嵌套第三方页面,怎么解决

2024-11-04

第三方页面嵌入到web项目的方案之使用iframe嵌入

有些项目中可能会遇到这样的需求, 需要在一个项目中嵌入其他的项目的页面或者功能.并且需要这两个页面之间能够进行交互. 本文主要介绍如何实现这种第三方应用的嵌入, 主要有以下几个方向: 1.iframe引入第三方应用 2.嵌入js片段 3.封装成SDK 本篇将主要介绍第一种, 通过iframe嵌入第三方页面, 接下来的几篇文章将分别介绍其他两种方式使用iframe嵌入是目前使用很广泛的一种嵌入方案, 先看几个案例: 一. 使用案例搜狐移动端使用iframe嵌入广告: 移动端视频网站使用ifra

移动端web页面列表类上拉加载，查看详情，iframe嵌套第三方页面遇到的问题以及解决办法

1.移动端上拉加载网上有很多成熟的插件,比如iscroll.在这里介绍一下用jquery和js写的上拉加载方法.使用原生的去写上拉加载更多需要三个高度去做对比,以新闻类列表举例,首先需要整个dom的高度,其次需要移动设备窗口的高度,最后需要滚动条距离顶部的高度,移动设备的高度加上滚动条距离顶部的高度等于dom的高度时,表示已经滑动到底部,进而加载下一页,监听滚动条的滑动事件使用scroll()方法.当然这里也可以进行无感知加载,就是当移动设备高度和滚动条高度相加和dom高度接近时就加载下一页的

页面中iframe中嵌入一个跨域的页面，让这个页面按照嵌入的页面宽高大小显示的方式；iframe嵌套的页面不可以编辑的问题解决方案

<html> <head> <style> body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; overflow: hidden; } </style> </head> <body> <iframe src="http://gongkai.kaipuyun.cn/databaseInfo/index"

iframe嵌套的页面之间传值问题

项目中很多时候会遇到需要用 iframe 嵌套页面的情况.有时候会有这样的需求: iframe 嵌套的页面 A ,点击之后要跳到页面 B ,但是同时还需要 A 页面中的某个属性值. 此时可以先把 A 页面的属性值赋值给最外层的父页面,然后再赋值给 B 页面. A 页面的值赋值给最外层的父页面: 如父页面有个隐藏的button元素 <input type="button" id="parentID" value="" /> 赋值给此元素

iframe嵌套vue页面打开新窗口

iframe嵌套vue页面时目录结构为下图: 此时出口文件指向index.html, 所以只需要用a标签动态拼接href, 并设置属性 target="_blank" ,即可在iframe打开新窗口

使用ajax与iframe嵌套实现页面局部刷新

使用ajax与iframe嵌套实现页面局部刷新.该javascript代码仅供参考,需按自己需要修改.1. [代码]javascript代码 function cj_start(depname,groupid){ var urls = "<%=path%>/userGather.action"; var status = ""; var html_1 = "<iframe frameborder=\"0\&q

关于https域名下的页面iframe嵌套http页面的问题

业务场景:在一个https域名下用iframe嵌套一个http域名的页面,会直接报错的,报错信息如下: 这段话的意思是:http域名的页面是通过https域名页面加载的,在一个安全的页面不允许加载一个不安全的路径的页面: 解决方案-:http域名需要配置证书为https的,保证两个页面的域名都是https开头的: 解决方案二:每个用户想要看到嵌套页面可以跳转的,都要在浏览器里面的设置--设置隐私和安全性--网站设置--不安全内容--允许--添加那两个域名,也可以实现跳转:

EasyUI Tabs + Yii2.0实现iframe方式打开页面（解决共用静态文件引入加载的问题）

在项目实际开发中,有将打开的各个链接页面隔离的需求(防止静态资源起冲突),这个时候常规思路就是使用iframe来实现!但遇到一个比较棘手的问题,当用easyui Tabs打开一个iframe页面时,怎么解决原有共用静态资源引入的问题.有人建议可以考虑将共用静态资源文件放到一个php文件中,然后每次渲染页面时加载即可,这个时候很多朋友会想到PHP的include()方式,但是每个iframe页面都要include一次,岂不是很麻烦.而且项目的要求是iframe打开和easyui tabs href

vue iframe嵌套单页面时打开新窗口并自定义浏览器标题

vue打开新窗口两种写法,效果一样: 第一种: router-link 传参用query或者params都可以,tagget和tag一定要加上才可以: 第二种: 直接写成a标签就可以了. 改变浏览器窗口标题: 代码如下: mounted() { document.title = '你想要的标题';} 每天记录一点点!

easyui 中iframe嵌套页面，大弹窗自适应居中的解决方法。$('#win').window()

easyui 中iframe嵌套页面,大弹窗自适应居中的解决方法.$('#win').window() 以下是左边栏和头部外层遮罩显示和隐藏方法 /*外层遮罩显示*/ function wrapMaskShow(){ var maskTop = window.top.$("#mask-top");//外层遮罩 var maskLeft = window.top.$("#mask-left"); maskTop.show(); maskLeft.show(); $(

easyui 中iframe嵌套页面，提示弹窗遮罩的解决方法，parent.$.messager.alert和parent.$.messager.confirm

项目中用到easyui 布局,用到north,west,center三个区域,且在center中间区域嵌入iframe标签.在主内容区做一些小提示弹窗(例如删除前的弹窗提示确认)时,会遇到遮罩问题,由于center区域是iframe嵌套的,所以里面的小弹窗无法覆盖页面的头部和左边目录栏. 情形一.点击提示弹窗里的确认后,提示弹窗消失: //warnTips为传入的值,例如successMask(“确定要删除选中的数据吗?”) function successMask(warnTips){ par

解决在HTTPS页面里嵌套HTTP页面浏览器block的问题

问题描述: 浏览器默认是不允许在HTTPS里面引用HTTP页面的,ie下面会弹出提示框提示是否显示不安全的内容,一般都会弹出提示框,用户确认后才会继续加载,但是chrome下面直接被block掉,只在控制台打出信息. 在写网站的时候,自己的网站要嵌入别的网站,用iframe嵌入部分内容,当我把网站升级成https后,发现用iframe嵌http页面内容显示不出来,chrome控制台打出不安全的信息. 解决思路: 谷歌上不去不知道有没有更好的解决办法,反正百度里没找到.大致说下思路,https里嵌

页面嵌套时js失效解决方法

事件:iframe或easyui的dialog嵌套页面时,被嵌套的页面可能js因位置失效; 解决: //动态加载js(根据父级html位置计算) jQuery.getScript("script/classTreeSelect.js", function(data, status, jqxhr) {/*加载完成可执行*/});

一键切换皮肤的解决思想及iframe嵌套时寻找下级iframe的方法

项目中有个一键切换皮肤的功能,感觉还不错,记录下,就是各颜色样式设置起来太复杂了,不知道有没有更简便的方法: 1.切换皮肤结构层 <li title="<s:text name='cems.skin'/>"> <a data-toggle="collapse" href="#colorPick"><img src="${basePath}/images/homePageicon/colorPic

母版页改变被嵌套的页面中的控件ID的解决方法

使用过模板页的朋友都会很纳闷,怎么页面的用js通过getElementById(“id”):找不到对象.查看了页面源代码才发现,原来控件的ID变了,这是母版页导致的.因为母版页怕母版页本身页面中的控件ID和嵌套了它(母版页)的页面的ID相同而导致冲突,所以它(母版页)就悄悄的改变了它所嵌套的页面中的控件的ID值. 解决JS获取不到页面原本ID的方法是:document.getElementById('<%=txtName.ClientID %>'); 用了.ClientID 后就可也获取到控件

iframe嵌套页面中的跳转

简单说一下场景. 假设有A.B.C和D四个JSP页面,D通过iframe嵌套在C中,C通过iframe嵌套在B中,B通过iframe嵌套在A中. 然后现在在D中编写JavaScript代码跳转页面. 在本页面跳转(D页面所在的iframe中跳转) window.location.href = '要跳转的页面路径'; 在上一层跳转(D页面所在iframe的父页面中跳转,即C所在的iframe中跳转) parent.location.href = '要跳转的页面路径'; 如果要在B所在的iframe

在iframe下的页面锚点失效问题，用jquery进行修复

应用场景是:iframe页面没有滚动条,在父窗体中出现滚动条,锚点标记就会失效,因为,锚点是根据当前窗口滚动条滚动窗口的,成为子窗体后没有了滚动条,自然不会滚动. 解决办法是:用js判断页面是否被嵌套,用js计算iframe在父窗体位置,锚点在firame中的位置,两者相加成为父窗体的滚动. 遇到问题:获取父窗体元素(因为有域限制,所有需要在网络环境下方位(即http://domain.com)):父窗体嵌套多个iframe,判断是否是当前iframe页面. 代码: 父窗体页面 index.ht

IFrame 根据嵌入页面自动调节大小

很多人估计会遇到这样的情况,在IFrame嵌入某些页面,总会出现滚动条,那么有没方法,可以让IFrame随着嵌入页面的内容大小自动调节大小而不出现滚动条呢?答案是肯定的,经过查找,本人发现用IframeResizer脚本可以很好解决此问题,并且它是跨域名的,即使嵌入的是第三方页面,不需繁杂处理,几个步骤就可以使它自动调节宽度和高度. 1.首先下载iframe-resizer最新版本,现在是v2.5.2, 地址: https://github.com/davidjbradshaw/iframe-r

谷歌、火狐浏览器下实现JS跨域iframe高度自适应的完美解决方法，跨域调用JS不再是难题！

谷歌.火狐浏览器下实现JS跨域iframe高度自适应的解决方法导读:今天开发的时候遇到个iframe自适应高度的问题,相信大家对这个不陌生,但是一般我们都是在同一个项目使用iframe嵌套页面,这个ifame高度自适应网上一搜一大把,今天要讲的如何在不同的网站下进行相互的调用跟在同一个网站下是一个效果:例如我在自己的项目里面Iframe 了第一博客的页面 http://www.diyibk.com/ 当第一博客的页面高度变化了怎么通知父页面呢? 这个时候在谷歌下肯定是拿不到 ifram

winform窗体嵌套HTML页面，开发出炫彩桌面程序

一:CEF全称Chromium Embedded Framework,是一个基于Google Chromium 的开源项目.Google Chromium项目主要是为Google Chrome应用开发的,而CEF的目标则是为第三方应用提供可嵌入浏览器支持. 二:winform窗体嵌套HTML页面需要CEF的相关组件添加到项目引用里,文章结尾附有链接,还有一个模板demo仅供参考三:winform窗体嵌入HTML的两种情况 1,只是简单的嵌入HTML页面,没有form窗体和页面的逻辑交互,在引入

iframe嵌套第三方页面,怎么解决

热门专题