CSU前端网站 +登陆系统_csu8000

实现要求

1）前端页面的基本布局

1. 布局类似于学校门户
2. 顶部需有 LOGO 栏目；
3. 提供轮播图；
4. 提供账号密码登录方式；
5. 提供手机号码（邮箱）+ 动态验证码登录方式；
6. 登录成功后跳到类似CSU主页，并显示登陆用户；
7. *提供忘记密码和修改密码功能；
8. *提供用户的增删改查。(未实现)

2）完成前后端数据交互

3）数据操作要求：

1. 数据统一存储在后端数据库中；
2. 账号密码登录方式需进行验证，验证通过方能登录；
3. 手机（邮箱）验证码需调用第三方短信接口发送验证码并进行验证；
4. 后端实现技术不限、数据库系统不限。

短信验证码实现：臻子云

传送门

注册登录成功，在财务管理进行充值后，就可以根据开发文档使用API发送短信了

通过臻子云SDK开发文档就可以轻松利用API发送短信验证码啦

项目中导入臻子云官网下载的jar包后就可以使用相应的API进行短信验证码的发送（这里以Java开发为例）

1. 下载jar包

2. 导入jar包（IDEA为例）
   
   在WEB-INF下新建文件夹lib统一存放项目中需要的依赖包，选中lib文件夹右键将其导入到项目中
   

3. 编写函数发送短信
   使用注册成功后申请的appId、appSecret初始化ZhenziSmsClient

   apiUrl为请求地址，个人开发者使用https://sms_developer.zhenzikj.com，企业开发者使用https://sms.zhenzikj.com

   在平台中编写短信模板后，就可以调用函数发送短信验证码了
   
   请求参数说明
   

关键功能解析

1.首页图片轮播与鼠标移动暂停轮播
    通过设置计时器改变图片的显示状态实现图片轮播，同时更新相关联的按钮状态，设置监听onmousemove和onmouseout,实现鼠标移到图片时，销毁计时事件，当移走鼠标时重新创建计时事件。


2.首页导航栏的动态效果与“回到顶部”的动态显示与隐藏
    通过函数检测滚动条滚动距离，当其距页面顶部距离等于banner模块到网页顶部距离时，通过函数更改header的className来实现不同类名下的header的高度height属性的更改，更改导航栏第一行菜单项display属性进行隐藏，再通过改变类名实现大logo与小logo的切换。
通过函数检测滚动条滚动距离，当其距页面顶部距离大于等于中南要闻模块到网页顶部距离时，显示“回到顶部”按钮，否则隐藏。

3.获取验证码后倒计时功能
    通过编写Js函数创建计时器，更改传入dom对象的内容实现发送验证码时的倒计时效果，同时设置button属性为不可点击，保证倒计时结束前用户无法频繁再次请求发送短信验证码。

4.使用ajax异步请求短信动态码
请求动态码时，点击“发送动态码”触发onclick事件，同时判断手机号、学号等需要输入信息不能为空时，才允许发送验证码，通过函数serializeObject()函数获取输入框内容封装成Json字符串通过ajax异步传输给相应的Servlet，在Servlet中判断验证码是否正确，验证码正确时调用函数sendDynamicCode()实现发送短信动态码。

5.用户“修改密码”与“忘记密码”操作
用户忘记密码或修改密码时，首先需要输入学号、手机号，同时要求输入验证码与动态码，防止反复提交表单，通过学号(工号)、手机号验证是否存在该用户，若存在则可成功进行更改密码，否则失败返回登录界面。



6.用户从登录界面登录成功后跳转到首页并显示对应用户名称
用户登录成功时，将用户User对象存入对话Session中，页面跳转后读取Session中内容，若不为空则显示相应用户名

7.实现用户注销功能
用户点击注销时，对应Servlet注销Session中的登录信息，并重定向到登录界面。

8.通过Java的反射简化Servlet中doPost()方法判断请求参数调用不同函数而导致的大量if判断语句
父类BaseServlet中doPost()中获取前端传来的action参数的数据，再通过Class类的getDeclareMethod()获取Servlet中对应action方法的Method对象，再通过invoke()调用子类UserServlet中的业务方法完成登录注册等功能，实现根据前端action参数的不同而调用UserServlet中不同功能函数的目的。

运行结果

百度网盘分享
https://pan.baidu.com/s/11SImV3NAyCwXEI7vBK2GeA
提取码：kln8