【斗医】【13】Web应用开发20天

在上文中完成用户注册/登录后显示用户名的功能，同时也谈了谈系统编码问题，本文重点聊聊“下战书”功能，里面涉及第三方在线HTML编辑器的问题。

一、Navicat for MySQL介绍

   由于4月8日微软正式放弃对Windows XP操作系统的支持，借此机会把斗医系统移到了Windows8操作系统上。由于Windows8与Windows XP的操作系统存在较大的差异，拿系统的开始菜单来讲：

   Windows XP进入MySQL命令行窗口的入口为：开始 > 所有程序 > MySQL > MySQL Server 5.5 > MySQL 5.5 Command Line Client

   Windows8我摸索出三种进入办法：

   （1）从搜索进入：把鼠标移到屏幕的右上角，选择“搜索”，在打开的“应用”中查找“MySQL 5.5 Command Line Client”，如下图所示：

   （2）使用“微软键 + R”，输入“cmd”打开命令行窗口，进入MySQL的bin路径，在窗口中输入mysql -u用户名 -p密码打开，如下图：

  （3）使用第三方Navicat for mysql工具

1、下载Navicat for Mysql

  进入http://www.navicat.com.cn/download/navicat-for-mysql用户根据自己的操作系统选择相应的试用版本。安装过程很简单，一路选择“下一步”即可。

2、试用版转正

   进入http://www.kuaipan.cn/file/id_46516780738283773.htm?f=www.yunvn.com下载补丁，下载后把PatchNavicat.exe复制到Navicat for Mysql的安装目录下，然后双击PatchNavicat.exe运行，在弹出的框中选择navicat.exe，如下图所示：

3、在Navicat for Mysql中连接MySQL数据库

（1）在开始中打开Navicat for Mysql

（2）在工具栏中选择“连接 > MySQL”

（3）按下图配置数据库连接

（4）配置完毕后选择“medical > medical > usertable”，即可查看数据表记录

---

【备注】：从工具中可以看到用户的密码，这里是一种错误的设计，因为不安全。之所以前面没有处理，是为后续的安全保留的彩蛋

---

二、下战书功能

当游客进入一个景点时往往会在一个地方刻上XXX到此一游，这正符合了人的表现欲；从管理角度上讲若游客把自己的***号码也刻上，更有利于景点管理方确认当事人。对于一个网站也是如此，为了防止某些人破坏网站的纯洁性、正确性要求鉴别信息发表者的身份，如维基百科的编辑功能。斗医系统也是要求下战书的人先登录。

   古代战场上下战书，一般都是派一个机灵的人手持书信，到对方营地送到指定的人手中，对方明确给出不战或应战的信息后，送信人返回自己的营地。所以这里的就有三要素：战书的标题、战书的内容和挑战人。按此思路我们的下战书页面大致如下：

1、下战书之前先登录

打开war\WEB-INF\config\sm\system-action.xml文件，定义跳转业务配置，如下：

true">

2、处理必须登录业务

打开com.medical.frame.FrameDispatcher.java文件，抽象出getBusiness()方法

/** * 由业务名称获取业务对象 */ public FrameBusiness getBusiness(String busName, HttpServletRequest request)    throws FrameException {    // 由动作名称获取业务对象    FrameBusiness business = FrameCache.getInstance().getBusiness(busName);    if (business == null)    {         throw new FrameException(FrameErrorCode.REQUEST_BUS_NOT_EXIST);    }    // 判断是否必须登录    boolean isMustLogin = business.isMustLogin();    if (isMustLogin == false)    {        return business;    }    // 若必须登录且用户已登录,则直接返回业务对象    HttpSession session = request.getSession();    UserDAO userDao = FrameCache.getInstance().getUserBySession(session);    if (userDao != null)    {        return business;    }    else    {        FrameCache.getInstance().setPreActName(busName);    }    // 若必须登录且用户未登录,则返回登录业务对象    return FrameCache.getInstance().getBusiness(FrameConstant.LOGIN_BUS_NAME); }

3、修改com.medical.frame.FrameDispatcher.process()方法，调用上面的方法完成动作名称获取业务对象

// 由名称获取业务对象 FrameBusiness business = FrameCache.getInstance().getBusiness(busName); FrameBusiness business = getBusiness(busName, request);

4、修改com.medical.server.data.UserLoginDataAction.execute()方法

// 4. 登录之前的前一个动作名称 String preActName = FrameCache.getInstance().getPreActName(); if (FrameUtil.isEmpty(preActName)) {    preActName = "index.act?timestamp=" + System.currentTimeMillis(); } else {    preActName += ".act?timestamp=" + System.currentTimeMillis(); } // 5. 判断是注册还是登录 String isRegistUser = getParameter("isRegist"); if ("TRUE".equalsIgnoreCase(isRegistUser)) {    return doRegistAction(userName, userAuth, preActName); } else {    return doLoginAction(userName, userAuth, preActName); }

5、创建challenge.html文件

（1）在war\module\challenge下创建challenge.html文件

（2）在challenge.html文件的元素中引入如下元素：

（3）在challenge.html文件的元素中定义页面结构，如下：

abcdefg

在Eclipse中启动Tomcat后，在浏览器中输入http://localhost:8080/medical，点击“下战书”菜单，打开的页面如下：

仔细的您一定会发现“下战书”菜单背景颜色没有被选中，另外用户名是“登录”，这方面不用户体验极差。

6、选择菜单后菜单设置相关颜色值

（1）在war\js\common\common.js的generateSystemMenu()中对“下战书”菜单项绑定ID

systemMenu += ' 下战书 ';

（2）修改war\js\common\common.js的selectSystemMenu()方法，对其增加“下战书”ID

var menuArray = new Array("system_challenge_menu", "system_home_menu", "system_expert_menu", "system_login_menu");

（3）在war\js\challenge下创建challenge.js文件，并在文档加载完毕后调用selectSystemMenu()方法，如下：

(function( window){    $(document).ready(function(){        // 生成系统菜单        generateSystemMenu();        // 选择下战书系统菜单        selectSystemMenu("system_challenge_menu");    }); })( window );

在Eclipse中启动Tomcat后，在浏览器中输入http://localhost:8080/medical，点击“下战书”菜单，打开的页面如下：

7、用户登录之后进入下战书页面，右上角显示用户名称

修改war\js\challenge\challenge.js文件，在文档加载完毕后调用common.js的getBreifUserInfo()方法，如下：

(function( window){    $(document).ready(function(){        // 生成系统菜单        generateSystemMenu();        // 选择下战书系统菜单        selectSystemMenu("system_challenge_menu");        // 获取用户简要信息        getBreifUserInfo();    }); })( window );

在Eclipse中启动Tomcat后，在浏览器中输入http://localhost:8080/medical，点击“下战书”菜单，打开的页面如下：

8、下战书页面开发

（1）完善war\module\challenge\challenge.html文件，内容如下：

                                                                                     

                                     已超出字