大致描述:
1.在后台设置一个固定的用户名和密码,获取前台传过来的用户名,进行判断,成功则可以继续输入密码,否则,给出提示
2.正确的话在登录成功的页面显示用户名和密码。否则,返回登录页面,前给出用户名或密码错误的提示。
效果图:
主要代码:
登录页面login.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>登录页面</title>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
</head>
<body>
<form action="checkLogin" method="post">
姓名:<input type="text" name="name" id="name"/>
<span id="nameError" class="error">${requestScope.Message}</span><br />
密码:<input type="text" name="pwd" id="pwd"/><br />
<input type="submit" value="登录" id="btn"/>
</form>
<script type="text/javascript">
$(function() {
//失去焦点事件
$("#name").blur(function() {
//获取用户名
var name = $("#name").val();
//判断用户名为空
if (name == null || name == "") {
$("#nameError").html("请输入用户名 !");
} else {
$.ajax({
type:"post",
url : "checkName", //配置的action名
data:{name:name}, //name值
dataType : "json", //json类型
success : function(data) { //回调函数
if (data == 1) {
//name1.equals("xxs")
$("#nameError").html("用户名存在").css("color","green");
}else if(data == 2){
$("#nameError").html("用户名不存在").css("color","red");
}
}
});
}
});
});
</script>
</body>
</html>
信息显示页面index.jsp:
用户名:${param.name }<br />
密码:${param.pwd }
LoginAction.java:
package cn.xxs.action;
import java.io.IOException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
import net.sf.json.JSONArray;
/**
*
* @author xxs
*
*/
public class LoginAction extends ActionSupport{
/**
*
*/
private static final long serialVersionUID = 1L;
private String name;
private String pwd;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getpPwd() {
return pwd;
}
public void setPwd(String pwd) {
this.pwd = pwd;
}
private int result;
public int getResult() {
return result;
}
public void setResult(int result) {
this.result = result;
}
//获取request
HttpServletRequest request = ServletActionContext.getRequest();
//获取用户名
String name1 = request.getParameter("name");
//获取密码
String pwd1 = request.getParameter("pwd");
public String checkName(){
if (name1.equals("xxs")) {
//用户名存在
result = 1;
} else {
//用户名不存在
result = 2;
}
return SUCCESS;
}
public String checkLogin(){
if (name1.equals("xxs") && pwd1.equals("123")) {
//登陆成功
return SUCCESS;
} else {
//登陆失败
request.setAttribute("Message", "用户名或密码错误");
return ERROR;
}
}
}
web.xml:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
<welcome-file-list>
<welcome-file>login.jsp</welcome-file>
</welcome-file-list>
<filter>
<filter-name>struts2</filter-name>
<filter-class>
org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter
</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
</web-app>
struts.xml:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="default" extends="struts-default,json-default">
<action name="checkName"
class="cn.xxs.action.LoginAction"
method="checkName">
<result name="success" type="json">
<param name="root">result</param>
</result>
</action>
<action name="checkLogin"
class="cn.xxs.action.LoginAction"
method="checkLogin">
<result name="success">
/index.jsp
</result>
<result name="error">
/login.jsp
</result>
</action>
</package>
</struts>