`
struts
  • 浏览: 76072 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

用推送方式动态实现页面内容

阅读更多
一、什么是动态内容 
大多数热门Web网站都从在线广告业务获利。Web页面中的广告空间是有限的,为了让广告投资物有所值,广告客户不仅必须在很小的广告空间内塞入大量的信息,而且还要保证广告能够吸引用户的注意力。在当前的大多数网站上,放入Web页面的横幅广告一般由服务器在构造页面的同时生成,我们无法把新的广告动态地插入到已经发送出去的页面。 如果要显示新的广告,唯一的办法就是重新刷新页面。我们可以用编程的方法刷新页面,例如:

使用浏览器窗口对象的setTimeOut函数定期地刷新页面。但是,用这种方法刷新广告时,用户会很明显地感到页面刷新过程;同时,要确定一个合适的刷新频率也很困难。 
把页面的过期时间设置为数秒时间,使得无论何时输入焦点转到该页面(即浏览器被激活)时,浏览器就会重新下载该页面。 
一些大型网站,如yahoo.com和msn.com,都已经采用了这些技术。这两种方法都有各自的优点和缺点。在只使用Java的情况下,我们完全可以通过网络编程和一些界面编程工作实现横幅广告的刷新系统,但必须解决下载时间过长和刷新延迟的问题。 

二、用Java实现内容推送 
结合JavaScript帧间通信和一个管理网络通信的Java Applet,我们能够用推送技术解决这个问题。在这样一个系统中,Java Applet的任务是连接服务器并监听内容更新。一旦接收到了新的内容,Applet就构造出显示这些新内容的HTML代码,调用一个JavaScript函数并把包含新内容的HTML传递给JavaScript函数。JavaScript函数运用DHTML和DOM技术,把页面中一个<div>标记的内容用参数中传入的新内容替换。由于浏览器安全的限制,Applet所打开的Socket端口只能连接到下载该Applet的服务器。 

Web服务器只在80端口监听连接请求。因此,除了Web服务器之外,我们还需要一个接受Applet的Socket连接请求的网络应用服务。这个网络应用服务定时地查询数据库,把改动数据发布(推送)到所有已经连接的Applet。由于运用了隐藏帧和JavaScript的帧间通信功能,我们能够从用户面前隐藏大多数JavaScript逻辑。 

在这整个处理过程中,最困难的任务是Java Applet与JavaScript代码之间的通信。Netscape提供了一个称为netscape.javascript.JSObject的类。要使用这个对象,请加入一个包含特殊“MAYSCRIPT”属性的Applet标记:

<APPLET code="MyApplet.class" height=1 width=1 MAYSCRIPT> 

JSObject的方法允许Applet与文档对象交互以及调用JavaScript命令。例如,把下面的代码放入Applet,我们就能够访问窗口对象: 

import netscape.javascript.*; public class MyApplet extends java.applet.Applet{ private JSObject mainwin; public void init(){ mainwin = JSObject.getWindow(this); } } 

获得JSObject引用后,我们就能够访问文档窗口对象,并通过JSObject的eval()方法调用JavaScript函数。 

三、用DHTML更新页面 
在把来自Applet的新内容写入文档时,为了不影响原来已经存在的内容,我们可以使用HTML的<div></div>标记。这个标记在IE和Netscape中是不同的。 

  对于IE以及Netscape 6,这个HTML标记是: 

// 所有要更新的内容必须用id标识 <div id="iexplorer" width=700px ></div> 


  对于Netscape 4.x版本,这个HTML标记是: 

<DATA><layer id="netscapev" ></layer></DATA> 

  虽然我们可以通过引用适当的ID,从Applet直接更新HTML内容,但为了清楚起见,我们将把更新HTML代码的程序逻辑放入JavaScript函数。下面的JavaScript代码把浏览器的类型保存到ie变量: 

applnname=navigator.appName; if(applnname=="Microsoft Internet Explorer") { ie=true; } else { ie=false; } 

Applet从新数据构造出HTML代码,把它保存到JavaScript变量content,然后调用assignData()方法。内容数据可以是从纯HTML到XML到二进制数据的任何东西。 

// 根据浏览器类型调用合适的方法 function assignData() { if(ie) {explore();} else {navig(); } } 


如果浏览器是IE或者Netscape 6,Applet调用explore()方法: 

//content是一个javascript变量,它以HTML格式描述了需要 //显示的新数据 function explore() { iexplorer.innerHTML=content; } 

  如果浏览器是Netscape 4.0或者更高版本,Applet调用navig()方法: 

function navig() { document.netscapev.document.write(“<DATA>“ + content + “</DATA>“); document.netscapev.document.close(); } 

四、通信过程 
在服务器端,一个ImageAppliation.java类的实例响应Socket连接请求,并为每一个新的连接请求创建一个新的线程。为了简化代码,每一个线程只检查数据文件是否改变。如果数据文件已经改变,则线程读取文件内容,并把新的数据发送给已经连接的Applet(示例应用把整个文件发送给Applet)。 

在客户端,一个隐藏帧包含了ImageApplet.java这个Applet,因此用浏览器的查看HTML源代码功能是无法看到Applet标记的。Applet实现了连接服务器(下载该Applet的源服务器)的功能,并实现了一个简单的通信协议。建立与服务器的连接之后,Applet接收来自服务器的数据,构造出HTML代码,并调用JavaScript函数把数据传入文档: 

public void upDateHTML(String str){ //data是表单的名字, //quote是一个JavaScript变量 //str是新构造出来的HTML代码 mainwin.eval("document.data.quote.value=“" + str + "“"); mainwin.eval("javascript:assignData()"); return; } 

netscape.javascript.JSObject完成Applet到JavaScript的通信,不同版本的客户端浏览器需要不同的版本。你可以下载得到为Netscape提供的压缩类文件java40.jar。IE已经带有JSObject类,但有点难找。你可以搜索$windows$\Java\Packages目录寻找包含JSObject类的ZIP文件。 

服务器把ImageArrayElement.java类的实例通过toString()方法串行化成为字符串发送给Applet。服务器从数据文件构造出各个对象,调用toString()方法,连接得到代表所有对象的字符串,最后发送结果字符串。而在另一端,Applet接收并解析这个字符串,重新构造出各个ImageArrayElement对象。这里之所以用一个长字符串的形式发送数据,是因为这种方法只需要很简单的处理过程,使得用户能够以接近实时的速度立即得知数据的变化;但是,我们也可以用另外一种方法,即以向量的形式发送对象。 

在一个正式运行的应用中,你一般应该让新数据插入当前页面的过程透明。但在示例应用中,为了让程序运行过程更加直观,它将在新内容到达的时候提示用户。 

推送技术最主要的优点就是应用服务器只把那些改变的数据发送到网络,从而使得延迟减到了最少。由于这个Applet负责完成的工作非常少(不涉及用户界面,这部分工作由浏览器负责),所以Applet体积很小,装载速度非常快。 

五、如何运行本文实例 
要测试本文示例应用,你的机器上必须安装有Web服务器和JDK 1.7或更高版本。 

安装要点: 

解开ZIP压缩文件并安装到Web服务器默认根目录。 
对于IIS服务器,默认根目录是Inetput\wwwroot 
对于jsdk2.1所带的免费服务器,默认目录是<安装目录>\webpages 
解开压缩文件之后,所有文件都将安装到<Web服务器根>/exp/目录。 
把下面几行代码加入默认页面。每一种服务器都有自己的默认页面,IIS的默认页面是“default.htm”,请参见Web服务器文档了解具体说明: 

<ul><li> <a href="/exp/ImageMain.htm"> Java based dynamic Ad-Banner</a></li> </ul> 

运行应用的步骤: 

打开一个DOS窗口,进入<默认Web目录>/exp,执行“java ImageApplication”。系统将显示“Server started listening at port 6011”。注意确保classpath环境变量指向了当前工作目录。 
启动Web服务器。 
打开浏览器输入下面的URL:http://localhost:8080。该URL将打开Web服务器的默认页面,它应该有一个“Java based dynamic Ad-Banner”链接。点击这个链接就启动了本文的示例应用。 
用Notepad打开“/exp/images.txt”文件,复制并粘贴一行内容,保存文件。你可以立即看到系统显示一个JavaScript窗口提示内容更新。关闭JavaScript窗口,页面将显示新的内容。 
请从这里下载本文实例的完整代码,411 KBhttp://www.89cn.com/down/pushweb.zip
分享到:
评论

相关推荐

    用推送技术动态更新页面内容.doc

    【用推送技术动态更新页面内容】 在Web开发中,动态内容更新是一种常见的需求,尤其是在实时性和用户体验方面有高要求的应用中。传统的网页刷新机制通常依赖于客户端定时刷新或用户手动刷新,但这可能导致用户体验...

    eclipse极光推送

    【Eclipse极光推送详解】 Eclipse极光推送(JPush)是极光公司提供的一款高效、稳定、易用的Android、iOS以及Web推送服务。...同时,也要注意遵守极光推送的使用规范,避免滥用推送导致用户反感。

    Flutter应用集成极光推送的实现示例

    Flutter应用集成极光推送的实现示例 Flutter 应用集成极光推送的实现示例 在移动应用开发中,消息推送是一个非常重要的功能,它能够...通过使用极光推送,可以快速实现消息推送功能,提高应用的用户体验和运营效率。

    Android 接收推送消息跳转到指定页面的方法

    问题的提出 本次接入的是个推,其他...App在前台时,弹出Dialog提醒用户有新消息,但是最新版的个推文档接收推送消息是继承IntentService,无法获取弹出Dialog所需要的Context(注意不能用getApplicationContext()),

    后台推送php实现程序

    Ajax(Asynchronous JavaScript and XML)是实现后台推送的关键技术,它允许页面在不重新加载整个网页的情况下与服务器交换数据并更新部分网页内容。`state`变量可能用来存储当前的推送状态,用于判断前端如何处理...

    极光推送+讯飞语音播报

    通过以上方式,开发者可以构建一个既能显示推送消息,又能在用户不便查看时进行语音播报的应用,提高用户交互性和便利性。结合极光推送的高效推送能力和讯飞语音的高质量合成,这样的整合应用无疑能为用户提供更加...

    帝国CMS7.5百度实时推送主动推送插件亲测可用ZLPlugin-BDPush Pro

    为了提高网页被百度搜索引擎快速抓取,很多网站管理员会选择使用主动推送插件。本文将详细介绍针对帝国CMS7.5版本的“ZLPlugin-BDPush Pro”百度实时推送插件,帮助您理解其工作原理、安装过程及使用方法。 **一、...

    使用dwr+spring实现消息推送

    在IT行业中,消息推送是一项重要的技术,它使得服务器能够实时地向客户端发送数据,而无需客户端不断地轮询请求。在本教程中,我们将探讨如何利用Direct Web Remoting (DWR) 和Spring框架来实现这样的功能。 DWR是...

    dwr+spring实现后台向前台推送实例

    本实例是在一些网络资料的基础上整合出来的一个:以后台向前台页面推送消息的一个完整实例工程,采用了spring、dwr反转,实现的是后台向前台不断推送消息,并管理相关用户退出;可以用在如定时任务的桌面消息提醒之...

    百度搜索推送管理WP插件-提升博客页面百度收录效率

    自动推送是百度搜索资源平台为提高站点新增网页发现速度推出的工具,安装自动推送JS代码的网页,在页面被访问时,页面URL将立即被推送给百度。 Sitemap推送-Sitemap推送功能也是百度站长URL提交功能之一,本插件只...

    多种方式模拟服务器推送客户端

    当服务器端有新数据时,更新页面内容,浏览器会自动刷新Iframe,从而达到推送的效果。这种方式简单,但可能导致页面整体加载延迟,且不适用于所有浏览器。 在实际应用中,选择哪种方式取决于具体的需求和环境。Ajax...

    实现 Dwr 服务器推送

    本文将详细介绍如何实现DWR的服务器推送功能。 一、DWR简介 DWR的核心功能是通过AJAX技术创建了一个JavaScript到Java的桥梁,使得开发者可以像操作本地对象一样操作远程服务器上的对象。它支持自动类型转换、错误...

    flash(swf)+xiff3.0+openfire实现网页端接收推送消息

    总的来说,这个示例提供了一个完整的流程,展示了如何使用Flash、XIFF和Openfire在网页端实现消息推送功能。通过深入理解和实践这些技术,开发者可以构建自己的实时通信应用,满足各种在线协作和通信需求。

    c#实现推送通过的是百度云

    使用百度云推送,开发者可以实现单播、群播、标签播等多种推送方式,并且支持自定义消息格式和丰富的消息展示样式。 在C#中实现百度云推送,我们需要以下步骤: 1. **注册并获取API密钥**:首先,你需要在百度云推...

    websocket实现长连接网页消息推送到android手机

    本例子分为客户端(就是android手机),网页端为后台服务器。可以实现网页消息推送到手机,手机也可发消息到网页,很好的实现了消息的同步,不会有延迟,刷新现象。可以实现网页微信,二维码扫描登陆,聊天室等等。

    javaweb实现后台向前台的消息推送 comet4j

    本示例介绍的是如何使用Comet4j这个第三方库来实现后台到前台的消息推送功能。Comet4j是一个专门用于JavaWeb应用的长连接通讯框架,它简化了基于Comet技术的实时通信实现。 首先,我们要理解Comet技术。Comet是一种...

    实现信息推送

    本教程将详细介绍如何实现网页中的信息实时推送,同时结合环境配置的图解文档,以帮助开发者更好地理解和实施这一功能。 首先,我们要理解信息实时推送的基本概念。传统的HTTP协议是基于请求-响应模式的,即客户端...

    Android手机端小米推送Demo解析和实现方法

    《Android手机端小米推送Demo解析与实现详解》 在Android应用开发中,消息推送是一项重要的功能,它能够实现实时地将服务器端的信息传递给用户,提升用户体验。小米推送作为第三方推送平台,以其稳定性和高效性受到...

    comet demo 向客户端推送例子

    这种方式适合推送少量数据,因为每次推送都会触发客户端的onreadystatechange事件。 在这个"comet demo"中,可能包含以下组件: - 客户端JavaScript代码:负责建立和维持Comet连接,并处理服务器推送过来的数据。 -...

    WebForm实现消息推送

    然而,WebForm框架通过一些技术手段,如Comet技术,可以实现在不刷新页面的情况下,服务器向客户端推送消息。 首先,让我们了解什么是Comet技术。Comet是一种使服务器能够长时间保持与浏览器连接的技术,这种连接...

Global site tag (gtag.js) - Google Analytics