Servlet获取对象

Servlet获取对象



前言

使用Servlet将后端数据传回前端显示


一、Servlet获取一个对象

1.创建getOne.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
    <title>用AJAX的方式获取提交的数据</title>
    <script type="text/javascript" src="jquery-3.5.1.min.js"></script>
</head>
<body>
<input type="button" value="获取对象" id="sender">
<div id="messageDiv"></div>
<script>
    //解析后端传过来的数据并显示在id为messageDiv的div中
    $('#sender').click(function () {
        var url = "getOneServlet";
        $.post(
            url,
            function (data) {
                var json = JSON.parse(data);
                var name = json.person.name;
                var id = json.person.id;
                $("#messageDiv").html("名字:" + name + "<br>账号:" + id);
            });
    });
</script>
</body>
</html>

2.创建GetOneServlet

import net.sf.json.JSONObject;

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(name = "GetOneServlet")
//Servlet获取一个对象
public class GetOneServlet extends HttpServlet {
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        Person person = new Person();
        person.setName("张三");
        person.setId(12345);
        JSONObject json = new JSONObject();
        json.put("person",JSONObject.fromObject(person));
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().print(json);//将json数据以流的形式输出到前端
    }
}

3.配置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>SubmitServlet</servlet-name>
        <servlet-class>SubmitServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>SubmitServlet</servlet-name>
        <url-pattern>/submitServlet</url-pattern>
    </servlet-mapping>


    <servlet>
        <servlet-name>GetOneServlet</servlet-name>
        <servlet-class>GetOneServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetOneServlet</servlet-name>
        <url-pattern>/getOneServlet</url-pattern>
    </servlet-mapping>
<web-app>

二、Servlet获取多个对象

1.创建getMany.html

代码如下(示例):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
    <title>用AJAX以JSON的形式获取数据</title>
    <script type="text/javascript" src="jquery-3.5.1.min.js"></script>
</head>
<body>
<input type="button" value="获取多个对象" id="sender">
<div id="messageDiv"></div>
<!--post通过url获取后端传回的数据,然后通过parseJSON解析传回的json数据并显示在页面上-->
<script>
    $('#sender').click(function (){
        var url="getManyServlet";
        $.post(
            url,
            function (data){
                var persons = $.parseJSON(data);
                for(i in persons){
                    var old = $("#messageDiv").html();
                    var person = persons[i];
                    $("#messageDiv").html(old+"<br>"+person.name+":"+person.id);
                }
            });
    });
</script>
</body>
</html>

2.创建GetManyServlet

代码如下(示例):

import net.sf.json.JSONSerializer;

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

@WebServlet(name = "GetManyServlet")
//创建多个对象,通过JSONSerializer的toSON将list集合序列化为JSON并传给前端
public class GetManyServlet extends HttpServlet {
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        List<Person> list = new ArrayList<Person>();
        for (int i = 0; i < 10; i++) {
            Person person = new Person();
            person.setName("name" + i);
            person.setId(1234 + i);
            list.add(person);
        }
        //JSONSerializer:提供将对象或值类型序列化为 JSON 以及将 JSON 反序列化为对象或值类型的功能。
        String result = JSONSerializer.toJSON(list).toString();
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().print(result);
    }
}

3.配置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>SubmitServlet</servlet-name>
        <servlet-class>SubmitServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>SubmitServlet</servlet-name>
        <url-pattern>/submitServlet</url-pattern>
    </servlet-mapping>


    <servlet>
        <servlet-name>GetOneServlet</servlet-name>
        <servlet-class>GetOneServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetOneServlet</servlet-name>
        <url-pattern>/getOneServlet</url-pattern>
    </servlet-mapping>

    <servlet>
        <servlet-name>GetManyServlet</servlet-name>
        <servlet-class>GetManyServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>GetManyServlet</servlet-name>
        <url-pattern>/getManyServlet</url-pattern>
    </servlet-mapping>
</web-app>

总结

Servlet创建一个对象:访问http://localhost:8080/SubmitServlet/getOne.html,通过url访问GetOneServlet,然后将后端的数据以json流的形式输出到前端,前端通过post解析后端传过来的json数据并显示

Servlet创建多个对象:访问http://localhost:8080/SubmitServlet/getMany.html通过url访问GetManyServlet,GetManyServlet中使用JSONSerializer将提供的list对象序列化为JSON提交至前端,前端通过遍历解析的persons对象将后端数据全部显示

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值