概述
数据库连接池
Ajax简介
JavaScript实现Ajax
jQuery实现Ajax
一:数据库连接池
数据库连接是一种关键的有限的昂贵的资源,对数据库连接的管理能显著影响到整个应用程序的性能。数据库连接池正是针对这个问题提出来的。
常见的数据库连接池有哪些: C3p0、DBCP、 Tomcat Jdbc Pool、 Druid
1. 数据库连接池的原理:
连接池基本的思想是在系统初始化的时候,将数据库连接作为对象存储在数据库连接池中,当用户需要访问数据库时,并非建立一个新的连接,而是从连接池中取出一个已建立的空闲连接对象。使用完毕后,用户也并非将连接关闭,而是将连接放回连接池中,以供下一个请求访问使用。而连接的建立、断开都由连接池自身来管理。
2. C3P0连接池的使用:
a. 导入相关jar包
b. 在项目src目录下新建一个名叫 c3p0-config.xml,并配置连接池的相关信息
c. 在代码中使用ComboPooledDataSource对象的getConnection()方法获取数据库连接对象
二:Ajax简介
Ajax : Asynchronous JavaScript and XML(异步JavaScript 和 XML)
通过Ajax技术可以通过与后台服务器进行少量的数据交换,从而实现网页的异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行局部刷新。
三:JavaScript实现Ajax
1.获取Ajax对象
var xhr=null;
if(window.XMLHttpRequest){ //判断是否为空,如果有此对象,则实例化一个XMLHttpRequest对象
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject("Micorsoft.XMLHttp");
}
2. 使用Ajax对象调用open("请求方式","请求路径","是否为异步") //"请求方式"为 "get"/"post" ; "是否为异步"默认为“true”
3. 绑定状态改变事件
xhr.onreadystatechange=function(){
if(xhr.readyState==4){ //判断交互是否完毕
if(xhr.status==200){ // 判断交互是否成功
// 交互成功时执行的代码
}
}
};
4. 发送请求 : xhr.send(参数);
注意:若为post提交,则必须设置请求头消息:
setRequestHeader("content-type","application/x-www-form-urlencoded");
(采用application/x-www-form-urlencoded的POST数据和url中传参只是形式不同,本质都是传递参数。)
eg:
DBUtil.java
package util;
import java.sql.*;
import com.mchange.v2.c3p0.ComboPooledDataSource;
public class DBUtil {
private static ComboPooledDataSource ds;
static{
ds=new ComboPooledDataSource();
}
// 检查是否存在此注册名
public static boolean checkRegisterName(String regName){
boolean flag=false;
Connection conn=null;
PreparedStatement ps=null;
ResultSet rs=null;
try {
conn=ds.getConnection();
String sql="select * from user where username=?";
ps=conn.prepareStatement(sql);
ps.setString(1,regName);
rs=ps.executeQuery();
if(rs.next()){
flag=true; // 如果已经存在此用户名,则改变flag为true
}
} catch (SQLException e) {
e.printStackTrace();
}finally{
try {
rs.close();
ps.close();
conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
return flag;
}
}
CheckNameServlet.java
package servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import util.DBUtil;
@WebServlet(name="CheckNameServlet",urlPatterns={"/checkServlet"})
public class CheckNameServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
doPost(req,resp);
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
resp.setHeader("content-type","application/x-www-form-urlencoded");
resp.setCharacterEncoding("utf-8");
PrintWriter pw=resp.getWriter();
String regName=req.getParameter("registerName");
System.out.println("后台接收到的注册名为:"+regName);
boolean flag=DBUtil.checkRegisterName(regName);
if(flag){
pw.println("sorry,该用户名已被注册,请选择其他注册名!");
}else{
pw.println("恭喜,可以使用该注册名~~~");
}
pw.flush();
pw.close();
}
}
register.jsp
%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>注册用户</title>
<script type="text/javascript">
function getXHR(){
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject("Microsoft.XMLHttp");
}
return xhr;
}
function checkUser(obj){
var regName=obj.value; // 获取填写的注册用户名
var xhr=getXHR(); // 获取Ajax对象
xhr.open("get","/AjaxProject/checkServlet?registerName="+regName,true);
// 绑定onreadystatechange事件
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
var txt=xhr.responseText; // 获取后台传来的响应文本
document.getElementById("msg").innerHTML=txt;
}
}
};
xhr.send(null); // 发送请求
}
</script>
</head>
<body>
<form action="${pageContext.servletContext.contextPath}/registerServlet" method="post">
注册用户名:<input type="text" name="regName" οnblur="checkUser(this)"/> <span id="msg" style="color:red"></span> <br/><br/>
注册密码:<input type="password" name="regPwd"/> <br/><br/>
<input type="submit" value="注册"/>
</form>
</body>
</html>
四:jQuery实现Ajax
1.使用一个HTTP GET请求从服务器加载数据 : $.get( url [, data ] [, success ] )
2.使用一个HTTP POST 请求从服务器加载数据 : $.post( url [, data ] [, success ] )
3.执行一个异步的HTTP(Ajax)的请求 : $.ajax( [settings ] )
<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>注册用户</title>
<script type="text/javascript" src="../js/jquery-3.1.1.js"></script>
<script type="text/javascript">
$(function(){
$("#registername").blur(function(){
$.get("/AjaxProject/checkServlet",{"registerName":$("#registername").val()},
function(data){
$("#msg").html(data);
});
});
});
</script>
</head>
<body>
<form action="${pageContext.servletContext.contextPath}/registerServlet" method="post">
注册用户名:<input type="text" id="registername" name="regName"/> <span id="msg" style="color:red"></span> <br/><br/>
注册密码:<input type="password" name="regPwd"/> <br/><br/>
<input type="submit" value="注册"/>
</form>
</body>
</html>