需求
- 提供一个Html页面, 页面中有一个个省份下拉列表
- 当页面加载完成后, 发送ajax请求, 加载所有省份
分析
准备数据库
CREATE DATABASE day13;-- 创建数据库
USE day13;
CREATE TABLE province ( -- 创建表
id INT PRIMARY KEY AUTO_INCREMENT,
NAME VARCHAR(20) NOT NULL
);
-- 插入数据
INSERT INTO province VALUE (NULL, '广州');
INSERT INTO province VALUE (NULL, '深圳');
INSERT INTO province VALUE (NULL, '佛山');
INSERT INTO province VALUE (NULL, '东莞');
需要用到到的jar包
链接:https://pan.baidu.com/s/1kGNSZ1oMpFhkfOf8cFQUAg
提取码:1234
导Jquery的包
配置文件
配置文件放在src目录下
druid.properties配置文件
driverClassName=com.mysql.jdbc.Driver
url=jdbc:mysql:///day23
username=root
password=root
initialSize=5
maxActive=10
maxWait=3000
如果是8.0版本的数据库,改用一下的druid.properties
username=root
password=qq124519
driverClassName=com.mysql.cj.jdbc.Driver
url=jdbc:mysql://localhost:3306/day23?useSSL=false&serverTimezone=UTC&characterEncoding=UTF-8&useUnicode=yes
initialSize=10
maxActive=50
maxWait=3000
jedis.properties配置文件
host=127.0.0.1
port=6379
maxTotal=50
maxIdle=10
代码编写
Province类
package domain;
public class Province {
private int id;
private String name;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
工具类
JDBC工具类
package util;
import com.alibaba.druid.pool.DruidDataSourceFactory;
import javax.sql.DataSource;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.SQLException;
import java.util.Properties;
/**
* JDBC工具类 使用Durid连接池
*/
public class JDBCUtils {
private static DataSource ds ;
static {
try {
//1.加载配置文件
Properties pro = new Properties();
//使用ClassLoader加载配置文件,获取字节输入流
InputStream is = JDBCUtils.class.getClassLoader().getResourceAsStream("druid.properties");
pro.load(is);
//2.初始化连接池对象
ds = DruidDataSourceFactory.createDataSource(pro);
} catch (IOException e) {
e.printStackTrace();
} catch (Exception e) {
e.printStackTrace();
}
}
/**
* 获取连接池对象
*/
public static DataSource getDataSource(){
return ds;
}
/**
* 获取连接Connection对象
*/
public static Connection getConnection() throws SQLException {
return ds.getConnection();
}
}
JedisPoolUtils 工具类
package util;
import redis.clients.jedis.Jedis;
import redis.clients.jedis.JedisPool;
import redis.clients.jedis.JedisPoolConfig;
import java.io.IOException;
import java.io.InputStream;
import java.util.Properties;
public class JedisPoolUtils {
private static JedisPool jedisPool;
static {
//读取配置文件
InputStream is = JedisPoolUtils.class.getClassLoader().getResourceAsStream("jedis.properties");
//创建properties对象
Properties pro =new Properties();
//关联文件
try {
pro.load(is);
} catch (IOException e) {
e.printStackTrace();
}
//获取数据,设置到JedisPoolConfig中
JedisPoolConfig config=new JedisPoolConfig();
config.setMaxTotal(Integer.parseInt(pro.getProperty("maxTotal")));
config.setMaxIdle(Integer.parseInt(pro.getProperty("maxIdle")));
//初始化JedisPool
jedisPool=new JedisPool(config,pro.getProperty("host"),Integer.parseInt(pro.getProperty("port")));
}
/**
* 获取链接的方法
*/
public static Jedis getJedis(){
return jedisPool.getResource();
}
}
dao数据库层
ProvinceDao 接口
package dao;
import domain.Province;
import java.util.List;
public interface ProvinceDao {
public List<Province> findAll();
}
ProvinceDaoImpl 实现类
package dao;
import domain.Province;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;
import util.JDBCUtils;
import java.util.List;
public class ProvinceDaoImpl implements ProvinceDao {
//1.声明成员变量 jdbctemplement
private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());
@Override
public List<Province> findAll() {
//1.定义sql
String sql = "select * from province ";
//2.执行sql
List<Province> list = template.query(sql, new BeanPropertyRowMapper<Province>(Province.class));
return list;
}
}
Service服务器层
ProvinceService接口
package service;
import domain.Province;
import java.util.List;
public interface ProvinceService {
public List<Province> findAll();
public String findAllJson();
}
ProvinceServiceImpl 实现类, 实现ProvinceService接口
package service;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import dao.ProvinceDao;
import dao.ProvinceDaoImpl;
import domain.Province;
import redis.clients.jedis.Jedis;
import util.JedisPoolUtils;
import java.util.List;
public class ProvinceServiceImpl implements ProvinceService {
//声明dao
private ProvinceDao dao = new ProvinceDaoImpl();
@Override
public List<Province> findAll() {
return dao.findAll();
}
/**
使用redis缓存
*/
@Override
public String findAllJson() {
//1.先从redis中查询数据
//1.1获取redis客户端连接
Jedis jedis = JedisPoolUtils.getJedis();
String province_json = jedis.get("province");
//2判断 province_json 数据是否为null
if(province_json == null || province_json.length() == 0){
//redis中没有数据
System.out.println("redis中没数据,查询数据库...");
//2.1从数据中查询
List<Province> ps = dao.findAll();
//2.2将list序列化为json
ObjectMapper mapper = new ObjectMapper();
try {
province_json = mapper.writeValueAsString(ps);
} catch (JsonProcessingException e) {
e.printStackTrace();
}
//2.3 将json数据存入redis
jedis.set("province",province_json);
//归还连接
jedis.close();
}else{
System.out.println("redis中有数据,查询缓存...");
}
return province_json;
}
}
Servlet层
package servlet;
import service.ProvinceService;
import service.ProvinceServiceImpl;
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 java.io.IOException;
@WebServlet("/provinceServlet")
public class ProvinceServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
/* //1.调用service查询
ProvinceService service = new ProvinceServiceImpl();
List<Province> list = service.findAll();
//2.序列化list为json
ObjectMapper mapper = new ObjectMapper();
String json = mapper.writeValueAsString(list);*/
//1.调用service查询
ProvinceService service = new ProvinceServiceImpl();
String json = service.findAllJson();
System.out.println(json);
//3.响应结果
response.setContentType("application/json;charset=utf-8");
response.getWriter().write(json);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
}
前端html页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="js/jquery-3.3.1.js"></script>
<script>
$(function () {
//发送ajax请求, 加载所有城市的数据
$.get("provinceServlet",{},function (data) {
//获取select
var province = $("#province");
//遍历json数组
$(data).each(function () {
//创建<option>
var option ="<option name='"+this.id+"'>"+this.name+"</option>";
//调用select的append的方法追加option
province.append(option);
});
});
});
</script>
<select id="province">
<option>---请选择城市---</option>
</select>
</body>
</html>