所有标签:

Firefox与IE浏览器缓存的两个重要区别

网络技术 无评论 »

简介

详细介绍了firefox的缓存与IE的区别,如何设置服务响应头让两者缓存行为一致.

当你建立好一个WEB服务后,通常有两个类型的缓存需要配置:

  1. 设置网站有更新的时候html资源马上过期,以便正在浏览的用户可以很快地得到更新.
  2. 设置所有其它资源(例如图片,CSS,javascript脚本)在一定时间后过期.

这个缓存方案涵盖Two Simple Rules for HTTP Caching文章中提到关于如何处理更新的一些思想.

现在HttpWatch 6.0支持Firefox了,我们想探讨一下Firefox在处理缓存上与IE有些什么不同.设置较长过期时间的使用方式(上面第二条)仍可以直接用于Firefox,但配置1在两者之间还是存在细微差别的.

之前的文章 中,我们把第一条划分为:

  • 某些时候动态HTML页面需要即时从服务器更新以备随时显示-甚至是使用后退按钮的时候.例如,显示银行帐号的状态或在线订单.
  • 静态HTML页面,比如联系,FAQs或者站点地图等页面,如果它们设置了Last-Modified响应头,允许浏览器在需要的时候重新校验,就可以利用到缓存.

本文剩下部分探讨了Firefox中影响HTML页面缓存的两个重要不同点.

1. 使用no-cache防止Firefox缓存无效

你可以简单地设置如下的响应头预防IE缓存任何东西:

Cache-Control: no-cache

使用了这个响应头的页面不会保存在缓存里,IE总会重新从服务器加载;即使你使用后退按钮.下面这个例子使用HttpWatch监听一个网上商店,当我们在提交订单表单后点击后退按钮,结果如下图:

然而,这个响应头却不能防止Firefox的缓存.这意味着,Firefox在正常访问的情况下,将一直使用缓存的页面,直到它发送GET请求重新检验.并且,如果是通过后退按钮访问页面,Firefox不会再次访问服务器,而是简单直接地从缓存加载.

那怎样才能关掉Firefox中的缓存呢? 答案很简单,关不了. 因为Firefox依靠缓存中的副本为”文件->另存为”,”查看源代码”这样的操作服务.但是,你可以控制页面缓存到哪里及那些缓存条目可以用于显示.

下面响应头在Firefox中可以防止持久化的缓存,强制页面被缓存到内存中:

Cache-Control:no-store

这个头也可以防止使用后退按钮时访问了缓存页面,它将触发一个HTTP GET请求.

这两个响应头的值组合使用可以在IE与Firefox得到期待的结果:

Cache-Control: no-cache, no-store

如下HttpWatch响应头标签所示:

no-store and no-cache headers

2. 如果没有设置过期时间Firefox会为你设置一个

当IE遇到没有Expires头的http响应时,它就认为永远不能自动使用缓存条目,直到它重新从服务校验.由于IE的临时文件的一个设置项”检查所在网页的较新版本”默认为”自动”,所以通常都是一个会话做一次.

这就为控制静态的html内容的缓存提供了一个合理的方式.用户新打开的IE会得到html的最新版本,而缓存的版本就在关闭IE前会一直被使用.

Firefox处理缺失Expires头的方式不同.如果影响中有Last-Modified头它就会使用HTTP 1.1规范RFC2616中指定的一个尝试性的过期值:

(引用规范:)
并且,如果响应中有Last-Modified时间值,尝试性的过期值不能超过这个值到现在时间间隔的一个比率,一般设置这个比率为10%.

计算方式如下:

过期时间 = 现在时间 + 0.1 * (Last-Modified到现在的时间差)

例如,如果你的静态HTML文件上次修改时间是100天前,那过期时间就是10天之后.下面的示例是一个没有Expires头页面的HttpWatch缓存标签:

Firefox自动设置了过期时间为8天后,因为这个页面大概80天没有被修改过了.

这意味着,为了保持控制好你的HTML页面,正如我们在 Two Simple Rules for HTTP Caching 文章中讨论过的,你最好为你的静态资源如HTML,图片,CSS文件等,在你的WEB服务器设置一个合适的Expires值.

结论

为了确保IE与Firefox的缓存行为一致,你应该:

  • 总是指定一个Expires头. 一般设置-1使用html页面能即时刷新或者对其它如图片,CSS,javascript脚本资源设置一个特定的过期时间
  • 如果你要强制页面刷新,甚至是点击后台按钮的时候,那就设置 Cache-Control: no-cache, no-store
Tags »||||

修改Firefox缓存的位置

网络资源 无评论 »
  1. 打开Firefox浏览器,在地址栏输入  about:config
  2. 查找  browser.cache.disk.parent_directory,如果没有找到  browser.cache.disk.parent_directory ,则通过右键新建这个”字符串
  3. 修改到你需要存放的位置,例如M:\Firefox
  4. 重启 Firefox 程序
  5. 最后验证一下是不是生效了
    在地址栏输入  about:cache ,可以发现Cache位置已经成功修改
    Cache Directory:    M:\Firefox\Cache
Tags »

Firefox下自动换行的解决方案

网络资源 无评论 »

IE中不会出现问题, ff则会出现, 症状是, 文章不换行, 会突破div边框的限制, 在外部显示, 严重影响了页面显示的美观和整洁.
网易博客的解决方案是overflow=”hidden”, 虽然仍然会突破边框, 但会被边框外的部分覆盖, 页面显示不会太受影响, 但也不是最好的解决方法.
阅读全文 »

Tags »|

Firefox插件(XUL)开发 学习笔记

Javascript, 网络资源 无评论 »

阅读全文 »

Tags »|||

FireBug 控制台函数说明

Javascript, 网络资源 无评论 »

FireBug 是一个非常实用的JavaScript以及DOM查看调试工具,是 Firefox 的一个插件。使用 FireBug 调试 AJAX 应用非常方便,终于可以告别 alert 时代了!

Console Logging 函数

阅读全文 »

Tags »||

firefox扩展开发

Javascript, 网络资源 无评论 »

firefox扩展开发(一) : 扩展的基本结构

用过firefox的人肯定要安装firefox的扩展,这样才能发挥火狐的全部实力。一般扩展是一个后缀为.xpi的文件,其实这个文件就是zip格式的压缩包,压缩了一个扩展所需要的所有目录和文件,基本的目录结构如下:
阅读全文 »

Tags »|||

基于 Mozilla 的扩展开发

Javascript, 未分类, 网络资源 无评论 »

目录

阅读全文 »

Tags »|||

实战 Firefox 扩展开发

网络资源 无评论 »

Firefox 浏览器自身提供良好的扩展结构,使得开发人员可以方便的扩展其行为。很多网站,比如 del.icio.us,都提供 Firefox 扩展来提供更好的用户体验。学习这方面的知识不仅对于网站开发人员是有用的,其他人也可以通过开发扩展来解决一些使用 Firefox 中遇到的具体问题。本文以一个能够批量下载某个 HTML 页面上所有图片的 Firefox 扩展作为案例,详细的介绍了 Firefox 扩展的开发流程。这其中包括构建开发环境,使用 XUL 来描述用户界面,使用 JavaScript 来为扩展增加行为,扩展的打包、发布和更新等方面的内容。

案例介绍

阅读全文 »

Tags »||

Firefox 扩展中文化实例教程

未分类 无评论 »

1. 扩展中文化基础

Mozilla Firefox 将核心代码和用户界面分离,这样使得 Firefox 很容易做到本地化。Firefox 扩展同样也遵循这样的原则。如果我们要做一个 Firefox 扩展的中文化,只需要翻译扩展语言包中的文本文件,而不用去碰那些复杂的程序源代码。

阅读全文 »

Tags »|

Setting up extension development environment for Firefox

网络资源 无评论 »

This article gives suggestions on how to set up your Mozilla application for extension development.

Development profile

To avoid the performance hit of development-related prefs and extensions, and to avoid borking your personal data, you can use a separate profile for development work.

阅读全文 »

Tags »|||

Firefox扩展开发学习杂记

网络技术 无评论 »

扩展开发中用得着的扩展:

Extension Developer’s Extension (xpi download / install address) 快速将扩展目录打包成xpi文件,在不重启Firefox的情况下重新载入所有扩展以及其他实用小功能。必备!如果不使用该扩展快速重载扩展的话,每次修 改代码之后都必须从Firefox的菜单栏选择“退出”关闭Firefox再打开才有99%的几率保证该Chrome内容是最新修改后的,那叫一个痛苦。 即使设置参数 nglayout.debug.disable_xul_cache = true ,也只是减少了修改窗口或对话框之后的重启而已。
阅读全文 »

Tags »||

在eclipse中动态开发Firefox扩展

Java, 网络技术 无评论 »

这几天学习Firefox中扩展开发,经过了一个基本的入门以后(推荐一个Firefox扩展入门教程 ttp://www.borngeek.com/firefox/toolbar-tutorial/ ),便开始在网上查找可以在eclipse中开发Firefox扩展的插件,发现使用比较多的主要在XULBooster与spket,前者由于要建立在 WTP的基础上,而我已经安装了myeclipse,所以就不想再增大eclipse的体积了,由于便下载了spket来开发Firefox插件,现在将 使用spket创建与最终生成Firefox扩展的过程整理后与大家分享:

阅读全文 »

Tags »|

刷新网页的小技巧

网络技术 无评论 »

在 Firefox 和 IE 下,Ctrl + F5 可以保证完全刷新当前页面,而不是从缓存中读取被缓存的内容(如:css 或 js)。

这在调试网页程序的过程中,会变得非常有用,你就不用来回来去的清除浏览器缓存了。如果你发现这个方法不太好使,直接向 Firefox 或 IE 的开发人员反应就可以了

Tags »||

Firefox 下运行多 Profile 的方法

未分类 1 评论 »

这段时间一直在 Firefox 下做 GI (General Interface) 开发,非常需要一个干净的 Firefox 环境,以此加快 GI Builder 的运行速度。由于以前做过 Firefox 的扩展开发,所以多少有些这方面的经验,又上网查了下资料,找到了更好的运行多 Profile 的方法,分享一下 :) 。下面是启动 noExt 配置环境的批处理文件

@echo off
set MOZ_NO_REMOTE=1
start “” “C:\Program Files\Mozilla Firefox\firefox.exe” -P noExt

通过以上的批处理方式启动 Firefox,你可以同时在 Window 下运行多个 Firefox 进程,而彼此之间不受影响。

Tags »

Firefox Plugin Development

网络技术 无评论 »

一、环境搭建
1、Gecko-SDK
Firefox是Mozilla基金会主持的、支持多种主流平台的、和Netscape一脉相承的浏览器,内核名字叫Gecko。开发插件前,你首先应该到Mozilla Plugins去了解一下,那里是标准和权威的所在,既有文档,有又例子,关键的是还有一个开发插件必不可少的Gecko-SDK供你下载,这里我主要讨论Windows版的,Linux版的用GNU GCC编译。
阅读全文 »

Tags »|