最近做项目需要用到管理员身份和普通用户身份登录，在这里记录一下我的实现过程
项目需求：
1.实现用户输入账号、密码、选择身份，并点击登录按钮后进行登录
2.当用户这三项有一项未填写，提示用户填写，并刷新该页面，不显示服务器报错信息，即不提交表单，并提示用户“未填写xxx”
3.当恶意用户想要通过伪造错误请求从而查看服务器报错信息从而推断字段时，返回“恶意请求”
实践：
1.写form表单，在from表单中填入input输入框进行输入，效果和代码如下：
<form action="/loginVf" method="post" onsubmit="return check()">
<div style=" text-align:center">
<div style="color: white ;font-size:25px;">
<span></span>
<input type="text" name="username" placeholder="请输入登录账号" maxlength="24"/>
</div>
<div style="color: white ;font-size:25px;">
<input type="password" name="password" placeholder="请输入密码" maxlength="20">
</div>
<div style="color: white ;font-size:25px;">
<input type="text" name="captcha" placeholder="请输入验证码" maxlength="4">
</div>
<div style="color: white;text-align: center;">
请选择登录身份<input type="radio" name="danxuan" onclick="setvalue1()"/>用户 <input type="radio" name="danxuan" onclick="setvalue2()"/>管理员
</div>
</div>
<div class="tip" style="color: white ;font-size:25px;text-align:center">
<a href="#" style="font-size: 18px">忘记密码？</a>
<a href="register.jsp" style="font-size: 18px">没有账号？点击注册！</a>
</div>
<div style="text-align:center; width:100%;height:100%;margin:0px;">
<input type="submit" value="登录">
</div>
</form>核心就是四个input，用from表单将四个input包含。
注意：1.action提交的位置为后端，需要改成自己后端的处理前端数据的名字，该部分知识在此不做讲解。
2.style字段为格式字段，可以根据自己需要自己写。
3.设置单选按钮选择身份，两个input的type属性都必须为“radio”,且name属性必须相同。
4.form的提交方法一般选用get或post，get效率更高但post更加安全。
5.onsubmit为form表单将要提交时自动调用的jsp代码段，当该函数返回值为false时，不提交表单。
2.写check函数，实现当未获取值时不提交。
函数如下
<script type="text/javascript">
function check(){
if(document.getElementsByName("username")[0].value==""){
alert("请输入用户名")
return false;
}
if(document.getElementsByName("password")[0].value==""){
alert("请输入密码")
return false;
}
if(document.getElementsByName("danxuan")[0].value=="on"&&document.getElementsByName("danxuan")[1].value=="on"){
alert("请选择身份")
return false;
}
return true;
}
function setvalue1(){
document.getElementsByName("danxuan")[0].value = "commonuser";
}
function setvalue2(){
document.getElementsByName("danxuan")[1].value = "administor";
}
</script>第一个函数就是form的判断函数，在这里注意document.getElementsByName和document.getElementsByID的区别，他们两个一个是通过id获取值，一个是通过name属性获取值，其中id属性因为是唯一的，所以可以直接获取，但name属性可以在多个标签上，所以其返回的是一个数组，根据出现的先后标记0，1，2，3....，在我的代码里，因为我的单选按钮肯定是同一个name属性的，所以他们的document.getElementsByName分别是[0]和[1]。
另外再说一个比较坑的点，单选按钮当不指定value时，其默认值为字符串on而不是空值或者是null，所以这里判断用户有没有选择身份用到的判断是是否为on。当用户点击按钮时会调用点击事件setvalue1或setvalue2给按钮赋值。
3.后端判断是否为恶意攻击
上述代码基本就实现了保证用户不完全填完就不会提交，但万一有用户恶意攻击绕过前端判断呢？比如在url中伪造，或者通过抓包伪造post请求等等，可能会出现服务器报错等情况，所以可以在后端再加判断，双重保险。
String username = request.getParameter("username");
String password = request.getParameter("password");
String shenfen = request.getParameter("danxuan");
if(username==null||password==null||shenfen==null){
request.getRequestDispatcher("/login.jsp").forward(request,response);
}前三行为接受信息，后面为判断接受的信息是否为空，为空就说明用户在非法提交信息。
