模擬用戶登陸，內含驗證碼驗證和request等操做

#模擬用戶登陸，內含驗證碼驗證和jsp等操做

---

##1.案例需求： 1. 訪問帶有驗證碼的登陸頁面login.jsp 2. 用戶輸入用戶名，密碼以及驗證碼。 * 若是用戶名和密碼輸入有誤，跳轉登陸頁面，提示:用戶名或密碼錯誤 * 若是驗證碼輸入有誤，跳轉登陸頁面，提示：驗證碼錯誤 * 若是所有輸入正確，則跳轉到主頁success.jsp，顯示：用戶名,歡迎您

##2.案例分析：

##3.代碼實現

1. 登陸界面的設置：

設計思想：
1. 先寫出頁面的基本框架：一個基本的表單，其中採用el表達式來表達虛擬目錄，動態生成虛擬目錄。

<form action="${pageContext.request.contextPath}/loginServlet" method="post">
    <table>
        <tr>
            <td>用戶名</td>
            <td><input type="text" name="username"></td>
        </tr>
        <tr>
            <td>密碼</td>
            <td><input type="password" name="password"></td>
        </tr>
        <tr>
            <td>驗證碼</td>
            <td><input type="text" name="checkCode"></td>
        </tr>
        <tr>

            <td colspan="2"><img id="img" src="/day16/checkCodeServlet"></td>
        </tr>
        <tr>
            <td colspan="2"><input type="submit" value="登陸"></td>
        </tr>
    </table>


</form>


2. 用於顯示驗證碼正確和錯誤以後的定向問題：主要codes：

採用el表達式是用來顯示的，若是沒有返回值或者返回值爲空的話，若是採用request.getAttribute()的方法會產生null，可是若是採用el表達式，直接返回空字符串，不用返回null，簡化了代碼。
<div>
    ${requestScope.cc_error}  
/*這裏也能夠採用三目操做符來表示：
	<%=request.getAttribute("cc_error") == null ? "" : request.getAttribute("cc_error")%>	*/
</div>
<div>
    ${requestScope.login_error}
</div>

2. 獲取驗證碼的設置：

使用servlet來獲取驗證碼，具體過程以下： 1. 先建立一個對象，用來畫圖：

int width=100;
    int height=50;
    BufferedImage image=new BufferedImage(width,height,
                BufferedImage.TYPE_INT_RGB);
解釋：第1,2行代碼不用解釋。使用BufferdImage對象來創造一個圖像的對象，剛開始顯示一個小方框，長100px，寬50px，採用RGB來塗色
2. 進一步美化照片，先填充色來填充背景
	Graphics graphics = image.getGraphics();
    graphics.setColor(Color.PINK);//
	graphics.fillRect(0,0,width,height);
3. 到這一步，會發現下和右沒有圖上顏色，再進一步梅花：
	graphics.setColor(Color.blue);
    graphics.drawRect(0,0,width-1,height-1);
4. 定義顯示在圖片上的字符和數字的庫---》由大寫A~Z小寫的a~z和0~9組成： 
String str="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
5. 建立隨機類來生成隨機的角標
	Random ran=new Random();
	StringBuilder sb=new StringBuilder();
	for (int i = 1; i <=4 ; i++) {
            int index = ran.nextInt(str.length());
            //獲取字符
            char ch = str.charAt(index);
            sb.append(ch);
            //2.3寫驗證碼
            graphics.drawString(ch+"",width/5*i,height/2);
        }
6. 再將生成的動態驗證碼字符串交個session來保存，共客戶端訪問數據
	String checkCode_session = sb.toString();
	//存入session
    request.getSession().setAttribute("checkCode_session",checkCode_session);
7. 生產干擾線
	graphics.setColor(Color.GREEN);
    //隨機生成座標
    for (int i = 0; i < 10; i++) {
        int x1 = ran.nextInt(width);
        int x2 = ran.nextInt(width);
        int y1 = ran.nextInt(height);
        int y2 = ran.nextInt(height);
        graphics.drawLine(x1,x2,y1,y2);

    }
8. 將圖片輸出到頁面展現
    ImageIO.write(image,"jpg",response.getOutputStream());

至此，驗證碼的servlet生成；

3. 登陸servlet的設置：

TIP：這裏採用寫死的方法，簡化了開發，讀者能夠採用sql的數據庫鏈接上去動態生成用戶名和密碼。

1. 首先設置代碼的編碼格式爲utf-8；
**request.setCharacterEncoding("utf-8");**
注意是request，請求用來設置編碼。response通常是用來服務器的發送信息（用於給客戶端發送迴應）
2.採用request請求來獲取username，password和驗證碼的元素：

	String username = request.getParameter("username");
    String password = request.getParameter("password");
    String checkCode = request.getParameter("checkCode");
3. 獲取session進行驗證：
HttpSession session = request.getSession();
String checkCode_session = (String) session.getAttribute("checkCode_session");
//刪除驗證碼session中存儲的
session.removeAttribute("checkCode_session");
4. 判斷驗證碼，用戶名和密碼是否都正確，首先須要先判斷驗證碼是否正確，這樣能夠避免數據庫的消耗。（若是先驗證用戶名和密碼的話，須要去數據庫查詢，查詢完了若是驗證碼不對，也沒法登陸，因此須要先驗證驗證碼）

判斷獲取的字符串是否爲空而後和在login.jsp頁面中輸入的字符串去掉大小寫進行比較
如圖在login.jsp中定義的：

這是在CheckCodeServlet中保存在session中的驗證碼字符串

String checkCode = request.getParameter("checkCode");
表示把數據從請求中去了出來而且賦給了checkCode。

進行比較
if(checkCode_session!=null&&checkCode_session.equalsIgnoreCase(checkCode)){
        //忽略大小寫比較字符串,判斷用戶名和密碼是否一致
        //正確
        if("zhangsan".equals(username)&&"123".equals(password)){
            //登陸成功
            //存儲信息，用戶信息
                session.setAttribute("user",username);
            //重定向到success.jsp
            response.sendRedirect(request.getContextPath()+"/success.jsp");
        }else{
            //不一致，存儲提示信息到request
            request.setAttribute("login_error","用戶名或者密碼錯誤");
            //轉發到登陸頁面
            request.getRequestDispatcher("/login.jsp").forward(request,response);
        }
    }else{
        //不一致，存儲提示信息到request
        request.setAttribute("cc_error","驗證碼錯誤");
        //轉發到登陸頁面
        request.getRequestDispatcher("/login.jsp").forward(request,response);
    }

##3.界面以下： ##4.測試用例：略

codes from GitHub-----》》》》》登陸簡單案例-驗證碼

原文出處：https://www.cnblogs.com/chenyameng/p/11223139.html