1. Install mysql on Windows
Download URL: https://dev.mysql.com/downloads/mysql/
MySQL uninstall command mysqld --remove mysql
After decompression, open the cmd command window in the bin directory and do the following operations:
a. Install the mysql service and execute the command mysqld -- install, Service successfully installed appears, indicating that the installation is successful
b. Initialize mysql, execute mysqld --initialize --console, here will generate the initial random password of the root user
c. If you want to set the initial password to be empty, you can execute the command mysqld --initialize - insecure (subsequent login command mysql -u root)
d. Open the mysql service, execute the command net start mysql
e. Login verification, enter the command mysql -u root -p, the password is the random password just generated
f. Modify the password command (alter user 'root'@'localhost' identified by 'new password';), the password should be in quotation marks followed by a semicolon, then quit to log in again to verify
2. Create a web project
Create a new project, select Dynamic Web project
(1) to create a 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);
}
}
This code has a thread safety problem, and the results returned by two threads accessing at the same time are 3 (the same computer needs different browsers to be 3 at the same time)
(2) Create a Servlet that queries database data (need to introduce a database-driven jar package)
@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) Front-end requests to obtain json data from the database
Servlet code
@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);
}
}
front-end html code
<!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>
Screenshot of the page display: