基于AJAX的社交网站交互平台设计与实现【文献综述】.doc

1、毕业设计文献综述 计算机科学与技术 基于 AJAX的社交网站交互平台设计与实现 一、前言部分 写作目的 ： 社交网络是当今快速发展的互联网的一种新应用，是继电子邮件、论坛和即时通讯后一种新的网络交流方式。社交网络为个人提供了一个信息发布、交流的平台。用户通过社交网络可以方便地用文字、链接、图片等建立起个性化的空间。社交网络的发展呈现出个人化、交互化、商业化、媒体化等的特点，在经济、教育等领域中产生了巨大的影响。 本文对当前主流社交网络系统进行了分析，发现它们有部分存在更新速度慢、服务器端负担重、交互性差、表现能 力单一等缺陷，基本上停留在静态展示日志和图片的阶段。 Ajax技术 1具有异步通信

2、、响应速度快、动态效果丰富、交互能力强等优势。利用此技术来开发社交网络，能够克服上述弊端。本文在对 Ajax 的开发模式及其核心技术进行系统研究的基础上，设计并开发了基于 Ajax 技术的社交网络系统。在系统实现中，详细根据用户的需要，添加相关的用户界面和交互功能。用户界面：用来进入交互平台的用户注册和登录；让你的朋友可以看见你的瞬时的记录 电子相册 ；让你的朋友知道你的点点滴滴的 日记管理 ；可以通知朋友你关心或者提醒他的 向朋友打招呼 ；用来 和自己想交流的用户交流；取得和 管理联系方便用户之间的信息传递的文件共享等功能。 交互性方面： 确定有无该用户的 用户查找功能 ，可以添加你想交流的

3、用户的 用户添加功能 ，按不同类别为你的用户分类的 用户分组 等 功能。根据这些功能，可以发现 Ajax 技术开发的 Web 应用在可用性和用户体验方面明显优于传统的 Web 应用。 有关概念、综述范围 ： (一 )AJAX 即“ Asynchronous JavaScript and XML”（异步 JavaScript 和 XML)， AJAX 并非缩写词，而是由 Jesse James Gaiiett 创造的名词，是指一种创建交互式网页应用的网页开发技术。国内通常的读音为“阿贾克斯”和阿贾克斯足球队读音一样。 Web 应用的交互 2如 Flickr, Backpack 和 Google

4、在这方面已经有质的飞跃。这个术语源自描述从基于网页的 Web 应用到基于数据的应用的转换。在基于数据的应用中，用户需求的数据如联系人列表，可以从独立于实际网页的服务端取得并且可以被动态地写入网页中，给缓慢的 Web 应用体验着色使之像桌面应用一样。 虽然大部分开发人员在过去使用过 XMLHttp3或者使用 Iframe 来加载数据，但仅 到现在我们才看到传统的开发人员和公司开始采用这些技术。就像新的编程语言或模型伴随着更多的痛苦，开发人员需要学习新的技巧及如何最好利用这些新技术 。 (二 )社交网站 SNS，全称 Social Networking Services，即社会性网络服务，专指旨在

5、帮助人们建立社会性 网络的互联网应用服务。也指社会现有已成熟普及的信息载体，如短信 SMS 服务。 SNS 的另一种常用解释：全称 Social Network Site，即 “社交网站 ”或 “社交网 ”。1967年，哈佛大 学的心理学教授斯坦利 米尔格兰姆（ Stanley Milgram）创立了六度分割理论，被认为是社交网络的理论基础。按照六度分隔理论，网络上每个用户的社交圈都在 不断放大，最后就构成一个大型的社交网络。然而，什么是社交网络？目前还没有统一的定义。为便于理解社交网络的概念，本文给出一种供参考和商榷的描述性定义。社交网络与传统的万维网（ Web）最大不同之处在于：传统的万维

6、网的主体是内容信息，依靠内容信息组织在一起，呈现给用户；而社交网络的主体是人，依靠人与人之间的朋友关系组织在一起。社交网络必须具备三项基本功能，即 允许用户（ 1）创建和维护朋友关系；（ 2）上传自己预分享的内容信息；（ 3）浏览其他用户分享的内容信息。但这三项功能在不同的社交网站上的体现形式可能存在较大差异，如 Facebook 只允许用户遍历三层朋友关系，而国内的人人网则没有这个限制。近年来，社交网络吸引了很多人的参与和关注。例如，美国有近 90%的本科生加入到社交网络中，我国面向大学生的在线社交网络 人人网的注册用户数也超过 1亿（ 2009年 10月 27日人人网公布的数据）。表 1给

7、出了 2009年 Alexa对国内外访问量前 15位站点的排名。可以看到，国内的社交网 站虽然不敌传统的搜索引擎网站 4和新闻网站，但其页面访问量也能排进前 15位；国外社交网站 Facebook 的访问量仅次于谷歌，访问量排在全球前15位的网站中，社交网络占据了优势。同样，社交网络也引起学术界的关注，比如 2009年的国际会议 KDD（ Knowledge Discovery and Data Mining，知识发现和挖掘）、 CIKM（ ACM Conference on Information and Knowledge Management，信息与知识管理）、 IMC（ Interne

8、t Measurement Conference，互联网测量会议） 、 V L D B（ I n t e r n a t i o n a lConference on Very Large Data Bases，海量数据仓库国际会议）上都有关于社交网络的文章，尤其是 WWW会议（ World Wide Web conference，万维网会议）专门设立“ Social Networks and Web 2.0Track”（社交网络与 Web2.0论坛）来讨论相关问题，另外 SIGCOMM（ ACM Special Interest Group on Data Communications，数据

9、通信的特别兴趣小组）和 Eurosys（ the European Conference on Computer Systems，计算机系统的欧洲会议）也有针对社交网络的 Workshop（ WOSN（ ACM SIGCOMMWorkshop on Online Social Networks，在线社交网专题会议）和 SNS（ ACM EuroSys Workshop on SocialNetwork Systems，社交网络系统的专题会议）。 二、 主题部分 （一） Ajax： 历史背景 ： Ajax 技术在 1998 年前后得到了应用。允许客户端脚本发送 HTTP 请求 (XMLHTTP)

10、的第一个组件由 Outlook Web Access 小组写成。 框架应用及 对 ajax 框架的思考 该组件原属于微软 Exchange Server，并且迅速地成为了 Internet Explorer 4.0的一部分。部分观察家认为， Outlook Web Access 是第一个应用了 Ajax 技术的成功的商业应用程序，并成为包括 Oddpost 的网络邮件产品在内的许多产品的领头羊。但是， 2005年初，许多事件使得 Ajax 被大众所接受。 Google 在它著名的交互应用程序中使用了异步通讯，如 Google 讨论组、 Google 地图、 Google 搜索建议、 Gmail

11、 等。Ajax 这个词由 Ajax: A New Approach to Web Applications一文所创，该文的迅速流传提高了人们使用该项技术的意识。另外，对 Mozilla/Gecko 的支持使得该技术走向成熟，变得更为易用。 AJAX 前景非常乐观，可以提高系统性能，优化用户界面。AJAX 现有直接框架 AjaxPro，可以引入 AjaxPro.2.dll 文件，可以直接在前台页面 JS调用后台页面的方法。但此框架与 FORM 验证有冲突。另微软也引入了 AJAX 组件，需要添加 AjaxControlToolkit.dll 文件，可以在控件列表中出现相关控 件。 Ajax 技术

12、基础介绍：基于 XML 的异步 JavaScript，简称 Ajax，是当前 Web 创新 (称为Web2.0)中的一个王冠。感谢组成 Ajax 的各种技术， Web 应用的交互如 Flickr, Backpack和 Google 在这方面已经有质的飞跃。这个术语源自描述从基于网页的 Web 应用到基于数据的应用的转换。在基于数据的应用中，用户需求的数据如联系人列表，可以从独立于实际网页的服务端取得并且可以被动态地写入网页中，给缓慢的 Web应用体验着色使之像桌面应用一样。虽然大部分开发人员在过去使用过 XMLHttp 或者使用 Iframe来加载数据，但仅到现在我们才看到传统的开发人员和公司

13、开始采用这些技术。就像新的编程语言或模型伴随着更多的痛苦，开发人员需要学习新的技巧及如何最好利用这些新技术。 时刻想着用户： Ajax的最大机遇在于用户体验。在使应用更快响应和创新的过程中，定义 Web 应用的规则正在被重写 ;因此开发人员必须更注重用户。现在用户已经逐渐习惯如何使用 Web 应用了。例如用户通常希望每一次按钮点击会导致几秒的延迟和屏幕刷新，但AJAX正在打破这种长时间的状况。因此用户需要重新体验按钮点击的响应了。可用性 是 AJAX另人激动的地方而且已经产生了几种新颖的技术。其中最引人注目的是一种称为“黄色隐出”的技术，他在数据更新之前时将用户界面变为黄色，更新完成后立刻恢复

14、原来的颜色。 AJAX开发人员将用户从 Web 应用的负载中解放出来 ;小心地利用 AJAX提供的丰富接口，不久桌面开发人员会发现 AJAX 是他们的方向。 几种工具和技术 ： 随着 AJAX迅速地引人注目起来，我想开发人员对这种技术的期待也迅速地增加。就像任何新技术， AJAX的兴旺也需要一整个开发工具 /编程语言及相关技术系统来支撑。 （一） JavaScript 如名字所示， AJAX 的概念中最重要而最易被忽视的是它也是一种 JavaScript 编程语言。 JavaScript 是一种粘合剂使 AJAX 应用的各部分集成在一起。在大部分时间， JavaScript 通常被服务端开发人

15、员认为是一种企业级应用不需要使用的东西应该尽力避免。这种观点来自以前编写 JavaScript 代码的经历：繁杂而 ajax 开发框架 又易出错的语言。类似的，它也被认为将应用逻辑任意地散布在服务端和客户端中，这使得问题很难被发现而且代码很难重用。在 AJAX 中 JavaScript 主要被用来传递用户界面上的数据到服务端并返回结果。 XMLHttpRequest 对象 用来响应通过 HTTP 传递的数据，一旦数据返回到客户端就可以立刻使用 DOM 将数据放到网面上。 (二） XMLHttpRequest 即 XMLHttpRequest 对象在大部分浏览器上已经实现而且拥有一个简单的接口允

16、许数据从客户端传递到服务端并不会打断用户当前的操作。XMLHttpRequest 传送的数据可以是任何格式，虽然从名字上建议是 XML 格式的数据。开发人员应该已经熟悉了许多其他 XML 相关的技术。 XPath 可以访问 XML 文档中的数据，但理解 XML DOM 是必须的。类似的， XSLT 是最简单而快速的从 XML数据生成 HTML 或 XML 的方式。许多开发人员已经熟悉 Xpath 和 XSLT，因此 AJAX选择 XML 作为数据交换格式有意义的。 XSLT 可以被用在客户端和服务端，他能够减少大量的用 JavaScript 编写的应用逻辑。 AJAX 模式 ： 许多重要的技术

17、和 AJAX 开发模式可以从现有的知识中获取。例如，在一个发送请求到服务端的应用中，必须包含请求顺序、优先级、超时响应、错误处理及回调，其中许多元素已经在 Web 服务中包含了，就像现在的 SOA。 AJAX 开发人员拥有一个完整的系统架构知识。同时，随着技术的成熟还会有许 多地方需要改进，特别是 UI 部分的易用性。 AJAX 开发与传统的 CS 开发有很大的不同。这些不同引入 利用 ajax j2ee 开发组织机构 了新的编程问题，最大的问题在于易用性。由于 AJAX 依赖浏览器的 JavaScript 和XML，浏览器的兼容性和支持的标准也变得和 JavaScript 的运行时性能一样重

18、要了。这些问题中的大部分来源于浏览器、服务器和技术的组合，因此必须理解如何才能最好的使用这些技术。综合各种变化的技术和强耦合的客户服务端环境， AJAX 提出了一种新的开发方式。 AJAX 开发人员必须理解传统的 MVC 架构，这限制了应用层次之间的边界。同时，开发人员还需要考虑 CS 环境的外部和使用 AJAX 技术来重定型MVC 边界。最重要的是， AJAX 开发人员必须禁止以页面集合的方式来考虑 Web 应用而需要将其认为是单个页面。一旦 UI 设计与服务架构之间的范围被严格区分开来后，开发人员就需要更新和变化的技术集合了。 更好的用户体验 ： AJAX 的最大机遇在于用户体验。在使应用

19、更快响应和创新的过程中，定义 Web 应用的规则正在被重写 ;因此开发人员必须更注重用户。现在用户已经逐渐习惯如何使用 Web 应用了。例如用户通常希望每一次按钮点击会导致几秒 的延迟和屏幕刷新，但 AJAX 正在打破这种长时间 的状况。因此用户需要重新体验按钮点击的响应了。可用性是 AJAX 令人激动的地方而且已经产生了几种新颖的技术。其中最引人注目的是一种称为 “黄色隐出 ”的技术，它在数据更新之前时将用户界面变为黄色，更新完成后立刻恢复原来的颜色。 AJAX 开发人员将用户从 Web 应用的负载 利用 ajax 中解放出来 ;小心地利用 AJAX 提供的丰富接口，不久桌面开发人员会发现

20、AJAX 是他们的方向。 主要包含的技术 ： 基 web 标准（ standards-based presentation） XHTML+CSS的表示；使用 DOM（ Document Object Model）进行动态显示及交互 ；使用 XML 和 XSLT 进行 XML 和 XSLT 进行数据交换及相关操作；使用 XMLHttpRequest 进行 ajax 调用周期 异步数据查询、检索；使用 JavaScript 将所有的东西绑定在一起。类似于 DHTML或 LAMP， AJAX 不是指一种单一的技术，而是有机地利用了一系列相关的技术。事实上，一些基于 AJAX 的 “派生 /合成 ”式

21、（ derivative/composite）的技术正在出现，如 “AFLAX”。 AJAX 的应用使用支持以上技术的 web 浏览器作为运行平台。这些浏览器目前包括： Mozilla、 Firefox、 Internet Explorer、 Opera、 Konqueror 及 Safari。但是 Opera 不支持 XSL 格式对象，也不支持 XSLT。 基础应用 ： 创建 XMLHttpRequest 方 法 XMLHttpRequest 类首先由 Internet Explorer以 ActiveX 对象引入，被称为 XMLHTTP。 后来 Mozilla Netscape Safar

22、i 和其他浏览器也提供了 XMLHttpRequest 类，不过它们创建 XMLHttpRequest 类的方法不同。 对于 Internet Explorer 浏览器： xmlhttp_request=newActiveXObject(“Msxml2.XMLHTTP.3.0“); xmlhttp_request = new ActiveXObject(“Msxml2.XMLHTTP“); xmlhttp_request = new ActiveXObject(“Microsoft.XMLHTTP“); 由于在不同 Internet Explorer 浏览器中 XMLHTTP 版本可 能不一致

23、，为了更好的兼容不同版本的 Internet Explorer 浏览器，因此我们需要根据不同版本的 Internet Explorer 浏览器来创建 XMLHttpRequest 类，上面代码就是根据不同的 Internet Explorer 浏览器创建 XMLHttpRequest 类的方法。 对于 Mozilla Netscape Safari 等浏览器 创建 XMLHttpRequest 方法如下： xmlhttp_request = new XMLHttpRequest(); 如果服务器的响应没有 XML mime-type header，某些 Mozilla 浏览器可能无法正常工作。

24、 为了解决这个问题，如果服务器响应的 header 不是 text/xml，可以调用其它方法修改该heade。 xmlhttp_request = new XMLHttpRequest(); xmlhttp_request.overrideMimeType(text/xml); 在实际应用中，为了兼容多种不同版本的浏览器，一般将创建 XMLHttpRequest 类的方法写成如下形式： try if( window.ActiveXObject ) for( var i = 5; i; i- ) try if( i = 2 ) xmlhttp_request = new ActiveXObjec

25、t( “Microsoft.XMLHTTP“ ); else xmlhttp_request = new ActiveXObject( “Msxml2.XMLHTTP.“ + i + “.0“ ); xmlhttp_request.setRequestHeader(“Content-Type“,“text/xml“); xmlhttp_request.setRequestHeader(“Charset“,“gb2312“); break; catch(e) xmlhttp_request = false; else if( window.XMLHttpRequest ) xmlhttp_req

26、uest = new XMLHttpRequest(); if (xmlhttp_request.overrideMimeType) xmlhttp_request.overrideMimeType(text/xml); catch(e) xmlhttp_request = false; 发送请求 ： 可以调用 HTTP5请求类的 open()和 send()方法，如下所示： xmlhttp_request.open(GET, URL, true); xmlhttp_request.send(null); open()的第一个参数是 HTTP 请求方式 GET， POST 或任何服务器所支持的

27、您想调用的方式。按照 HTTP 规范，该参数要大写；否则，某些浏览器 (如 Firefox)可能无法处理请求。第二个参数是请求页面的 URL。第三个参数设置请求是否为异步模式。如果是 TRUE， JavaScript 函数将继续执行，而不等待服务器响应。这就是 “AJAX“中的 “A“。 服务器的响应 ： 这需要告诉 HTTP 请求对象用哪一个 JavaScript 函数处理这个响应。可以将对象的 onreadystatechange 属性设置为要使用的 JavaScript 的函数名，如下所示 ： xmlhttp_request.onreadystatechange =FunctionNam

28、e; FunctionName 是用 JavaScript 创建的函数名，注意不要写成 FunctionName()，当然我们也可以直接将 JavaScript 代码创建在 onreadystatechange 之后，例如： xmlhttp_request.onreadystatechange = function() / JavaScript 代码段 ; 首先要检查请求的状态。只有当一个完整的服务器响应 已经收到了，函数才可以处理该响应。 XMLHttpRequest 提供了 readyState 属性来对服务器响应进行判断。 readyState 的取值如下： 0 (未初始化 ) 、 1

29、(正在装载 )、 2 (装载完毕 )、 3 (交互中 )、4 (完成 ) 。 所以只有当 readyState=4时，一个完整的服务器响应已经收到了，函数才可以处理该响应。具体代码如下： if (http_request.readyState = 4) / 收到完整的服务器响应 else / 没有收到完整的服务器响应 当 readyState=4时，一个完整的服务器响应已经收到了，接着，函数会检查 HTTP服务器响应的状态值。完整的状态取值可参见 W3C 文档。当 HTTP 服务器响应的值为 200时，表示状态正常。 处理从服务器得到的数据 ： 有两种方式可以得到这些数据： (1) 以文本字符

30、串的方式返回服务器的响应 (2) 以 XMLDocument 对象方式返回响应 基于 Ajax 的应用程序架构汇总 1纯 Javascript：应用程序框架 1.1 Bindows(自从 2003年 )Bindows 是一个软件开发包 (SDK)，它，通过强力联合 DHTML， JavaScript， CSS 和 XML 等技术，能生成高度交互的互联网应用程序 -成为现代的桌面应用程序的强有力对手。 Bindows 应用程序不要求下载和也不需要在用户端安装 -仅要求有一个浏览器 (也不需要 Java， Flash 或者 ActiveX)。 Bindows 有可能领导面向对象开发的 AJAX 应

31、用程序的平台。 1.2 BackBase(自从 2003年 )是一个全面的浏览器端框架，支持丰富的浏览器功能以及与 .NET 和 Java 的集成。商业化，来自于 Backbase B.V(总部在 Amsterdam，成立于 2003年 )。 1.3 DOJO(开发中 ;自从 2004年 9月 ) 提供全面窗口小组件和浏览器 -服务器消息支持。 为创建定制的 Javascript 窗口小组件提供框架支持。 1.4 Open Rico(开发中 ;自从 2005年 5月 ;基于早期的私有框架 )是一多用途框架，支持 Ajax 基础结构和用户交互。 1.5 qooxdoo(开发中 ;自从 2005年

32、 5月 ) 是另一个雄心勃勃的框架，提供宽范围的UI 支持和正在开发中的基础结构特性。 1.6 Tibet(开发中 ;自从 2005年 6月 )目的是提供高度可移植的和全面的 Javascript API，结果是，可能自动生成大量的客户端代码。自称是 “企业级 Ajax“。 2 纯 Javascript：基础结构框架 2.1 AjaxCaller(Alpha 版本 ; 自从 5 月 2005 年 ) 是一基本的线程安全的XMLHttpRequest 包装器，主要针对 Ajax 新手，仍处于原始的 alpha 开发阶段 。 2.2 Flash JavaScript 集成包 允许 JavaScri

33、pt 和 Flash 内容的集成 。 2.3 Google AJAXSLT(发行于 2005年 6月 )是一个 Javascript 框架，用来执行XSLT 转换以及 XPath 查询。 2.4 HTMLHttpRequest(Beta 版；始于 2005年 )它使用了 XMLHttpRequest 和Iframes 以改进兼容性。 2.5 交互式网站框架 (自从 2005年 5月 ) 是一个项目，目的是从浏览器端对 Ajax基础结构的多方面予以支持。自描述为 “使用 javascript， css， xml，和 html 来创造高度交互网站的框架。包括一个定制的针对高度可读的 javascript 的 xml 分析器。实质上，是建立基于 AJAX 的网站的基础，还有另外一些通用脚本 “。 2.6LibXMLHttpRequest /connector?file=reference/2003/06/17/libXmlRequest.html)，是 XMLHttpRequest 的一个瘦包装器。 2.7 RSLite(x) 是一个针对 XMLHttpRequest 的瘦包装器。 2.8 Sack(在开发中，自从 2005年 5月 )是一个针对 XMLHttpRequest 的瘦包装器。