[JavaScript知识库]JavaWeb通过ajax进行前后端交互

需求

页面加载完成需要想后端请求数据来初始化化界面内容。前端通过jquery封装的ajax请求后端servlet文件，后端返回数据。由于后端获取的数据为list类型，前端js是识别不了的，需要转换为json格式的数据，我这里使用的gson来转换。

实现

导入gson依赖（maven）

<!-- https://mvnrepository.com/artifact/com.google.code.gson/gson -->
<dependency>
    <groupId>com.google.code.gson</groupId>
    <artifactId>gson</artifactId>
    <version>2.8.9</version>
</dependency>

使用gson转换list

        List<New> list = newService.getNew();//获取的数据list
//        给前端list 使用gson将list转为前端可以识别的json格式
        Gson gson =  new Gson();
        String json = gson.toJson(list);
        PrintWriter out = resp.getWriter();
        out.print(json);

前端请求并接收list

 $.get("index",function(res) {
                console.log(res)//输出结果
            },
            "json"
        );

前端控制台查看

可以看到接收到了后端传过来的数组，然后通过js就可以放到前端页面上了。