我正在开发一个用于离线使用的Web应用程序,因此我需要使用应用程序缓存功能。

Chrome(15.0.874.106)的一切都很好用,但在Firefox(7.0.1)和Opera(11.52)上无效。

这是我的缓存清单文件cache.manifest.PHP(我已经减少到最低限度):

<?PHP 
    header("Cache-Control: max-age=0,no-cache,no-store,must-revalidate");
    header("Pragma: no-cache");
    header("Expires: Wed,11 Jan 1984 05:00:00 GMT");
    header('Content-type: text/cache-manifest');
?>CACHE MANIFEST

CACHE:

/app/common/css/reset.css
/favicon.ico

而这是“主”HTML文档的前4行:

<!DOCTYPE html> 
<html manifest="/app/mobile/cache.manifest.PHP"> 
    <head> 
    <title>MyApp Mobile</title>

当我尝试将缓存清单(http://www.myapp.com/app/mobile/cache.manifest.PHP)加载到浏览器中时,文件显示正确,但是当我尝试加载页面一次离线后,我得到“无法连接”错误页面。再次,这只是在Firefox和Opera上发生。

Firebug说“离线缓存中有0项”,我没有找到在DragonFly上检查应用程序缓存的方法。

我很生气,我不知道如何在Firefox和Opera上有效地调试问题。
请帮忙。

谢谢,

解决方法

根据我使用HTML5 AppCache的经验,一旦你得到它的工作,但是非常脆弱,这是很棒的。如果最小的事情出错,浏览器会忽略整个文件,烦人地,而不是使用浏览器的普通缓存,从头开始重新加载所有服务器。

更糟糕的是,浏览器不会重新加载清单文件,除非文本内容更改。所以你可以调整你的服务器头或一些东西来修复它,但是除非cache.manifest.PHP的内容改变了,否则浏览器将会盲目忽略它,并且完全按照上一次做的。所以它可能已被破坏,那么你修复它,但浏览器忽略这些更改,因为cache.manifest.PHP的文本内容没有改变。这甚至似乎免除了清除浏览器缓存,这是使其如此混乱的一部分 – 应用程序缓存真的非常严重,关于缓存。

为了解决这个问题,评论中的文字更改计数,所以在顶部有一个版本或时间戳或日期(例如#版本1.2)的评论,并且当您希望浏览器“注意”时进行更改。

那么浏览器仍然不会立即使用它!应用程序缓存的工作方式是下次加载页面时,它将再次完成上次的操作,并开始在后台检查更新。所以你可能想要控制台,等待像“更新…”然后“完成”的东西,然后点击刷新,浏览器将终于开始使用新版本。最后!

总而言之,它可以是一个正确的痛苦去工作。但是,一旦它工作,它几乎是防弹的:你几乎可以放心,缓存清单中列出的任何东西只能每个用户一次下载一次,直到您更改文件的文本内容。

浏览器标准的合规性是相当不错的,所以我最好的猜测是你实际上是有效的,但是你最后检查了Chrome,它是唯一正确缓存清单文件的浏览器。在开发过程中,您可能已经损坏了,但Firefox和Opera正在将其旧的清单文件夹在死亡之中。我敢打赌你也尝试清除浏览器缓存在Firefox和Opera,这可能什么也不做 – 你需要更改文件的文本内容和双重刷新之前,Firefox和Opera将最终放弃其破坏的版本的清单文件,开始使用您可能上传到旧版的工作。

HTML5 – 缓存清单在Chrome上运行良好,但不能在Firefox和Opera上运行的更多相关文章

  1. 使用HTML5做的导航条详细步骤

    这篇文章主要介绍了用HTML5做的导航条详细步骤,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  2. 详解HTML5中的picture元素响应式处理图片

    这篇文章主要介绍了详解HTML5中的picture元素响应式处理图片,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  3. html5利用canvas实现颜色容差抠图功能

    这篇文章主要介绍了html5利用canvas实现颜色容差抠图功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

  4. HTML5拖拽功能实现的拼图游戏

    本文通过实例代码给大家介绍了HTML5拖拽功能实现的拼图游戏,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧

  5. HTML5实现直播间评论滚动效果的代码

    这篇文章主要介绍了HTML5实现直播间评论滚动效果的代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. 详解使用双缓存解决Canvas clearRect引起的闪屏问题

    这篇文章主要介绍了详解使用双缓存解决Canvas clearRect引起的闪屏问题的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. 使用Html5多媒体实现微信语音功能

    这篇文章主要介绍了使用Html5多媒体实现微信语音功能,需要的朋友可以参考下

  8. HTML5 播放 RTSP 视频的实例代码

    目前大多数网络摄像头都是通过 RTSP 协议传输视频流的,但是 HTML 并不标准支持 RTSP 流。本文重点给大家介绍HTML5 播放 RTSP 视频的实例代码,需要的朋友参考下吧

  9. html5 拖拽及用 js 实现拖拽功能的示例代码

    这篇文章主要介绍了html5 拖拽及用 js 实现拖拽,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  10. HTML5自定义视频播放器源码

    这篇文章主要介绍了HTML5自定义视频播放器源码,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

随机推荐

  1. 微信小程序canvas实现水平、垂直居中效果

    这篇文章主要介绍了小程序中canvas实现水平、垂直居中效果,本文图文实例代码相结合给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下

  2. 使用HTML5做的导航条详细步骤

    这篇文章主要介绍了用HTML5做的导航条详细步骤,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  3. H5最强接口之canvas实现动态图形功能

    这篇文章主要介绍了H5最强接口之canvas实现动态图形功能,需要的朋友可以参考下

  4. Canvas高级路径操作之拖拽对象的实现

    这篇文章主要介绍了Canvas高级路径操作之拖拽对象的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  5. html5视频自动横过来自适应页面且点击播放功能的实现

    这篇文章主要介绍了h5视频自动横过来自适应页面且点击播放,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. 详解HTML5中的picture元素响应式处理图片

    这篇文章主要介绍了详解HTML5中的picture元素响应式处理图片,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. canvas像素点操作之视频绿幕抠图

    这篇文章主要介绍了canvas像素点操作之视频绿幕抠图的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  8. html5利用canvas实现颜色容差抠图功能

    这篇文章主要介绍了html5利用canvas实现颜色容差抠图功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

  9. canvas绘制视频封面的方法

    这篇文章主要介绍了canvas绘制视频封面的方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  10. HTML5拖拽功能实现的拼图游戏

    本文通过实例代码给大家介绍了HTML5拖拽功能实现的拼图游戏,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧

返回
顶部