通过meta段的设置可以控制浏览器的渲染行为,但在一些特殊情况下,meta段的设置无效,我们需要额外的操作以达到目的。

模式1:页面A(IE)iFrame引用页面B(Chrome Frame)

问题描述
在IE渲染的页面A中,使用iframe引用的页面B即使添加了meta信息也不会使用Chrome Frame渲染。
解决方法
CFInstance.js(见文档附件)同样是由Google提供的开源源代码,帮助我们更灵活的使用Chrome Frame。在页面A中引入CFInstance.js,页面加载完毕后调用new CFInstance()。其返回一个内部使用Chrome Frame渲染的Object对象。最后将该对象添加至A页面目标位置(删除原iframe,不再需要)。示例代码如下:

function onload() {
if (CFInstance && CFInstance.isAvailable()) { //判断CFInstance是否可用
var gcf = new CFInstance({
src : url, //页面B的url地址
className : “chrome-frame” //通过该className可以控制返回对象的css
});
document.body.appendChild(gcf); //添加至页面指定位置
}
else {
open(url, “_self”); //CFInstance不可用时执行的动作
}
};

问题描述模式2:页面A(Chrome Frame)iFrame引用页面B(IE)

在Chrome Frame渲染的页面A中,使用iframe引用的页面B(无论是否添加了meta段)也将使用Chrome Frame渲染。
解决方法
调整页面结构,增加框架页C(使用IE渲染)。将页面A、B分别使用new CFInstance和iframe方式引入并布局在框架页C中,页面结构如下:

模式3:页面A(Chrome Frame)Open页面B(IE)

问题描述
在Chrome Frame渲染的页面A中,调用window.open打开的页面B(无论是否添加了meta段)也将使用Chrome Frame渲染。
解决方法
调整页面结构,增加框架页C(使用IE渲染)。通过new CFInstance方式将页面A引入框架页C,在页面A中调用框架页C的open方法打开页面B。这时页面B将使用IE渲染。页面结构如下:

在页面A中调用框架页C的open方法时,不能简单的通过window.parent.open方式实现,需要借助CFInstance的rpc实现跨浏览器通讯。示例代码如下:

//框架页C代码示例
function onload() {
if (CFInstance && CFInstance.isAvailable()) {
var gcf = new CFInstance({
src : url,
className : “chrome-frame”
});
gcf.rpc.expose(“showIEDialog”, showIEDialog); //注册页面A中可调用的方法
document.body.appendChild(gcf);
} else {
open(url, “_self”);
}
};function showIEDialog(url, name, options) {
window.open(url, name, options);
}
//页面A代码示例
if (CFInstance && !dorado.Browser.msie) { //判断当前为非IE浏览器且CFInstance可用
if (CFInstance.rpc) { //判断当前页面是否通过new CFInstance方式打开
//调用框架页C中暴露的方法showIEDialog,第二个参数为传递的参数
CFInstance.rpc.callRemote(“showIEDialog”, [ url, name, options ]);
CFInstance.rpc.init();
} else { //当前页面非new CFInstance方式打开,例如直接使用Chrome浏览器打开了框架页C
alert(“目标地址需要IE浏览器”);
}
} else { //当前浏览器为IE且Chrome Frame不可用,页面A为IE渲染
open(url, name, options);
}

模式4:页面A(Chrome Frame)使用 ActiveX

问题描述
如何在Chrome Frame渲染的页面中使用ActiveX。
解决方法
不推荐在Chrome Frame渲染的页面中使用ActiveX,需要确保使用ActiveX控件的页面由IE渲染。
存疑的备选解决方法
ActiveX for Chrome是一款专门为Chrome浏览器开发的扩展程序,其目的是为了在Chrome浏览器中可以直接使用ActiveX控件。但该项目已经很长一段时间没有更新。在本次项目中,经过实际测试,其并不能很好的为所有ActiveX控件提供支持。因此,如果使用ActiveX for Chrome,一定要进行全功能覆盖测试。
项目地址:http://code.google.com/p/np-activex/

参考资料:http://wiki.bsdn.org/pages/viewpage.action?pageId=50070010

js下载:CFInstall.js    CFInstance.js

Google Chrome Frame 自定义渲染方式,调用ActiveX的更多相关文章

  1. IE内嵌google chrome frame解决浏览器兼容问题

    IE内嵌google chrome frame解决浏览器兼容问题  http://www.cnblogs.com/xwdreamer/archive/2013/12/17/3477776.html 参 ...

  2. 【转】IE内嵌google chrome frame解决浏览器兼容问题

    参考文献: http://www.pseudowired.com/2012/12/04/tomcat-http-header-manipulation/(html中自动添加使用chrome的heade ...

  3. IE 加速插件之 Google Chrome Frame

    前言 IE 8 及以下版本的速度较慢. 特别是前端的js 和 css 内容较多时尤为突出. 就笔者的开发经验来说GWT, Ext JS, raphael , draw2d 等开发的系统在IE下使用是相 ...

  4. Google chrome浏览器中通过扩展调用本地应用程序以及和程序相互通讯(C++)

    最近项目用到浏览插件的开发,IE用到的是BHO,chrome打算做成扩展. 但是和ie有一点不同,chrome扩展是基于html+js+css开发的,那么就会有二个问题 1. 代码和算法等容易被别人复 ...

  5. 使用 Google Chrome 数据抓包方式免费下载收费音乐

    对于每个有音乐细胞的 boys & girls 来说,听音乐的时候是不是会经常遇到如下图的问题. 自从音乐进入正版之后,很多歌曲只有付费用户才可以下载.虽然可以在线听,可是以我的倔脾气,就是喜 ...

  6. 告别IE给我们的web开发带来的困扰(使用chrome frame v8引擎)

    茶爸爸个人微信:benyzhous,公众号:cha-baba欢迎骚扰 由于客户所有机器必须使用IE6浏览器,导致我们在开发项目过程中遇到非常多的样式与性能问题,在偶然的一次使用360软件管家搜索chr ...

  7. 【转】使用Chrome Frame,彻底解决浏览器兼容问题

    本文转自http://www.ryanbay.com/?p=269,感谢该作者的总结 X-UA-Compatible是自从IE8新加的一个设置,对于IE8以下的浏览器是不识别的. 通过在meta中设置 ...

  8. Skyline TerraExplorer Pro(等ActiveX控件)在Google Chrome浏览器的运行方法

    首先感谢ActiveX for Chrome 网银助手(np-activex)这个项目(https://code.google.com/p/np-activex/),解决了我们困惑很久的问题——在Ch ...

  9. Google Chrome 自定义协议(PROTOCOL)问题的处理

    最近在使用谷歌浏览器的时候遇到了自定义协议(PROTOCOL)的问题,比较折腾,特此记录,希望我浪费生命换来的结果能够帮助读到此文的朋友少浪费一点宝贵的时间! 由于某些原因,电脑里一直没有安装阿里旺旺 ...

随机推荐

  1. Android的消息机制: Message/MessageQueue/Handler/Looper

    概览   * Message:消息.消息里面可包含简单数据.Object和Bundle,还可以包含一个Runnable(实际上可看做回调). * MessageQueue:消息队列,供Looper线程 ...

  2. TextEdit 回车事件

    <dxe:TextEdit Name="txtSearchPatientName" KeyDown="txtSearchPatientName_KeyDown_1& ...

  3. 完全图解scrollLeft,scrollWidth,clientWidth,offsetWidth 获取相对途径,滚动图片(网上找的,未经试验,但觉得比较好)

    获取元素的位置属性可以通过 HTMLElement.offsetLeft HTMLElement.offsetTop 但是,这两个属性所储存的数值并不是该元素相对整个浏览器画布的绝对位置,而是相对于其 ...

  4. javascript - encodeURI和encodeURIComponent的区别

    这两个函数功能上面比较接近,但是有一些区别. encodeURI:不会进行编码的字符有82个 :!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z, ...

  5. Raw-OS源代码分析之消息系统-Queue_Size

    分析的内核版本号截止到2014-04-15.基于1.05正式版.blogs会及时跟进最新版本号的内核开发进度,若源代码凝视出现"???"字样,则是未深究理解部分. Raw-OS官方 ...

  6. ubuntu 13.10 Ralink RT3290 无线与蓝牙4.0的驱动安装

    我的本是hp envy15, 蓝牙与无线的型号是Ralink RT3290, 装了Ubuntu 13.10 64bit后,蓝牙无法使用,无线几秒钟就会断开,查知,是因为驱动问题. ## 准备工作 首先 ...

  7. android 检测网络是否可用

    /**     * 检测网络是否可用     *      * @return     */    public boolean isNetworkConnected() {        Conne ...

  8. [Javascript] Functor Basic Intro

    Well, this stuff will be a little bit strange if you deal with it first time. Container Object: Just ...

  9. Winform中进行MD5加密

    Winform,c#进行MD5加密直接上步骤: 1.添加引用 2.在.NET选项卡中找到“System.Web” 3.选中之后,点击“确定”即可,此时会在解决方案中看到刚才添加的引用 4.引用名空间: ...

  10. android开发(50) Android透明状态栏。适用于 4.4 以上及 5.0以上设备

    概述 有时候我们想在 andorid 手机上实现一种 跨越 顶部状态栏的效果,比如一张图片直接显示在 状态栏内.比如下图: 这个页面里有张图片,这个图片显示在整个页面的上部分.状态栏是 漂浮在这个图片 ...