突袭HTML5之Javascript API扩展5—其他扩展(应用缓存/服务端消息/桌面通知)

发布时间：2020-11-30 12:09:00 所属栏目：编程来源：网络整理

导读：前面已经总结了首要的API扩展(应用缓存/处事端动静/桌面关照),下面的几个只有在特定的场所才气施展它的潜质，无一破例，IE均不支持,桌面关照今朝只有Chrome支持,

副问题[/!--empirenews.page--] 前面已经总结了首要的API扩展，下面几个扩展只有在专用的场所才会施展最大的浸染，这里简朴相识一下。下面这些特征无一破例，IE均不支持。应用缓存和处事端动静在其他的主流赏识器中都是支持的。桌面关照今朝只有Chrome支持。
应用缓存
许多时辰，我们必要缓存一些不常常改变的页面来进步会见速率；并且对付某些应用，我们也但愿在离线的环境下也可以行使。在HTML5中，你可以通过一个称之为“应用缓存”的技能很利便的实现这些成果。
在应用缓存的实现中，HTML5应承我们建设一个缓存manifest文件来利便的天生一个离线版的应用。
实现步调：
1. 启用页面的缓存，很简朴，只必要在document的html中包括manifest属性：

复制代码

代码如下:

<!DOCTYPE HTML>
<html manifest="demo.appcache">
...
</html>

每一个包括这个manifest属性的页面当用户会见的时辰城市被缓存。假如manifest属性没有指定的话，将不会缓存（除非网页被直接在manifest文件中指定）。manifest文件扩展名还没有同一的尺度，保举的扩展名是".appcache"。
2. 处事器端设置manifest文件的MIME范例
一个manifest文件必要被正确的MIME-type支持，这种文件范例为"text/cache-manifest"。必需在所行使的web处事器长举办设置。譬喻：Apache 中可在 .htaccess 中添加： AddType text/cache-manifest manifest。
3.编写manifest文件
manifest文件是一个简朴的文本文件，汇报了赏识器去缓存什么内容（可能不缓存什么内容）。
manifest文件包括下面三个部门：
• CACHE MANIFEST - 在这个列表问题下的文件将会在下载后被缓存。
• NETWORK - 在这个列表问题下的文件将要求毗连随处事器，不会举办缓存。
• FALLBACK - 在这个列表问题下的文件假如不能会见时，则表现特定的页面。
完备的一个文件如下面的例子所示：

复制代码

代码如下:

CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html5/ /offline.html

提醒：
#开头的代表注释。
*可以用暗示全部的其余资源可能文件。譬喻：

复制代码

代码如下:

NETWORK:
*

暗示全部的资源可能文件都不会缓存。
4.更新缓存
一旦一个应用被缓存，它将保持缓存除非一下环境产生：
• 用户删除了缓存
• manifest文件被修改
• 应用缓存被措施修改
以是一旦文件被缓存，除了工钱的修改环境，赏识器将会一连的表现缓存版本内容，纵然你修改了处事器文件。为了让赏识器更新缓存，你只能去修改manifest文件。
：以"#"开始的行是注释行，可是可以有其余用处。假如你的修改只涉及到一个图片可能javascript成果，那些变革是不会被从头缓存的。在注释中更新日期和版本是让赏识器从头缓存你的文件的一个要领
：赏识器可以有许多差异巨细限定的缓存数据（有些赏识器应承5M的缓存数据）。

复制代码

代码如下:

<strong>处事端动静</strong>
尚有一个常常行使的场景是：当处事端的数据产生变革时，怎样让客户端知道？这在早年的做法是：页面主动去查询处事端是否有更新。按照前面的先容，我们知道，行使WebSocket可以实现双向通信。这里再先容其它一个HTML5中新特征：处事端动静(Server-Sent Events)。
在HTML5中，承载这项特征的工具是EventSource工具。
行使步调如下：
1.搜查赏识器对EventSource工具的支持性，这个各人都知道了：

复制代码

代码如下:

if(typeof(EventSource)!=="undefined")
{
// Yes! Server-sent events support!
// Some code.....
}else {
// Sorry! No server-sent events support..
}

2.处事器端的发送动静代码
处事器端的发送更新动静很简朴：配置content-type头信息为”text/event-stream"后，你就可以发送变乱。以ASP代码为例：

复制代码

代码如下:

<%
Response.ContentType="text/event-stream"
Response.Expires=-1
Response.Write("data: >> 处事器时刻" & now())
Response.Flush()
%>

3.赏识器端的吸取动静代码

复制代码

代码如下:

var source=new EventSource("demo_sse.php");
source.onmessage=function(event){
document.getElementById("result").innerHTML+=event.data + "
";
};

代码声名：
• 建设一个EventSource工具，指定发送更新的页面URL （这里是demo_see.jsp）
• 每一次一个更新吸取后，onmessage变乱就触发
• 当onmessage时刻触发，将获得的数据配置到id="result"的元素中
EventSource工具除了onmessage变乱外，尚有处理赏罚错误的onerror变乱，毗连成立的onopen变乱等。
桌面关照 - 准HTML5特征
桌面关照成果可以或许让赏识器纵然是最小化状态也能将动静关照给用户。这和WebIM是最为自然的团结。不外，今朝支持该特征的赏识器只有Chrome。弹窗是各人切齿腐心的对象，以是开启这项特征必要获得用户的容许。

复制代码

代码如下:

赏识器中打开此页面，就会看到桌面的右下角弹出一个一连5秒钟的动静窗口。
这项特征行使起来很简朴，可是在现实操纵的进程中，应该只管镌汰关照成果对用户的滋扰，最洪流平的镌汰关照成果的呈现。
下面是网上好手做这个应用的一些履历：
1. 收到多条动静时确保只呈现一条关照;
这个题目较量好办理，由于关照工具拥有一个名为"replaceId"的属性。指定该属性后，只要是沟通replaceId的关照窗口弹出，城市包围之前弹出的窗口。在现实项目中是给全部的弹出窗口赋了一个沟通的replaceId。不外必要留意的是，这种包围举动只在同域下有用。
2. 当用户处于IM呈现的页面中时(页面处于Focus状态)将不呈现关照;
这个题目首要是在于判定赏识器窗口是否处于Focus状态，今朝除了监听window的onfocus和onblur变乱之外，貌似没有更好的方法。在项目中就是通过这种方法来记录窗口的Focus状态，然后当动静达到时按照Focus状态来判定是否弹出窗口。

复制代码

代码如下:

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

1/3

尾页

MySQL源码安置	运用图形界面从SQL导入
MySQL5.7+keepalived+	windows系统下jsp+mys