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

 http://www.cnblogs.com/xwdreamer/archive/2013/12/17/3477776.html

参考文献:

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

http://www.baike.com/wiki/Google+Chrome+Frame(google chrome frame介绍)

http://www.cnblogs.com/Libra/archive/2009/03/24/1420731.html

项目背景:

我们的项目中使用了highcharts和svg相关的内容,所以要求至少要IE9才可以,或者使用firefox、chrome等其他浏览器。但是客户是国企,他们使用的都是windows自带的浏览器,普遍是IE7和IE8,有些甚至还是windows xp自带的IE6,让人倍感崩溃。

当时建议客户升级IE版本,升级到至少IE9,但是他们的OA系统支持只IE7跟IE8,这样的事情还真有,我自己公司就是这样子。所以升级的提议被否决。

然后建议客户下载chrome浏览器,但是客户说他们很多人都是访问不了外网的,而且领导们都懒得下载浏览器,太麻烦。

无奈执行我就只能选择以下的解决方案

解决方案:

浏览器判断

在web页面上做浏览器判断,如果浏览器版本低于<=IE8,那么就跳转页面,转到下载chrome浏览器或者下载google chrome frame的页面

<script type="text/javascript">
$(document).ready(function(){
var bro=$.browser;
var binfo="";
if(bro.msie)
{
binfo= "Microsoft Internet Explorer " +bro.version;
if(eval(parseInt($.browser.version))<9)
{
// alert(binfo);
location.href='./browser.html'
}
}
if(bro.mozilla)
{
binfo= "Mozilla Firefox "+bro.version;
}
if(bro.safari)
{
binfo= "Apple Safari "+bro.version;
}
if(bro.opera)
{
binfo= "Opera "+bro.version;
}
//alert(binfo);
}) </script>

google chrome frame的介绍

在文献2种我们可以大体知道google chrome frame是个什么东西。Google Chrome Frame,官方的正式中文名称为“谷歌浏览器内嵌框架”。Google Chrome Frame是Google推出的一款免费的Internet Explorer专用插件。使用此插件,用户可以通过Internet Explorer的用户界面,以Chrome内核的渲染方式浏览网页。在运行插件之后,IE浏览器将获得Chrome的性能和功能。它将使用Chrome的WebKit 引擎处理网页,另外也支持IE所没有的HTML5等其他技术。

其实是一种挂羊头(IE)卖狗肉(Chrome)的东西,或者说是披着羊皮的狼。但是我们就是需要这匹狼来给我们解决问题。

但是我们在安装完这个插件以后发现,我们使用IE浏览器打开我们的网页,还是给我跳转到下载浏览器界面,我在首页上面使用alter调试,判断当前浏览器发现还是IE8。后来知道如果要是IE启用chrome核心有两种方法:(文献2中有介绍)

  1. 修改注册表,从此以后IE全部使用chrome核心。(与业务需求不符合,客户还指望着使用IE8去访问他们的OA呢)
  2. 在web页面上面添加类似于X-UA-Compatible的标签,主动让IE使用调用chrome核心。(这正是我们当前需要的)
<meta http-equiv="X-UA-Compatible" content="chrome=1">

根据修改,我在自己的web页面上面添加了一下内容,其含义如下:如果当前浏览器版本是<=IE8的,那么给我使用chrome,如果不是,则使用IE。

 <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=IE8">

urlrewritefilter的使用

欢欢欣欣做完以上内容,我想这样我就可以访问自己的网站的了把,可是悲哀的发现,只有首页是使用chrome核心的,其他没有加X-UA-Compatible标签的页面还是使用IE核心。这尼玛太蛋疼了,难道让我找出出所有html页面,然后一个一个手动加上去,这样的事情是人干的吗?想着肯定有人跟我一样碰到同样坑爹的事情,所以就google搜索了一下,最后找到了文献1。看到老外形容IE浏览器的词,suck,fuck,shit,就能看出他是多恨IE了。按照该作者的介绍,我知道了urlrewritefilter,来到他的官方网站,跟着教程去一步一步执行。ok,最后解决问题了。

这个东西的整体思路就是,不管你是发request还是response请求,最后他都会在你的请求页上面加上你设定的内容,我这里设定的内容就是 <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=IE8">。

最后google chrome frame这个东西到2014年就不再官方支持了,官方推荐我们下载最新的google浏览器。不过我想应该不会影响使用。

作者:xwdreamer
欢迎任何形式的转载,但请务必注明出处。
分享到:
 
分类: JavaWeb
 
好文要顶 关注我 收藏该文 
1
0
 
 
 
posted @ 2013-12-17 08:42 xwdreamer 阅读(7339) 评论(1) 编辑 收藏
 
评论列表
 

#1楼 2014-08-01 22:29 咸鱼翻身 

Google Chrome Frame不支持直接从本地local file方式打开页面,必须把页面部署到Web服务器发布方式打开
•Google Chrome Frame不支持64位的机器:Currently, 64-bit versions of IE are not supported. It's worth pointing out that 32-bit IE is the default on 64-bit Windows 7.
•Google Chrome Frame不支持iframe方式: At this point ChromeFrame only supports the meta tag detection on top level URLs.

您好

如上所说吗?

IE内嵌google chrome frame解决浏览器兼容问题的更多相关文章

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

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

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

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

  3. IE 加速插件之 Google Chrome Frame

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

  4. Google Chrome Frame 自定义渲染方式,调用ActiveX

    通过meta段的设置可以控制浏览器的渲染行为,但在一些特殊情况下,meta段的设置无效,我们需要额外的操作以达到目的. 模式1:页面A(IE)iFrame引用页面B(Chrome Frame) 问题描 ...

  5. 解决浏览器兼容ES6特性

    为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...

  6. js复制当前url地址解决浏览器兼容

    1.网上搜索的js复制链接代码,好像只能支持ie浏览器,其他浏览器不支持, 案例: var url=12; if(window.clipboardData){                   wi ...

  7. 教你一招解决浏览器兼容问题(PostCSS的使用)

    我们在处理网页的时候,往往会遇到兼容性的问题.在这个问题上分为两个大的方向:屏幕自适应&浏览器兼容.而屏幕自使用的方法有许多,包括框架之类的,但是浏览器的兼容却没有一个号的框架.在我们日常处理 ...

  8. 解决浏览器兼容问题的css hack

    原理 由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系.我们就可以根据这个来针对不同的浏览器来写不同的CSS.CSS Hack大致有3种表现形式,CSS类内部Hack.选择 ...

  9. vue cli创建的项目 当你后期使用了ES6语法,如何解决浏览器兼容问题

    最近开发了一个项目,开发过程中,由于需要使用了async await ,于是发现,只有少数的浏览器支持,极大多数的浏览器是不支持这玩意的,在网上各种找解决方案,基本都是失败,最后总结了两个方案之后,尝 ...

随机推荐

  1. POJ 1094 (TopoSort)

    http://poj.org/problem?id=1094 题意:该题题意明确,就是给定一组字母的大小关系判断他们是否能组成唯一的拓扑序列.是典型的拓扑排序,但输出格式上确有三种形式: 1.该字母序 ...

  2. table中td的空格

    1.css的方式去掉空格 .table{ border-collapse:collapse; border-spacing:0px; }

  3. dk.internal.org.objectweb.asm.Opcodes.IF_ACMPNE

    http://cr.openjdk.java.net/~hannesw/8008351/webrev/src/jdk/nashorn/internal/codegen/Condition.java.s ...

  4. 阻止事件冒泡两种方式:event.stopPropagation();和return false;

    jQuery提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function (event) { ...

  5. [Spring MVC] - InitBinder验证

    Spring MVC使用InitBinder验证: 使用InitBinder做验证的情况一般会在此Controller中提交的数据需要有一些是业务性质的,也即比较复杂的验证情况下才会使用.大部份简单的 ...

  6. JsonResult序列化并保存json文件 以及对json文件读取反序列

    项目中我们经常遇到一些经常访问的接口,并且更新及时度不是特别高,那么我们可以利用文件来做一些数据请求的缓存. 这里以微信公众号获取粉丝用户列表为例,我们把微信公众号查到的用户先缓存在文件中,这样在翻页 ...

  7. Eplan PPE Pro-panel Electric fluid P8 2.4图文安装教程

    Eplan ppe pro-panel electric fluid P8等多个最新2.4中文版本的安装,都是使用相同的虚拟驱动MultiKey,还是只有win32位的安装包,不过支持64位操作系统的 ...

  8. C#中Monitor类、Lock关键字和Mutex类

    线程:线程是进程的独立执行单元,每一个进程都有一个主线程,除了主线程可以包含其他的线程.多线程的意义:多线程有助于改善程序的总体响应性,提高CPU的效率.多线程的应用程序域是相当不稳定的,因为多个线程 ...

  9. ubuntu14升级到15后遇到的问题

    ubuntu14的unity坏了,于是就找了个镜像升级到15.但是升级完android开发环境出了点问题.. 1:Picked up JAVA_TOOL_OPTIONS: -javaagent:/us ...

  10. Hadoop SequenceFile数据结构介绍及读写

    在一些应用中,我们需要一种特殊的数据结构来存储数据,并进行读取,这里就分析下为什么用SequenceFile格式文件. Hadoop SequenceFile Hadoop提供的SequenceFil ...