基于 AJAX 技术开发 Web 电子邮件客户端之 UI 篇(1)
http://www.51cto.com 2006-04-24 09:47 作者:朱先忠 编译 出处:51CTO.com
【导读】在本系列(共三篇)文章中,你将学习如何利用 AJAX 技术创建一个简单
的基于 Web 的 POP3 客户端。具体地说,我们将全面讨论如何用 AJAX 技术构建
客户端 UI 及其全面的 JavaScript 编程,最后通过一个 PHP 类检索邮件服务器中
的电子邮件消息并将其显示于 Web 页面中。
一、简介
如今,AJAX 技术给客户端 Web 应用程序的开发带来巨大的影响。这种构建 Web 应用程序的新方法—在后台发送
http 请求而不需要页面重载—已经为当今电子邮件软件(它们原来被作为桌面应用程序设计和开发)的开发提供
了若干种可能的实现方案。
你是否也想构建基于 Web 的在同一网页上运行所有功能的 FTP 客户端,聊天软件或全功能的电子邮件应用程序?
首先,你要对 AJAX 技术有一个很好的了解,学习关于它的属性和方法,然后开发相应的后台和前端,最后非常希
望你能够创建出一个至少能够体面地实现既定功能的可工作的 HTTP 程序。之后,你可以通过逐步地改进它以达到
最终把这个程序变成一个强壮的可重用库。
在本文中,我将创建一个简单的基于 Web 的 POP3 客户端—它将使用 XMLHttpRequest 对象检索一个给定邮件
服务器中的消息。这个应用程序将使用一个简单的前端来连接到邮件主机,显示消息并实现在消息间的来回导航。
在服务器端,我将使用 PHP 来存取邮件服务器,推入(pushing)POP3 命令并读取收件箱中的消息。
现在,我们开始构建这个客户端。
二、创建应用程序用户接口
第一步是构建基本的用户接口。如果仅考虑框架,这个接口的组成主要包括三个简单的 DIV 元素,它们将分别包含
这个邮件客户端的相应区域。第一个 DIV 框将包含用于显示适当数据域的区域。这允许用户输入常规信息以连接到
邮件服务器(通过指定其域名或 IP 地址,以及名字/口令组合)。下图 1 是这个客户端程序的用户接口部分构成框
架的一个快照。