Extjs4的MVC登录实现(整合struts2)(三)

本文转载自:http://www.javake.com.cn/frontend/js/20130922/6785.html作者:eric

貌似有点小bug，有时登录成功后不能自动跳转到首页，需要刷新一下，把struts.xml配置中配置为<result type="redirect">就没问题了，希望有高手能告诉哪写的不对，暂时只能用这种方式解决了

完整代码参考：http://www.luchg.com/resource/showResource_5.html

如果发现代码有什么问题欢迎提出

这次主要是实现了登录功能以及登录验证，到此后台管理系统的框架已经搭建差不多了，剩下的工作就是对数据的操作了

有不清楚的可以结合前几篇文章，这篇是对前面几个功能的整合：

登录功能：http://blog.csdn.net/lc448986375/article/details/8025305

自定义拦截器进行登录验证：http://blog.csdn.net/lc448986375/article/details/8027432

后台管理系统之二：http://blog.csdn.net/lc448986375/article/details/8019731

首先，在后台管理系统之二的版本上加了登录功能,可以参考考http://blog.csdn.net/lc448986375/article/details/8025305,需要修改的是登录成功后页面的跳转：

buttons:[{    
              text:'登录',    
              width:80,    
              height:30,    
              handler:function(){    
                  //获取当前的表单form    
                  var form = this.up('form').getForm();    
                  //判断否通过了表单验证，如果不能空的为空则不能提交    
                  if(form.isValid()){    
                  //alert("可以提交");    
                  form.submit({    
                            clientValidation:true,    
                            waitMsg:'请稍候',    
                            waitTitle:'正在验证登录',    
                            url:'user_login',    
                            success:function(form1,action){    
                               //登录成功后的操作，跳转到toIndex.action    
                               window.location.href = 'toIndex'     
                            },    
                            failure:function(form,action){    
                                Ext.MessageBox.show({    
                                width:150,    
                                title:"登录失败",    
                                buttons: Ext.MessageBox.OK,    
                                msg:action.result.msg    
                              })    
                            }    
                                                                
                   })    
                 }    
               }    
             },{    
                  text:'取消',    
                  width:80,    
                  height:30,    
                  handler:function(){    
                           //点击取消，关闭登录窗口    
                           var form = this.up('form');    
                           form.close();    
                         }    
                      }]

 其他的并没有改变，登录成功后跳转到LoginAction.java的toIndex.action：

package action;    
    
import java.io.ByteArrayInputStream;    
import java.util.Map;    
import model.Admin;    

import org.apache.struts2.interceptor.SessionAware;    
    
import com.opensymphony.xwork2.ActionSupport;    
        
public class LoginAction extends ActionSupport implements SessionAware {    
    //接收name,必须与js中的textfield的name相同，否则取不到值    
    private String name;    
    private String password;    
    //得到页面传来的验证码    
    private String CheckCode;    
    private Map session;    
        
    //用于告诉前台时候登录成功    
    private boolean success;    
        
    public String login(){    
        //得到生成的验证码    
        String strCode = (String) session.get("randomCode");    
System.out.println("UserAction>randomCode:"+strCode);    
        if("admin".equals(name) && "admin".equals(password) && CheckCode.toLowerCase().equals(strCode.toLowerCase())){    
            //做个小例子，没有连接数据库    
            session.put("nowUser", new Admin(1,"admin","admin",1));    
            success = true;    
        }else{    
            success = false;    
        }    
        return SUCCESS;    
    }    
        
    public String toIndex() {    
        return SUCCESS;    
    }    

 配置文件struts.xml:

<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"    
"http://struts.apache.org/dtds/struts-2.0.dtd">    
<struts>    
    
    <package name="admin" namespace="/" extends="json-default">    
        
        <interceptors>    
            <interceptor name="loginInterceptor" class="interceptor.LoginInterceptor"></interceptor>    
        </interceptors>    
            
        <global-results>    
            <result name="toLogin">/login.html</result>    
        </global-results>    
            
        <action name="user_login" class="action.LoginAction" method="login">    
            <result type="json" />    
        </action>    
        <action name="toIndex" class="action.LoginAction" method="toIndex">    
            <interceptor-ref name="loginInterceptor"></interceptor-ref>    
            <result>/index.html</result>    
        </action>    
                
        <action name="getCode" class="action.YanZhengMaAction" method="getCode">    
            <result type="stream">    
                <param name="contentType">image/jpeg</param>    
                <param name="inputName">bais</param>    
                <param name="bufferSize">2048</param>    
            </result>    
        </action>    
    </package>    
    
    <package name="json" extends="json-default">    
        <interceptors>    
            <interceptor name="loginInterceptor" class="interceptor.LoginInterceptor"></interceptor>    
        </interceptors>    
        <global-results>    
            <result name="toLogin">/login.html</result>    
        </global-results>    
            
        <action name="users" class="action.UserAction" method="users">    
            <interceptor-ref name="loginInterceptor"></interceptor-ref>    
            <result type="json" />    
        </action>    
    </package>    
</struts>   

跳转到：index.html中,然后就是后台管理之二：http://blog.csdn.net/lc448986375/article/details/8019731的内容了

接下来需要对用户登录进行验证,虽然后台管理只有一个页面，但是可以在地址栏中直接输入请求进行操作，所以我们需要对每个用户的请求进行验证，所以在每个action中都要配置自定义的拦截器，我不知道有没有更好的方式，如果有知道的希望能交流一下。

 

为了防止用户直接进入index.html页面，我把这个页面放入了WEB-INF下面，如果有更好的方法也希望能提出建议，学习一下

 

下面是登录页面效果图：