1.Windows安装mysql
下载网址:https://dev.mysql.com/downloads/mysql/
MySQL卸载指令 mysqld --remove mysql
解压后在bin目录下打开cmd命令窗口作如下操作:
a.安装mysql服务,执行命令 mysqld --install ,出现Service successfully installed 表示安装成功
b.初始化mysql, 执行 mysqld --initialize --console,这里会产生root用户的初始随机密码
c.若想设置初始密码为空,可执行命令 mysqld --initialize -insecure(后续登录命令mysql -u root)
d.开启mysql服务,执行指令 net start mysql
e.登录验证,输入命令 mysql -u root -p,密码是刚才产生的随机密码
f.修改密码指令 (alter user 'root'@'localhost' identified by '新密码';),密码要用引号且后面带分号,然后quit重新登录验证
2.创建web项目
新建项目,选择 Dynamic Web project
(1)创建一个Servlet
@WebServlet("/HelloServlet")
public class HelloServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
int i = 1;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
i++;
try{
Thread.sleep(1000*4);
}catch(Exception e){
e.printStackTrace();
}
response.getWriter().write(i+"");
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
该代码存在线程安全问题,两个线程同时访问返回结果都是3(同一电脑需要不同浏览器才能同时为3)
(2)创建一个查询数据库数据的Servlet(需要引入数据库驱动的jar包)
@WebServlet("/jdbcServlet")
public class JdbcServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
response.setCharacterEncoding("UTF-8");
try{
Class.forName("com.mysql.cj.jdbc.Driver");
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/yrrdb", "root", "123456");
PreparedStatement pre = conn.prepareStatement("select * from usertest where id = ?");
pre.setString(1, "1");
ResultSet res = pre.executeQuery();
while(res.next()){
response.getWriter().write("姓名:" + res.getString("name") + ",age:" + res.getInt("age"));
}
}catch(Exception e){
e.printStackTrace();
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
(3)前端请求获取来源于数据库的json数据
Servlet代码
@WebServlet("/jsonServlet")
public class JsonServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json;charset=UTF-8");
response.setCharacterEncoding("UTF-8");
try{
Class.forName("com.mysql.cj.jdbc.Driver");
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/yrrdb", "root", "123456");
PreparedStatement pre = conn.prepareStatement("select * from usertest where id = ?");
pre.setString(1, "1");
ResultSet res = pre.executeQuery();
while(res.next()){
response.getWriter().write("姓名:" + res.getString("name") + ",age:" + res.getInt("age"));
}
}catch(Exception e){
e.printStackTrace();
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
前端html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function func(){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange=function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
alert(xhr.responseText)//获取服务器返回数据
}else{
alert("请求失败!")
}
}
}
xhr.open("GET","/myfirstweb/jsonServlet");
//xhr.setRequsetHeader("header","value");
/*xhr.send(content) content可省略,post请求时则此内容为请求体*/
xhr.send();
}
</script>
</head>
<body>
<h1 onclick="func()">Hello tomcat!</h1>
</body>
</html>
页面展示截图: