javaweb 快速入门之项目分析和项目案例

一、项目分析

一.项目分析
1.前端后端功能分析
前端功能：

1、用户登录
2、用户注册
3、分类显示
4、信息显示
5、分页功能（首页，下一页，上一页，尾页）
6、历史记录功能
7、评论模块
后台功能：

1、管理员登录
2、主页默认显示所有新闻+分页
3、发布新闻
4、修改新闻
5、分类模块：增删改查模块
6、评论模块：增删改查
7、普通用户管理：增删改查
8、分页功能
 

二、验证码

（1）为什么需要验证码？

            随着网络的发达，会有些人恶意注册网站，但是有了验证码之后就可以有效防止这一现象，对于网站运营商家来说，少了这些无效的注册，也更有利于管理，降低网站运营管理的难度。

         对于用户来说，当账户出现异常和高风险操作都会触发验证码，验证码发到个人手机上，很好的保护了个人信息安全。

  （2）利用javaweb技术设置验证码

       ① 第一步：定义接收验证码的容器

   

 //保存验证码
    var code = "";
    var arr = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','a','b','c','d','e','f','g','h','l','m','o','p','q','r','s','k','u','y','w','x','y','z'];

     ② 第二步 ：封装验证的生成方法，利用随机数的原理，随机出现四个数

   

 //封装验证码生成
    function setCode(){
        //清空上一次保留的验证码
        code = "";
        //通过Math.random();产生一个随机数
        for(var i = 0;i<4;i++){
            /* 取范围 乘  数组的长度个数 */
            var sj = Math.floor(Math.random()*arr.length);
            //console.log(sj)
            //console.log(arr[sj]);  //根据随机数获取数组中的元素
            code+=arr[sj];
        }
        //获取存储验证码的span标签
        $("code_val").innerHTML = code;
    }

    ③ 第三步：验证输入的验证码是否匹配

     

  //获取验证码进行匹配
        $("code").onblur = function(){
            //获取输入项中的验证码
            var inputCode = this.value;
            //获取span标签随机生成保留的验证码
            var spanCode = $("code_val").innerHTML;
            if(!inputCode){
                alert('验证码不能为空');
                return false;
            }else{//编写了验证码
                if(inputCode!=spanCode){
                    alert('验证码输入错误');
                    this.value = "";
                    //重新生成
                    return false;
                }
            }
            return true;
        };

  ④ 第四步：重置验证码

   

 /* 如果span中存储的验