基于JavaScript MVC模式的Wiki设计与实现

ｈｔ： ｔｌ ｐｌ ｗｗｖ ・ ａｏｇ ａ ．Ｓ ． ． Ｃ － ｒｃ
２１ ０ １年 第 ２ 卷 第 ７期 Ｏ
的差异 ，我们往往不得不针对特定的浏览器编 写脚本
般
端 器 ｌ 务口
ｏ Ｒ Ｍ
语言 。但是在 编 写客户 端模 型 的时候 ，我们纯 粹与
ｓ。
结粜 ——
…０ ｔ，
摘
要：ＭＶ Ｃ模式常被应用于大型 的 Ｂ Ｓ ／ 应用程序开发 ，它提供 了一个结构 化的模型，实现 了软件开发的分工
和应用 程序的模块化 。深入研 究了一个 Ｗｉｉ系 统在客户端 浏览器 中 的设计 与实现 ，在 实现过程 中完全使 用 ｋ ＪｖＳ ｒ ｔ ａ ａｃｉ 并结合 ＭＶ 模式，使得整个应用程序具有较 高的系统 性，由于使用 了模块分割提高了代码复用率， ｐ Ｃ
ｒａ ｚｓ ｏ ｗ ｅ ｅ ｅ ｐ ｅ ｔ ｂｓａｅ ｓ ｅ ｐ ｌ ａ ｏ ’ｍｏ ｕａ ｚｔ ｎ Ｔ ｉ ｐｐｒ ｎｄｐｈｓ ｄ ｓ ＫＩ ｅｌ ｅ ｆ ａ ｖｌ ｍ ｎ’ｊ — ｒ ｌａ ａ ｐ ｃｔ ｎＳ ｄ ｌ ｉａ ｏ ． ｈｓ ａｅ ｅｔ ｕ ｉ ＷＩ ｉ ｓｔ ｒ ｄ ｏ Ｓｏ ｈ ａ ｗ ｌｓ ｉ ｉ ｒ ｉ ｉ ｔ ｅａ
）
ｆｎ ｔ ｎ ｇ ｔｒｍＯ ｊｃ（ｂ， ｅ ， ｅ） ｅ ｒ （ ｊ ｕ ｃ ｏ ｅ ｏ ｂｅｔ ｊ ｋｙ ｄｆ｛ ｔ ｎ ｏ ｉ Ｆ ｏ ｒｕ ｂ ＆＆（ｅ ｂ ＆＆ｏ ｊ ｅ １ ｏｊ ｅ ］ ｅ； ｋ ｙ ｎｏｊ ｉ ） ｂ［ ｙ） ｂ［ ｙ： ｆ ｋ ？ ｋ ｄ ）
ｆ ｎ ｔ ｋ ｐ ｓ ｘ Ｄａ ） ｕ ｃｉ ｗｉｉ ｏ ｔ ｍｌ ｔ ｏｎ （ ａ
器端维护客户端和数据库之间的通信 ，其 中客户端采
用 ＪｖＳ ｒ ｔ ａ ａｃｉ 向服务器端发送 Ａ ａ ｐ ｊｘ请求 。本文将着重
ＪｖＳ ｒ ｔ ａ ａ ｃ ｐ 实现的 ＭＶＣ模式使得用户界面、用户操作 ｉ
和 具体 的业务逻辑（ 后台的数据库） 分离， 能够 实现软件
描述应用程序 的客户端实现 。整个系统 的架构如 图 １
１ 概ｊ
Ｗｉ ｌ ｄ一词来源于夏威夷语 的 “ ｅ ｅ ｅ ｅ ” ｗ ｅ ｅｗ ｅ ｅ ， ｋ ｋ
在基于 Ｗｅ ｂ应用的软件 开发中，ＭＶＣ模式被广 泛 应用 。该模式 的核心思 想［ ｌ １ 是将程 序 分成相对独 ， ２
立 ，而又能协同工作的 ３个 部分 ：模 型、视 图、控制 器 。降低模块 之间的耦合，为大型可扩展 的 Ｗｅ 应用 ｂ
＿
｛
通过在服务器端定义细粒度 的、容 易处理的对象 ，为
从数据库到客户端传播数据定义一条清晰 的路径 。
／ ｊｘ调用服 务器端 方法 ，并指定 回调 函数 ，用 ／ａ Ａ 于更新返回后 的用户界面更新
）
首先 ，从数据库创建了一个服 务器 端对象模 型。 这样 ，就可 以将数据读入对 象，修 改它 ，然后保存数
】 ， ｇ ｔｕｅｄｆｎ ｔ ｎ）ｒｔｒ ｔｉ． ． ｂ ｔｎ ｅＰ ｒｌ ： ｃｉ （｛ｅｕ ｎ ｈｓ ｓ ｓ ｉｇ ｕ ｏ ｊｄ ｕ ｒ
（ ｉ ｇｔｒｆ （ ｉ．ｙ ｅ．ｎ ｔ ；， ｔ ｓ ｅ ｅ ｘｔ ｓ ｔ ）ｅ ｇ ）｝ ｈ． Ｐ ｉ ｈ ＿ｐ １ ｈ ｇｔ ｒｆｎｔ ｎ ｒ ｕｎｔ ｓ ａｐ ； ｅ ｌ ｃｉ Ｏ｛ ｔｒ ｉ＿ ｐ ｘ｝ Ｕ ： ｕ ｏ ｅ ｈ． ， ｇｔｉｅｆｎｔ ｎ）ｒ ｕｎ ｅ ｔ ： ｃ ｏ （ ｅ ｒ Ｔｌ ｕ ｉ ｛ｔ
Ａｂｓｒ ｃ ：Ｍ ＶＣ ｔ ｒ ｓｕｓ ａｌ ｓ ｄ ｆ ｒｌｒ ｅ ｓ ａｅＢ／ ｐ ｌ ａ ｏ ｅ ｅｏ ｍｅ ｔ Ｉ ｓ ｐ ｌ ｓａｓｒ ｃｕ ｅ ｏ ｕｌ， ｎ ｔａ ｔ ｐａｔ ｎ ｉ ｕ ｌ ｕ ｅ ｏ ａｇ ・ｃ ｌ Ｓ ａ ｐｉ ｔ ｎｄ ｖ ｌ ｐ ｎ ． ｔ ｕ ｐｉ ｔｕ ｔ ｒ ｄｍ ｄ ｅ ａ ｄ ｅ ｙ ｃｉ ｅ
ｓ ｓｅ ’ ｅ ｉ ｎ ａ ｄ ｒ ａｉａｉ ｎ ｉ ｌ ｎ ’ ｏ ｅ ， ｎ ｔｅ ｐ ｏ ｅ ｓｏ ｅ ｌｚ ｔ ｎ ｔｆ ｌｙ ｕ ｅ ａ ａ ｃ ｉｔａ ｄ ｃ ｍ ｂ ｎ ｓ ｙ ｔｍ Ｓｄ ｓｇ ｎ ｅ ｌｚ ｔｏ ｎ ｃｉ ｔＳｂｒ ｗｓ ｒ ｉ ｒ ｃ ｓ ｆｒ ａｉａ ｏ ．Ｉ ｕ ｌ ｓ ｓＪ ｖ Ｓ ｒｐ ｎ ｏ ｉ ｅ ｅ ｈ ｉ
２ ＭＶＣ在ＡＳ ． Ｔ 台的实现 ＰＮＥ 平
应用 程序可分为三个部分：客户端、服务器端和 数据库 。客户端 负责接受用户操作并处理界面 ，服务
技术的重 要组成部分 ，因此它也从 以往 的 “ 玩具 ”语 言 一 跃 成 为 Ｂ Ｓ 架 构 中客 服 端 的 主 角 ， 而 利 用 ／
ｌ１
ＪｖＳｒ ｔ打交道 ，而 与特定 于浏览器的功能毫无关 ａ ａｃｉ ｐ
系。
ｆ ｎ ｔ ｎ ｗｉ ｉ Ｒ ｃ ｉ （ ｋＤａ ） ｕ ｃ ｏ ｋ ｉ ｅ ｅｖ ｗｉｉ ｔ ｅ ａ
— —
ｗ ｅ 服备器 ｂ
敬据 库服务 器
｛
图 １ 应用程序系统架构 该应用的独特之处在于： 客户端 Ｗｉｉ ｋ 引擎的核心 完全用 Ｊｖ Ｓｆ ｔ 写， ａａ ｃ ｐ 编 ｉ 同时借鉴了 Ｐｏｏｙ ｅ Ｓ ｒｔｔｐ 类库 ， Ｊ 以便支持面向对象 的编程风格 ，并结合 ＭＶ 模式 ， Ｃ 使之在客户端实现 。
可扩展、可维护 的系统。
快捷 的操作使得 Ｗｉ ｋ ｉ成为一种 团体协作 书写 的高效
工具 。
ＪｖＳ ｒ ｔ是一 种工 作 在 客 服 端 的 脚 本语 言 。 ａ ａｃｉ ｐ
Ｗｅ２０时代 的到来， ｊｘ技术使得客户端可 以直接连 ｂ． Ａａ
接到服务器且不用刷新整个页面 。 ＪｖＳ ｒ ｔ 而 ａ ａ ｃ ｐ 是这 门 ｉ
ｌａ： ｎｔ ｎｄ ｓ）ｔ ｓ ａｐ ＝ｄｓ； ｏｄｆ ｃ ｏ （ｅｃ｛ ｉ． ｐ ｘ ｅｃ｝ ｕ ｉ ｈ 一 ，
ｇ ｔ ｒｆ ： ｎ ｔ ｎｔｐ ） ｅＰ ｅ ｘｆ ｃｉ （ ｅ ｛ ｉ ｕ ｏ ｙ
ｒｔｒ ｉｉ ｏ ｆ ．ｅＣ ｍｐ ｎ ｎＰｅ ｘｔｐ ） ｅｕ ｎＷ ｌ ． ｎ ｇｇ ｔ ｏ ｏ ｅ ｔｒｆ （ ｅ； （Ｃ ｉ ｉ ｙ
ｗｉｈ Ｍ ＶＣ ｐ ｔ ｒ ． Ｓ ｉ ｍ ａ ｅ ａｌ ｈｅ ｐ ｌ ａｉ ｎ ｐ ｏ ｒ ｍ ｉ ｈ ｒ ｓ ｔｍ ａ ｃ ｔ ａｔ ｎ ｏ ｔ ｅ ｋｓ ｌ ｔ ａ ｐ ｃ ｔｏ ｒ ｇ ａ ｈ ｇ ｅ ｙｓｅ ｔ ．Ａｔ ｔｅ ａ ｅ ｔ ｅ ｔｒ ｄ ｃ ｓ ｈｅ ｉ ｉ ｓ ｍ ｍ ，ｉ ｅ ｕ ｅ ｔ ｈ ｉ
２１ 模 型 的设 计 与 实 现 ．
来自百度文库
， ／ 解析来 自服务器端的 Ｘ ＭＬ字符 串 ｗｋＤ ｔ， ｉ ａ 返 ｉ ａ
回一 个 ＪｖＳ ｒ ｔ 象 ｄ ｓ ａａ ｃｉ 对 ｐ ｅｃ
ｒ ｔｒ ｅ ｃ ｅｕ ｎｄ ｓ
）
Ｗ ｉ ｉ ｏ ｅ ． ｍ ａ ｅｐ ｏ ｏ ｙ ｅ＝ ｋ ． ｄ １Ｋｌ ｇ ．ｒ ｔ ｔｐ Ｍ
ｍ ａｎｅ ａ ｃ ｏ ｔ ｅ ａ ｅｏ ｓｎ ｉｉ ｅ ｅ ｐ ａｅａ ｄｉ ｃ ｅ ｓｎ ｏ ｅｒ ｕ ａ ｉ ｔ ． ｉ ｔｎ ｎ ｅｃ ｓ ｃ ｕｓ ｆｕ ｉｇ ｄ ｖｄ ｄｔｍ ｌｔ ｎ ｒ ａ ｉ ｇ ｃ ｂ ｎ ｄ ｅ ｓ ｂ ｌ ｙ ｉ Ｋｅ ｒ ｓ ｙｗｏ ｄ ：Ｍ ＶＣ ａｔｒ ； ｌ ｙｓｅ ； ｒ ｗｓ ｒ Ｊ ｖ Ｓ ｒｐ ｐ ｔ ｎ Ｗ ＫＩｓ ｔ ｍ ｂ ｏ ｅ ； ａ ａ ｃ ｉ ｔ ｅ
ｃ ｌＳ ｒ ｅ ： ｋ ｐ ｓ（ｏ ｔ ａｌ ｅ ｖ ｒ ｗｉｉ ｏ ｔ ｓ ｐ Ｘｍ１ ）
＿
迟钝 。所 以，如果需要客户端针对 自身做 出更 加重要
的决定 ，那么它就有必要知道一些业 务领 域的事情 。
ｔｉ＿ ｔ ．ｐａｅ ｈｓ ｔｌ ｒ ｌ ．ｉｅ ｅ ｃ
Ａｌ ” ， ｔ ）ｅ ｌｃ ／ｌ ” ” ＆ｇ； Ｊ ｌ ＜” ＆ｌ ”． ｐａｅＥｌ ＞ ， ｔ ）， （ ” ；ｒ （ ” ”
｛
一
ｔｌ： ｔｒｍＯ ｊｃ（ ｓ，ｔ ｅ， ） ｉｅ ｅ ｏ ｂｅｔ ｅｃ ” ｎ ” ” ｔｇＦ ｄ ｉ ”，
ｔｐ：ｅ ｒｍＯ ｊｃ ｄ ｓ，ｔ ｅ，’ ｙ ｅ ｔ ｏ ｂｅｔ ｅｃ ” ｐ ” ） ｇＦ （ ｙ …，
在传统的 Ｗｅ ｂ应用程 序中， 所有的智能处理 都位
于服务器端， 客户 端 仅 仅 是显 示 服 务 器 处 理 后 的 结果 ，
它指一种超文本实现的技术，用 以实现超 文本系统。 这种超 文本系统支持面 向社群 的协作式写作，同时也 包括一组支 持这种写作的辅助工具【。与其它超 文本 ４ 】
系统相 比，ｗｉｉ ｋ 有使用方便及 开放 的特 点，这种 方便
开发提供一个结构化的模型［，非常适合多类型用 户， ３ 】
＿
ｇ ｔ ： ｎ ｔ ｎ ｒｔｒ ｉ． ；， ｅｌ ｆ ｃｉ ０｛ｅｕｎｔ ｓ ｄｕ ｏ ｈ ｊｄ ｌ ｇ ｔ ｙ ｅｆｎ ｔ ｎ）ｒｔｒ ｉ． ｙ ｅ｝ ｅＴ ｐ ： ｃ ｏ （｛ｅｕ ｔ ｓ ｔｐ ；， ｕ ｉ ｎ ｈ ＿
＿
所 以无论 使用何种语言 ，业务模型也位 于那 里【。在 ５ 】
从这个角度上看，除了在服务器 端建立 一个模型， 我们 还需要在客户端也实现一个业务领域 的模型 。 在服务器 端，已经有很多框架来实现对象． 关系映 射（ Ｒ ，它 们能够 很方便地使得服 务器 端的对 象模 Ｏ Ｍ）
型 能够与数据库之 间双 向交互。为了在客户端为业务 领域建模 ，我们仍然可 以利用服 务器端 的 Ｏ Ｍ 框 架， Ｒ
２１ ０ １年 第 ２ Ｏ卷 第 ７期
ｈｔ：ｗ ｗ． ｓ ． ｇｃ ｔ ／ ｗ ｃ—ｏ ． ｐ／ －ａ ｒ ｎ
计 算 机 系 统 应 用
基于 Ｊ ｖＳｒ ｔ ａａ ｃｉ ｐ ＭＶＣ模式 的 Ｗｉｉｒ， ｋ。 … ， 一 Ｌ
刘 烨 辉 ，王加 阳 ，王 安莉
（ 中南大 学 信 息 科 学 与工 程 学 院 ， 长 沙 ４ ０ ８ ） １０ ３
Ａａ ｊｘ应用中，我们依然需要在服务器端建立模型，因
为 一些 资源 只能在服务器端获得（ 如数据库 资源 ） 。然
而 ，为 了使客户端具有快速 的响应 性，我们希望 客户 端浏览器 也能维护一部分业务模 型。另一方面 ，如果 客户端在处理用户交互的时候仅仅 做出非常简单 的决 定 ，我们可 以编写少量代码 来处理 ，但 是不可能充分 利用 Ａ ａ ｊｘ应用 中智能客户端 的长处， 系统仍然会 反应
ＬＩ ＹｅＨｕ ， ＡＮＧ ｉ－ ｎ ， Ａ Ｕ ・ ｉ Ｗ ＪａＹａ ｇ Ｗ Ｎ Ｇ — ｉ Ａｎ Ｌ
（ ｌ ｇ ｆ ｎｏｍａｉｎＳ ｉｎ ｅａ ｄＥｎ ｉｅｒｎ ， ｎｒｌ ｏ ｔ ｉｅｓｔ， ａ ｇ ｈ １ ０ ３ Ｃｈｎ ） Ｃｏｌ ｅｏ ｆ ｒ ｔ ｃｅ ｃ ｎ ｇｎ ｅｉ ｇ Ｃｅ ｔ ｕｈＵｎｖ ｒｉ Ｃｈ ｓ ａ４ ０ ８ ， ｉａ ｅ Ｉ ｏ ａＳ ｙ ｎ
所示：
开发的分工和应用程序 的模块化 。
① 基金 项 目： 沙市节 能专 项资金 长 收稿 时间：００１．９收到 修改稿 时 间： １—２０ ２ １．０２ ； ２ ０１－６ ０
Ｅ ｐｒ ｎｅ ｘｈｎ ｅ经 验交 流 ２ ７ ｘｅｉ ｃｓ ｃａｇ ｅ Ｅ ０
计 算 机 系 统 应 用
降低 了维 护 成本 。
关键 词：ＭＶ Ｃ模式 ；Ｗｉ 系统 ；浏览器 ：ＪｖＳ ｒ ｔ ｋ ｉ ａ ａｃｉ ｐ
Ｗ ｉｉ ｓｇ ｎ ａ ｉａ ｉｎ Ｂａ ｅ ｎＪ ｖ Ｓ ｒｐ ａ ｔｒ ｋ ｉｎ ａ ｄ Ｒｅ ｌ ｔ ｓ ｄ ｏ ａ ａ ｃ ｉ ｔ ｔｅ ｎ Ｄｅ ｚ ｏ Ｐ