1. 程式人生 > >利用過濾器(Filter)實現自動登入功能

利用過濾器(Filter)實現自動登入功能

        思路:登入成功儲存登入時Cookie以及Session,下次開啟網站通過過濾器攔截檢視Session是否存在使用者(考慮使用者沒有關閉瀏覽器的情況),如果Session中有使用者資料,放行,從Cookie中查詢使用者資料如果沒有資料,放行。

         具體思路:

                /**
		 * 判斷session中是否有使用者的資訊:
		 * * session中如果有:放行.
		 * * session中沒有:
		 *    * 從Cookie中獲取:
		 *        * Cookie中沒有:放行.
		 *        * Cookie中有:
		 *            * 獲取Cookie中存的使用者名稱和密碼到資料庫查詢.
		 *                * 沒有查詢到:放行.
		 *                * 查詢到:將使用者資訊存入到session . 放行.
		 */

程式碼實現:

    *jar包

    *sql

create database web_16;
use web_16;
create table user(
	id int primary key auto_increment,
	username varchar(20),
	password varchar(20),
	nickname varchar(20),
	type varchar(10)
);

    *工具類

c3p0jdbcUtils.java(C3P0連線池工具類)

package com.itheima.utils;

import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

import javax.sql.DataSource;

import com.mchange.v2.c3p0.ComboPooledDataSource;



/**
 * jdbc c3p0工具類
 * 
 * @author 侯青華
 *
 */
public class c3p0jdbcUtils {
	// 私有構造
	private c3p0jdbcUtils() {
	}

	// c3p0資料來源
	private static final ComboPooledDataSource DATA_SOURCE = new ComboPooledDataSource();

	/**
	 * 獲得連線
	 */
	public static Connection getConnection() {
		Connection conn = null;
		try {
			conn = DATA_SOURCE.getConnection();
		} catch (Exception e) {
			e.printStackTrace();
		}
		return conn;
	}

	public static DataSource getDataSource() {
		return DATA_SOURCE;
	}

	/**
	 * 釋放資源
	 */
	/**
	 * 釋放資源的方法
	 */
	public static void release(ResultSet rs, Statement pst, Connection conn) {
		if (rs != null) {
			try {
				rs.close();
			} catch (SQLException e) {
				e.printStackTrace();
			}
			// 垃圾回收儘快回收物件.
			rs = null;
		}
		if (pst != null) {
			try {
				pst.close();
			} catch (SQLException e) {
				e.printStackTrace();
			}
			// 垃圾回收儘快回收物件.
			pst = null;
		}
		if (conn != null) {
			try {
				conn.close();
			} catch (SQLException e) {
				e.printStackTrace();
			}
			// 垃圾回收儘快回收物件.
			conn = null;
		}
	}

	public static void release(Statement pst, Connection conn) {
		if (pst != null) {
			try {
				pst.close();
			} catch (SQLException e) {
				e.printStackTrace();
			}
			// 垃圾回收儘快回收物件.
			pst = null;
		}
		if (conn != null) {
			try {
				conn.close();
			} catch (SQLException e) {
				e.printStackTrace();
			}
			// 垃圾回收儘快回收物件.
			conn = null;
		}
	}

}
 

c3p0-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<c3p0-config>
 <!-- 預設配置 -->
  <default-config>
    <property name="driverClass">com.mysql.jdbc.Driver</property>
	<property name="jdbcUrl">jdbc:mysql:///web_16</property>
	<property name="user">root</property>
	<property name="password">root</property>
	<property name="initialPoolSize">5</property>
	<property name="maxPoolSize">20</property>
  </default-config>
</c3p0-config>

CookieUtils.java(Cookie工具類)

package com.itheima.utils;
/**
 * Cookie的工具類
 * @author 侯青華
 *
 */

import javax.servlet.http.Cookie;

public class CookieUtils {

	public static Cookie findCookie(Cookie[] cookies, String name) {
		if(cookies == null) {
			return null;
		}else {
			for (Cookie cookie : cookies) {
				if(name.equals(cookie.getName())) {
					return cookie;
				}
			}
		}
		return null;
	}
}

Userlogin.java(登入Servlet)

package com.itheima.autologin.web.servlet;

import java.io.IOException;
import java.lang.reflect.InvocationTargetException;
import java.sql.SQLException;
import java.util.Map;
import java.util.Set;

import javax.servlet.ServletException;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.beanutils.BeanUtils;

import com.itheima.autologin.domain.User;
import com.itheima.autologin.service.LoginService;

/**
 * @author 侯青華
 * @version 建立時間:2018年3月21日 下午1:34:19
 */
public class Userlogin extends HttpServlet {

	private static final long serialVersionUID = 1L;

	public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// 解決頁面輸出中文亂碼
		response.setContentType("text/html;charset=utf-8");
		// POST請求中文亂碼處理
		request.setCharacterEncoding("utf-8");
		try {
			String username = request.getParameter("username");
			String password = request.getParameter("passowrd");
			User user = new User();
			user.setUsername(username);
			user.setPassword(password);
			// 呼叫業務層處理資料
			LoginService loginService = new LoginService();
			User exitUser = loginService.login(user);
			if (exitUser == null) {
				// 登入失敗
				request.setAttribute("msg", "登入失敗");
				request.getRequestDispatcher("/login.jsp").forward(request, response); // 轉發
			} else {
				// 登入成功
				// 記住密碼
				String ss = request.getParameter("autoLogin");
				System.out.println("ss:"+ss);
				if ("true".equalsIgnoreCase(ss)) {
					Cookie cookie = new Cookie("autoLogin", exitUser.getUsername() + "#" + exitUser.getPassword());
					cookie.setPath(request.getContextPath());
					cookie.setMaxAge(60 * 60 * 24 * 7);// 一週
					response.addCookie(cookie);
				}
				// 使用session記錄使用者資訊
				request.getSession().setAttribute("exitUser", exitUser);
				response.sendRedirect(request.getContextPath() + "/index.jsp");
			}
		} catch (Exception e) {
			e.printStackTrace();
		}

	}

	public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}
}

AutoLoginFilter.java(登入過濾器)

package com.itheima.autologin.web.filter;

import java.io.IOException;
import java.sql.SQLException;

import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;

import com.itheima.autologin.domain.User;
import com.itheima.autologin.service.LoginService;
import com.itheima.utils.CookieUtils;

/**
 * Servlet Filter implementation class AutoLoginFilter
 */
public class AutoLoginFilter implements Filter {

	public void destroy() {
	}

	public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
			throws IOException, ServletException {
		/**
		 * 判斷session中是否有使用者的資訊:
		 * * session中如果有:放行.
		 * * session中沒有:
		 *    * 從Cookie中獲取:
		 *        * Cookie中沒有:放行.
		 *        * Cookie中有:
		 *            * 獲取Cookie中存的使用者名稱和密碼到資料庫查詢.
		 *                * 沒有查詢到:放行.
		 *                * 查詢到:將使用者資訊存入到session . 放行.
		 */
		// 判斷session中是否有使用者的資訊
		HttpServletRequest req = (HttpServletRequest) request; //
		User u = (User) req.getSession().getAttribute("exitUser");
		if (u != null) {
			// 有使用者資訊,放行
			chain.doFilter(req, response);
		} else {
			// Session中沒有使用者資訊,從Cookie中獲取
			Cookie[] cookies = req.getCookies();
			Cookie cookie = CookieUtils.findCookie(cookies, "autoLogin");
			// System.out.println(cookie.getValue());
			// 檢視cookie中是否有使用者資訊
			if (cookie == null) {
				chain.doFilter(req, response); // 放行
			} else {
				// 獲取cookie中使用者資訊到資料庫中進行查詢
				// 沒有查到,放行
				// 查到,將使用者資訊存入到session中,放行
				String username = cookie.getValue().split("#")[0];
				System.out.println(username);
				String password = cookie.getValue().split("#")[1];
				System.out.println(password);
				// 封裝,去資料庫查詢資料
				User user = new User();
				user.setUsername(username);
				user.setPassword(password);
				LoginService loginService = new LoginService();
				try {
					User exitU = loginService.login(user);
					if (exitU == null) {
						// 密碼跟賬戶是被串改的。
						chain.doFilter(req, response);
					} else {
						// 將使用者資訊存入session中,放行
						req.getSession().setAttribute("exitUser", exitU);
						chain.doFilter(req, response);
					}
				} catch (Exception e) {
					e.printStackTrace();
				}

			}

		}
	}

	public void init(FilterConfig fConfig) throws ServletException {
	}

}

LoginService.java

package com.itheima.autologin.service;

import java.sql.SQLException;

import com.itheima.autologin.dao.LoginDao;
import com.itheima.autologin.domain.User;

public class LoginService {

	public User login(User user) throws SQLException {
		LoginDao loginDao = new LoginDao();
		return loginDao.login(user);
	}

}

User.java(javaBean)

package com.itheima.autologin.domain;

public class User {
	private int id;
	private String username;
	private String password;
	private String nickname;
	private String type;
	public User() {
		super();
		// TODO Auto-generated constructor stub
	}
	public User(int id, String username, String password, String nickname, String type) {
		super();
		this.id = id;
		this.username = username;
		this.password = password;
		this.nickname = nickname;
		this.type = type;
	}
	public int getId() {
		return id;
	}
	public void setId(int id) {
		this.id = id;
	}
	public String getUsername() {
		return username;
	}
	public void setUsername(String username) {
		this.username = username;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	public String getNickname() {
		return nickname;
	}
	public void setNickname(String nickname) {
		this.nickname = nickname;
	}
	public String getType() {
		return type;
	}
	public void setType(String type) {
		this.type = type;
	}
	
}

LoginDao.java(登入DAO)

package com.itheima.autologin.dao;

import java.sql.SQLException;

import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanHandler;

import com.itheima.autologin.domain.User;
import com.itheima.utils.c3p0jdbcUtils;

public class LoginDao {

	public User login(User user) throws SQLException {
		QueryRunner qr = new QueryRunner(c3p0jdbcUtils.getDataSource());
		String sql = "select *from user where username=? and password=?";
		User u = qr.query(sql, new BeanHandler<>(User.class), user.getUsername(),user.getPassword());
		return u;
	}

}
後續有登入介面,拿去複製就可以。

login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!doctype html>
<html>
<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>會員登入</title>
		<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
		<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
		<script src="js/bootstrap.min.js" type="text/javascript"></script>
<!-- 引入自定義css檔案 style.css -->
<link rel="stylesheet" href="css/style.css" type="text/css"/>

<style>
  body{
   margin-top:20px;
   margin:0 auto;
 }
 .carousel-inner .item img{
	 width:100%;
	 height:300px;
 }
 .container .row div{ 
	 /* position:relative;
	 float:left; */
 }
 
font {
    color: #666;
    font-size: 22px;
    font-weight: normal;
    padding-right:17px;
}
 </style>
</head>
<body>
	
	
	
	
			<!--
            	時間:2015-12-30
            	描述:選單欄
            -->
			<div class="container-fluid">
				<div class="col-md-4">
					<img src="img/logo2.png" />
				</div>
				<div class="col-md-5">
					<img src="img/header.png" />
				</div>
				<div class="col-md-3" style="padding-top:20px">
					<ol class="list-inline">
						<li><a href="login.jsp">登入</a></li>
						<li><a href="register.htm">註冊</a></li>
						<li><a href="cart.htm">購物車</a></li>
					</ol>
				</div>
			</div>
			<!--
            	時間:2015-12-30
            	描述:導航條
            -->
			<div class="container-fluid">
				<nav class="navbar navbar-inverse">
					<div class="container-fluid">
						<!-- Brand and toggle get grouped for better mobile display -->
						<div class="navbar-header">
							<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
								<span class="sr-only">Toggle navigation</span>
								<span class="icon-bar"></span>
								<span class="icon-bar"></span>
								<span class="icon-bar"></span>
							</button>
							<a class="navbar-brand" href="#">首頁</a>
						</div>

						<!-- Collect the nav links, forms, and other content for toggling -->
						<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
							<ul class="nav navbar-nav">
								<li class="active"><a href="#">手機數碼<span class="sr-only">(current)</span></a></li>
								<li><a href="#">電腦辦公</a></li>
								<li><a href="#">電腦辦公</a></li>
								<li><a href="#">電腦辦公</a></li>
							</ul>
							<form class="navbar-form navbar-right" role="search">
								<div class="form-group">
									<input type="text" class="form-control" placeholder="Search">
								</div>
								<button type="submit" class="btn btn-default">Submit</button>
							</form>

						</div>
						<!-- /.navbar-collapse -->
					</div>
					<!-- /.container-fluid -->
				</nav>
			</div>

	
	
	
	
	
	
<div class="container"  style="width:100%;height:460px;background:#FF2C4C url('images/loginbg.jpg') no-repeat;">
<div class="row"> 
	<div class="col-md-7">
		<!--<img src="./image/login.jpg" width="500" height="330" alt="會員登入" title="會員登入">-->
	</div>
	
	<div class="col-md-5">
				<div style="width:440px;border:1px solid #E7E7E7;padding:20px 0 20px 30px;border-radius:5px;margin-top:60px;background:#fff;">
				<font>會員登入</font>USER LOGIN
				<br />
				${ msg }
				<div> </div>
<form class="form-horizontal" action="/guolvqi/Userlogin" method="post">
  
 <div class="form-group">
    <label for="username" class="col-sm-2 control-label">使用者名稱</label>
    <div class="col-sm-6">
      <input type="text" class="form-control" id="username" name="username" placeholder="請輸入使用者名稱">
    </div>
  </div>
   <div class="form-group">
    <label for="inputPassword3" class="col-sm-2 control-label">密碼</label>
    <div class="col-sm-6">
      <input type="password" class="form-control" id="inputPassword3" name="passowrd" placeholder="請輸入密碼">
    </div>
  </div>
   <div class="form-group">
        <label for="inputPassword3" class="col-sm-2 control-label">驗證碼</label>
    <div class="col-sm-3">
      <input type="text" class="form-control" id="inputPassword3" placeholder="請輸入驗證碼">
    </div>
    <div class="col-sm-3">
      <img src="./image/captcha.jhtml"/>
    </div>
    
  </div>
   <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <div class="checkbox">
        <label>
          <input type="checkbox" name="autoLogin" value="true"> 自動登入
        </label>     
        <label>
          <input type="checkbox" > 記住使用者名稱
        </label>
      </div>
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
    <input type="submit"  width="100" value="登入" name="submit" border="0"
    style="background: url('./images/login.gif') no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    height:35px;width:100px;color:white;">
    </div>
  </div>
</form>
</div>			
	</div>
</div>
</div>	

	<div style="margin-top:50px;">
			<img src="./image/footer.jpg" width="100%" height="78" alt="我們的優勢" title="我們的優勢" />
		</div>

		<div style="text-align: center;margin-top: 5px;">
			<ul class="list-inline">
				<li><a>關於我們</a></li>
				<li><a>聯絡我們</a></li>
				<li><a>招賢納士</a></li>
				<li><a>法律宣告</a></li>
				<li><a>友情連結</a></li>
				<li><a target="_blank">支付方式</a></li>
				<li><a target="_blank">配送方式</a></li>
				<li><a>服務宣告</a></li>
				<li><a>廣告宣告</a></li>
			</ul>
		</div>
		<div style="text-align: center;margin-top: 5px;margin-bottom:20px;">
			Copyright &copy; 2005-2016 傳智商城 版權所有
		</div>
</body></html>

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>WEB01</title>
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
</head>

<body>
	<div class="container-fluid">

		<!--
            	時間:2015-12-30
            	描述:選單欄
            -->
		<div class="container-fluid">
			<div class="col-md-4">
				<img src="img/logo2.png" />
			</div>
			<div class="col-md-5">
				<img src="img/header.png" />
			</div>
			<div class="col-md-3" style="padding-top: 20px">
				<ol class="list-inline">
					<c:if test="${empty exitUser }">
						<li><a href="login.jsp">登入</a></li>
						<li><a href="register.htm">註冊</a></li>
						<li><a href="cart.htm">購物車</a></li>
					</c:if>
					<c:if test="${not empty exitUser }">
						<li>您好!${exitUser.nickname }</li>
						<li><a href="cart.htm">購物車</a></li>
						<li><a href="#">退出</a></li>
					</c:if>
				</ol>
			</div>
		</div>
		<!--
            	時間:2015-12-30
            	描述:導航條
            -->
		<div class="container-fluid">
			<nav class="navbar navbar-inverse">
				<div class="container-fluid">
					<!-- Brand and toggle get grouped for better mobile display -->
					<div class="navbar-header">
						<button type="button" class="navbar-toggle collapsed"
							data-toggle="collapse"
							data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
							<span class="sr-only">Toggle navigation</span> <span
								class="icon-bar"></span> <span class="icon-bar"></span> <span
								class="icon-bar"></span>
						</button>
						<a class="navbar-brand" href="#">首頁</a>
					</div>

					<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse"
						id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav">
							<li class="active"><a href="product_list.htm">手機數碼<span
									class="sr-only">(current)</span></a></li>
							<li><a href="#">電腦辦公</a></li>
							<li><a href="#">電腦辦公</a></li>
							<li><a href="#">電腦辦公</a></li>
						</ul>
						<form class="navbar-form navbar-right" role="search">
							<div class="form-group">
								<input type="text" class="form-control" placeholder="Search">
							</div>
							<button type="submit" class="btn btn-default">Submit</button>
						</form>

					</div>
					<!-- /.navbar-collapse -->
				</div>
				<!-- /.container-fluid -->
			</nav>
		</div>

		<!--
            	作者:[email protected]
            	時間:2015-12-30
            	描述:輪播條
            -->
		<div class="container-fluid">
			<div id="carousel-example-generic" class="carousel slide"
				data-ride="carousel">
				<!-- Indicators -->
				<ol class="carousel-indicators">
					<li data-target="#carousel-example-generic" data-slide-to="0"
						class="active"></li>
					<li data-target="#carousel-example-generic" data-slide-to="1"></li>
					<li data-target="#carousel-example-generic" data-slide-to="2"></li>
				</ol>

				<!-- Wrapper for slides -->
				<div class="carousel-inner" role="listbox">
					<div class="item active">
						<img src="img/1.jpg">
						<div class="carousel-caption"></div>
					</div>
					<div class="item">
						<img src="img/2.jpg">
						<div class="carousel-caption"></div>
					</div>
					<div class="item">
						<img src="img/3.jpg">
						<div class="carousel-caption"></div>
					</div>
				</div>

				<!-- Controls -->
				<a class="left carousel-control" href="#carousel-example-generic"
					role="button" data-slide="prev"> <span
					class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
					<span class="sr-only">Previous</span>
				</a> <a class="right carousel-control" href="#carousel-example-generic"
					role="button" data-slide="next"> <span
					class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
					<span class="sr-only">Next</span>
				</a>
			</div>
		</div>
		<!--
            	作者:[email protected]
            	時間:2015-12-30
            	描述:商品顯示
            -->
		<div class="container-fluid">
			<div class="col-md-12">
				<h2>
					熱門商品  <img src="img/title2.jpg" />
				</h2>
			</div>
			<div class="col-md-2"
				style="border: 1px solid #E7E7E7; border-right: 0; padding: 0;">
				<img src="products/hao/big01.jpg" width="205" height="404"
					style="display: inline-block;" />
			</div>
			<div class="col-md-10">
				<div class="col-md-6"
					style="text-align: center; height: 200px; padding: 0px;">
					<a href="product_info.htm"> <img
						src="products/hao/middle01.jpg" width="516px" height="200px"
						style="display: inline-block;">
					</a>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small03.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small04.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2 yes-right-border"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small05.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small03.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small04.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2 yes-right-border"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small05.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>
				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small03.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small04.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small05.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>
			</div>
		</div>
		<!--
            	作者:[email protected]
            	時間:2015-12-30
            	描述:廣告部分
            -->
		<div class="container-fluid">
			<img src="products/hao/ad.jpg" width="100%" />
		</div>
		<!--
            	作者:[email protected]
            	時間:2015-12-30
            	描述:商品顯示
            -->
		<div class="container-fluid">
			<div class="col-md-12">
				<h2>
					熱門商品  <img src="img/title2.jpg" />
				</h2>
			</div>
			<div class="col-md-2"
				style="border: 1px solid #E7E7E7; border-right: 0; padding: 0;">
				<img src="products/hao/big01.jpg" width="205" height="404"
					style="display: inline-block;" />
			</div>
			<div class="col-md-10">
				<div class="col-md-6"
					style="text-align: center; height: 200px; padding: 0px;">
					<a href="product_info.htm"> <img
						src="products/hao/middle01.jpg" width="516px" height="200px"
						style="display: inline-block;">
					</a>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small03.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small04.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2 yes-right-border"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small05.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small03.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small04.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2 yes-right-border"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small05.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>
				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small03.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small04.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>

				<div class="col-md-2 yes-right-border"
					style="text-align: center; height: 200px; padding: 10px 0px;">
					<a href="product_info.htm"> <img src="products/hao/small05.jpg"
						width="130" height="130" style="display: inline-block;">
					</a>
					<p>
						<a href="product_info.html" style='color: #666'>冬瓜</a>
					</p>
					<p>
						<font color="#E4393C" style="font-size: 16px">¥299.00</font>
					</p>
				</div>
			</div>
		</div>
		<!--
            	作者:[email protected]
            	時間:2015-12-30
            	描述:頁尾部分
            -->
		<div class="container-fluid">
			<div style="margin-top: 50px;">
				<img src="img/footer.jpg" width="100%" height="78" alt="我們的優勢"
					title="我們的優勢" />
			</div>

			<div style="text-align: center; margin-top: 5px;">
				<ul class="list-inline">
					<li><a href="info.html">關於我們</a></li>
					<li><a>聯絡我們</a></li>
					<li><a>招賢納士</a></li>
					<li><a>法律宣告</a></li>
					<li><a>友情連結</a></li>
					<li><a>支付方式</a></li>
					<li><a>配送方式</a></li>
					<li><a>服務宣告</a></li>
					<li><a>廣告宣告</a></li>
				</ul>
			</div>
			<div
				style="text-align: center; margin-top: 5px; margin-bottom: 20px;">
				Copyright &copy; 2005-2016 傳智商城 版權所有</div>
		</div>
	</div>
</body>

</html>


相關推薦

利用過濾器Filter實現自動登入功能

        思路:登入成功儲存登入時Cookie以及Session,下次開啟網站通過過濾器攔截檢視Session是否存在使用者(考慮使用者沒有關閉瀏覽器的情況),如果Session中有使用者資料,放行,從Cookie中查詢使用者資料如果沒有資料,放行。         具

Android+ThinkPHP後臺實現使用者登入功能

本文主要實現了Android客戶端和伺服器間的互動,客戶端採用Android Studio開發,Web伺服器採用PhpStorm開發,資料庫使用MySQL,採用ThinkPHP框架開發,目前ThinkPHP最新的版本是ThinkPHP 5.0 RC4版本,本文中

SpringMVC的攔截器Interceptor過濾器Filter的區別與聯系

get err 實例 分享 切面 簡介 () lee XML 一 簡介 (1)過濾器: 依賴於servlet容器。在實現上基於函數回調,可以對幾乎所有請求進行過濾,但是缺點是一個過濾器實例只能在容器初始化時調用一次。使用過濾器的目的是用來做一些過濾操作,獲取我們想要獲取

過濾器Filter

日誌記錄 過濾 實例化 con 歸檔 web 應用 資源 ice filter 本文摘自servlet3.1規範 過濾器(Filter)是 Java 組件,允許運行過程中改變進入資源的請求和資源返回的響應中的有效負載和 header信息。本章描述了 Java Servle

Servlet之過濾器Filter和監聽器Listener

卸載 ons str alt 用戶 監聽 實際應用 .com except 過濾器 過濾器是一個java組件,可以攔截發送至某個servelet,jsp頁面或靜態頁面的請求,可以在響應發送到客戶之前進行攔截 工作原理: 過濾器類必須實現 Filter 接口,包含的方法如下

Hadoop生態圈-Hbase過濾器Filter

法律 ont TE HA span 生態圈 生態 聲明 font                    Hadoop生態圈-Hbase過濾器(Filter)                                     作者:尹正傑 版權聲明:原創作品,謝絕轉載!

vue--過濾器filter

​ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-

spring中過濾器filter、攔截器interceptor和切面aop的執行順序

1.程式執行的順序是先進過濾器,再進攔截器,最後進切面。注意:如果攔截器中preHandle方法返回的為false時,則無法進入切面,例子如下 @RestController @RequestMapping("/user") public class UserController {

Java三大器之過濾器Filter的工作原理和代碼演示

應用 項目 isp 抽象類 con 存在 nis window rec 一、Filter簡介   Filter也稱之為過濾器,它是Servlet技術中最激動人心的技術之一,WEB開發人員通過Filter技術,對web服務器管理的所有web資源:例如Jsp,Servlet,

攔截器Interceptor過濾器Filter的執行順序和區別

一、引言 本來想記錄一下關於使用者登陸和登陸之後的許可權管理、選單管理的問題,想到解決這個問題用到Interceptor,但想到了Interceptor,就想到了Filter,於是就想說一下它們的執行順序和區別。關於Interceptor解決許可權和選單管理的問題,在放

JavaWeb+Servlet:實現簡單登入

注:專案常見錯誤 tomcat無法啟動;報錯:Failed to start component [StandardEngine[Catalina].StandardHost[localhost]. web.xml檔案servlet配置(注意斜槓):<url-pattern>

JavaWeb十一---過濾器Filter

過濾器(Filter) 概念: 它會在一組資源的前面執行,它可請求得到資源,也可以不讓。過濾器具有攔截請求的功能 和Servlet一樣,Filter是單例併發的。 使用方法 寫一個類實現Filter介面 在web.xml上配置 <filter&g

過濾器Filter與攔截器Interceptor區別

過濾器(Filter)與攔截器(Interceptor)區別 過濾器(Filter) Servlet中的過濾器Filter是實現了javax.servlet.Filter介面的伺服器端程式,主要的用途是設定字符集、控制權限、控制轉向、做一些業務邏輯判斷等。其工作原理是,只要你在web.xml檔案配置好要攔

Java三大器之過濾器Filter的工作原理和程式碼演示

一、Filter簡介   Filter也稱之為過濾器,它是Servlet技術中最激動人心的技術之一,WEB開發人員通過Filter技術,對web伺服器管理的所有web資源:例如Jsp, Servlet, 靜態圖片檔案或靜態html檔案等進行攔截,從而實現一些特殊的功能。例如

過濾器Filter和攔截器Interceptor的區別

一、過濾器(Filter) 1.含義 它依賴於servlet容器,配置於web.xml。 Servlet中的過濾器Filter是實現了javax.servlet.Filter介面的伺服器端程式,主要的用途是設定字符集、控制權限、控制轉向、做一些業務邏輯判斷等。在實現上,基於函式回撥,它可

攔截器Interceptor過濾器Filter的區別與使用

Filter:過濾器 Interceptor:攔截器 過濾從客戶端向伺服器傳送的請求。(既可攔截Action,也可攔截靜態資源,如:html、css、js、圖片等) 攔截是客戶端對Actio

PHP 過濾器Filter

PHP 過濾器用於驗證和過濾來自非安全來源的資料,比如使用者的輸入。 什麼是 PHP 過濾器? 1)PHP 過濾器用於驗證和過濾來自非安全來源的資料。 2)驗證和過濾使用者輸入或自定義資料是任何 Web 應用程式的重要組成部分。 3)設計 PHP 的過濾器擴充套

Java過濾器Filter的工作原理和程式碼演示

一、Filter簡介   Filter也稱之為過濾器,它是Servlet技術中最激動人心的技術之一,WEB開發人員通過Filter技術,對web伺服器管理的所有web資源:例如Jsp, Servlet, 靜態圖片檔案或靜態html檔案等進行攔截,從而實現一些特殊的

過濾器Filter和攔截器Interceptor

Filter介紹 Filter可以認為是Servlet的一種“加強版”,它主要用於對使用者請求進行預處理,也可以對HttpServletResponse進行後處理,是個典型的處理鏈。Filter也可以對使用者請求生成響應,這一點與Servlet相同,但實際上很少

javaWeb(十二監聽器Listener過濾器Filter

Listener 1、Listener定義 : 監聽器內部實現其實就是介面回撥. 就像老闆寫介面方法,然後員工寫實現類,父類介面指向子類物件,多型的一種體現 2、Listener分類 : 總共有8個 劃分成三種類型 【監聽三個作用域建立和銷燬】 需要在web.