1：Servlet

一. Servlet简介

Java Servlet 是运行在 Web 服务器或应用服务器上的程序，它是作为来自 Web 浏览器或其他 HTTP 客户端的请求和 HTTP 服务器上的数据库或应用程序之间的中间层。使用 Servlet，您可以收集来自网页表单的用户输入，呈现来自数据库或者其他源的记录，还可以动态创建网页。

二. 使用Servlet获取请求参数

1. 首先新建一个Java类，继承HttpServlet，并重写service方法来处理浏览器端的请求：

package io.zhangjia.servlet;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;

public class Servlet extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String name = req.getParameter("name");
        PrintWriter writer = resp.getWriter();
        writer.println("<h1>" + name + "</h1>");
        writer.close();
    }
}

2. 接下来配置web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <servlet>
        <servlet-name>servlet</servlet-name>
        <servlet-class>io.zhangjia.servlet.Servlet</servlet-class>
    </servlet>

    <servlet-mapping>
        <servlet-name>servlet</servlet-name>
        <url-pattern>/zhangjia</url-pattern>
    </servlet-mapping>
</web-app>

web.xml中的各个标签意义如下：

servlet-name：Servlet的名字，一般就是Servlet的类名首字母小写
servlet-class：Servlet的全类名
urL-pattern：Servlet的请求路径

现在访问http://localhost:8888/st/zhangjia?name=zhangjia，页面将会把zhangjia以h1的样式输出。

3. 除了采用上面的web.xml进行配置外，我们还可以使用注解来更加快速的配置Servlet，直接在Servlet类上面添加@WebServlet(“/xx”)即可。

@WebServlet("/zhangjia")
public class Servlet extends HttpServlet {
   ........
}

三. 使用Servlet转发

我们可以使用Servlet来获取所有的Bikes数据，并转发到index.jsp。（之所以用转发，是会因为request的作用域在连续的服务器端跳转中有效）

package io.zhangjia.servlet;

import io.zhangjia.bike.dao.BikeDao;
import io.zhangjia.bike.dao.impl.BikeDaoImpl;
import io.zhangjia.bike.entity.Bike;

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;
import java.util.List;

@WebServlet("/zhangjia")
public class Servlet extends HttpServlet {
    private BikeDao bikeDao =  new BikeDaoImpl();
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        List<Bike> bikes = bikeDao.queryAll();
        req.setAttribute("bikes",bikes);
        req.getRequestDispatcher("/admin/index.jsp").forward(req,resp);
    }
}

接下来在index.jsp，获取转发过来的Bikes数据即可：

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
<!DOCTYPE html>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <style>
        .popover {
            max-width: 800px !important;
        }
    </style>

</head>
<body>

<h1>单车列表</h1>

<a href="updateAndAdd.jsp" class="btn btn-primary mb-2"> 添加单车</a>
<table class="table">
    <tr>
        <th>ID</th>
        <th>类型</th>
        <th>价格</th>
        <th>位置</th>
        <th>状态</th>
        <th>次数</th>
        <th>二维码</th>
        <th>操作</th>
    </tr>

    <%
        List<Bike> bikes = (List<Bike>)request.getAttribute("bikes");

        for (Bike bike : bikes) {
            pageContext.setAttribute("bike",bike);
    %>
    <tr>
        <td>${pageScope.bike.id}
        </td>
        <td>${pageScope.bike.type}
        </td>
        <td>￥${pageScope.bike.price}
        </td>
        <td>${pageScope.bike.locationName}
        </td>
        <td>${pageScope.bike.status}
        </td>
        <td>${pageScope.bike.amount}
        </td>
        <td>
            
            <img  src="../${pageScope.bike.qr}" width="50" height="50"
                  data-container="body" data-toggle="popover" data-placement="top"
                  data-content=" <img src='../${pageScope.bike.qr}'/>"

        </td>
        <td>
            <a href="updateAndAdd.jsp?id=${pageScope.bike.id}" class="btn btn-success"> 修改</a>
            <a href="del.jsp?id=${pageScope.bike.id}" class="btn btn-danger"> 删除</a>

        </td>
    </tr>

    <%
        }
    %>
 
</table>
</body>
</html>

接下来，访问http://localhost:8888/st/zhangjia即可查看Bikes的所有数据，注意这里不要直接访问index.jsp，会引发空指针异常。