许愿墙ajax流程图,AJAX许愿墙设计文档.doc

AJAX许愿墙网站设计文档

第一部分 项目概况

1.项目说明

项目名称：AJAX许愿墙网站

客 户：

2、项目背景

第二部分 项目计划

1.? 项目目标

(1)允许新用户注册，同时开设帐户。

3. 项目策略

通过可视化编程的JAVA程序和SQL数据库的方式进行实现。

通过增量开发的方法进行此项目的设计与开发。

使用套节字进行客户与服务端的通讯。

4．项目开发周期

第一周需求分析及软件的初步设计(绘制初步的建模图)第二周决定每个功能所需的类及数据类型并根据相应功能设计出各类所用到的方法及数据类型第三周具体实现各个类中的各个方法，设计服务页面并对服务器连接进行测试

5. 每项任务所需技能

服务器与客户端的连接：熟悉http网络传输协议，熟悉各种封装的方法和数据流.

程序界面设计：可视化编程及GUI组建

代码的实现：javascript，jsp，数据库编程

6. 所采用的工具

开发工具：IntelliJIDEA Mysql javasdk(jdk1.6)

开发环境：个人电脑+windowsxp

第三部分 项目设计

1.需求分析

在这个信息时代，人与人的沟通变得更加重要，所以涌现出各种聊天软件，本软件时间了人与人的另一种沟通。每人中都有一个愿望，我们希望通过本软件来记录用户心中美好的愿望。

2.软件主要功能

(1)允许新用户注册，同时开设帐户。

客户端

Java.sql.*连接数据库所有组件Org.json.simple.jsonobjectJson对象包Org.json.simple.jsonarrayJson数组包细节与构造

注册表单验证

1问题陈述：

编写一个客户端将用户的注册信息发送个服务器

a.选择创建该程序所需要引用的类和方法

b.确定用户自定义的包、类、它们的目的及方法

c.确定用户定义类中的数据类型和变量

d．确定提交到服务器上的数据

e.确定何时提交数据

f.确定要处理的例外

g.确定例外的出错信息

二自动登录系统技术要点

1 在用户将焦点移出文本框调用自动登录函数

用户输入用户名和密码后，会触发onblur时间。此时系统自动调用login函数执行自动登录过程，传出一个true或false的阐述，表示是否是自动登录。此时用户未表示要进行登录，当身份验证失败后，如果用户进行的是自动登录，将不做任何提示。如果用户是单击【登录】按钮明确登录时，将提示详细的失败信息。

2在session中设置登录状态

用户身份验证成功后，将会在session中保存用户key，使用固定字符串“-LOGIN-USER-”。当用户单击【检查登录状态】按钮时，也判断session中是否存在以“-LOGIN-USER-”为key的Attribute。存在表示已有用户登录，不存在则表示用户未登录。

3退出请求处理

用户登录后，页面将显示【退出】按钮。用户单击【退出】按钮后，调用logout函数向服务器发送退出请求，服务器将session中保存的用户信息删除。客户端接受到服务器响应将恢复显示登录窗口。

自动登录系统的设计流程图

三许愿墙系统的技术要点

1随机显示位置的实现方法

使用javascript中的随机函数生成两个整数，分别对愿望div的左边距和顶边距。使用JavaScript中math对象的random()方法可产生一个0~1之间的随机数，在最小值minVal和最大值maxVal之间生成随机数

\\通过获取随机数的函数

Function getRanNum(minVal,maxVal){

Return Math.round(Math.random()*(maxVal~minVal))+minVal;

}

Var xMin = 10; \\X坐标最小值

Var xmax = 300; \\X坐标最大值

Var yMin = 100; \\Y坐标最小值

Var ymax = 300; \\Y坐标最大值

\\获取随机横坐标

Function getRanX(){

Return getRanNum(xMin,xMax);

}

\\获取随机纵坐标

function getRanY(){

Return getRanNum(yMin,yMax);

}

2使用jQuery实现淡入效果

jQuery库中的fadeIn()函数可以使页面元素时间淡入效果。调用fadeIn()函数时传入一个参数值，设定整个淡入过程所需的毫秒数。

3使用Internetface组件库的Draggable组件实现拖拽

4使用jQuery的遍历功能实现选色列表背景赋值

5使用jQuery库的Ajax操作向服务器发送请求

本系统与服务器的通信主要有两处，第