在JSP项目中编写一个接口返回JSON 供JSP界面异步请求数据

首先
我们要引入json处理的依赖工具
在 pom.xml文件的 dependency 标签中加入如下代码

<dependency>
    <groupId>com.googlecode.json-simple</groupId>
    <artifactId>json-simple</artifactId>
    <version>1.1.1</version>
</dependency>

在这里插入图片描述
json-simple库 可以帮助 我们项目管理创建json数据

我们要在放WebServlet的目录 位置创建一个java类
其实也是在写一个 WebServlet
这里 我就叫 YourServlet 吧 类名是随便取的
参考代码如下

package com.example.dom;

import org.json.simple.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;
import java.io.PrintWriter;

@WebServlet("/your_url_here")
public class YourServlet extends HttpServlet {
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");
        // 创建一个JSON对象
        JSONObject json = new JSONObject();
        json.put("name", "小猫猫");
        json.put("age", 13);

        // 设置编码格式为UTF-8
        response.setCharacterEncoding("UTF-8");
        // 设置响应内容类型为application/json
        response.setContentType("application/json");

        // 将JSON对象作为响应返回给前端
        PrintWriter out = response.getWriter();
        out.print(json.toString());
        out.flush();
    }
}

这里 我们就是写了一个普通的 WebServlet 路径为 /your_url_here
然后 进来之后 会执行doGet
我们通过JSONObject创建一个json对象
然后控制返回类型
最后 out.print 返回数据 而我们返回的数据 是我们处理好的 json 后面的 点toString 表示 将他转成一个json字符串格式
方便传输数据

然后 我们在jsp的js部分编写代码如下

var xhr = new XMLHttpRequest();
xhr.open('GET', 'your_url_here', true);
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        var response = JSON.parse(xhr.responseText);
        console.log(response);
    }
};
xhr.send();

因为觉得 引jquery 太麻烦了 所以我就用了js原生的 onreadystatechange
反正都是一样的

然后 我们请求到数据 通过js中 json对象自带的 parse 将json格式的字符串转成真正的json
在这里插入图片描述
我们启动项目

我们查看控制台 console.log(response); 输出的内容没有任何问题
在这里插入图片描述
然后 我们查看网络
在这里插入图片描述
也是非常的完美

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/225553.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【java】Java程序员,你掌握了多线程吗?

摘要&#xff1a;互联网的每一个角落&#xff0c;无论是大型电商平台的秒杀活动&#xff0c;社交平台的实时消息推送&#xff0c;还是在线视频平台的流量洪峰&#xff0c;背后都离不开多线程技术的支持。在数字化转型的过程中&#xff0c;高并发、高性能是衡量系统性能的核心指…

阿里云效部署前后端

静态站点到OSS 阿里云-云效&#xff0c;阿里云企业级一站式 DevOps&#xff0c;可以免费使用&#xff08;会限制人数、流水线数量等&#xff0c;个人项目够用了&#xff09;。相关文章 CI 持续集成 - 阿里云云效 OSS 是对象存储的意思&#xff0c;一般一个项目对应一个 Bucke…

python数据分析

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 使用pandas进行数据预处理 实训1 合并年龄、平均血糖和中风患者信息数据1. 训练要点2. 需求说明3. 实现思路及步骤 实训2 删除年龄异常的数据1. 训练要点2. 需求说明3. 实现思…

对比两阶段提交,三阶段协议有哪些改进?

本文我们来讨论两阶段提交和三阶段提交协议的过程以及应用。 在分布式系统中&#xff0c;各个节点之间在物理上相互独立&#xff0c;通过网络进行沟通和协调。在关系型数据库中&#xff0c;由于存在事务机制&#xff0c;可以保证每个独立节点上的数据操作满足 ACID。但是&…

创建vue项目:vue脚手架安装、vue-cli安装,vue ui界面创建vue工程(vue2/vue3),安装vue、搭建vue项目开发环境(保姆级教程二)

今天讲解 Windows 如何利用脚手架创建 vue 工程&#xff0c;以及 vue ui 图形化界面搭建 vue 开发环境&#xff0c;这是这个系列的第二章&#xff0c;有什么问题请留言&#xff0c;请点赞收藏&#xff01;&#xff01;&#xff01; 文章目录 1、安装vue-cli脚手架2、vue ui创建…

基于ssm校园美食交流系统论文

目 录 摘 要 1 前 言 3 第1章 概述 4 1.1 研究背景 4 1.2 研究目的 4 1.3 研究内容 4 第二章 开发技术介绍 5 2.1Java技术 6 2.2 Mysql数据库 6 2.3 B/S结构 7 2.4 SSM框架 8 第三章 系统分析 9 3.1 可行性分析 9 3.1.1 技术可行性 9 3.1.2 经济可行性 10 3.1.3 操作可行性 10…

Java聊天

一对一聊天 服务端 package 一对一用户;import java.awt.BorderLayout; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.io.PrintWriter; import java.net.ServerSocket; import java.net.Socket; import java.…

判断两个不重复的list集合是否相等 只比较元素值 不比较顺序

判断两个不重复的list集合是否相等 只比较元素值 不比较顺序 文章目录 &#x1f50a;前言&#x1f4d5;代码&#x1f51a;运行结果&#x1f58a;️最后总结 &#x1f50a;前言 判断两个不重复的list集合是否相等 只比较元素值 不比较顺序 1.如果源为空 现在不为空则不相等2.如…

体育类直播介绍

体育类直播是指以体育比赛为主题的网络直播&#xff0c;包括各种类型的体育赛事&#xff0c;如足球、篮球、网球、赛车等。这种类型的直播内容通常由主播对体育赛事进行实时解说和评论&#xff0c;吸引观众的关注和互动。 在体育类直播中&#xff0c;主播通常会选择自己擅长和…

FFmpeg之将视频转为16:9(横屏)或9:16(竖屏)(三十六)

简介: CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长! 优质专栏:Audio工程师进阶系列【原创干货持续更新中……】🚀 优质专栏:多媒体系统工程师系列【原创干货持续更新中……】🚀 人生格言: 人生从来没有捷径,只…

Leetcode—714.买卖股票的最佳时机含手续费【中等】

2023每日刷题&#xff08;五十二&#xff09; Leetcode—714.买卖股票的最佳时机含手续费 动态规划算法思想 可参考我的这篇博客 递推实现代码 class Solution { public:int maxProfit(vector<int>& prices, int fee) {int n prices.size();int f[n1][2];memset…

【T+】畅捷通T+软件安装过程中停留在:正在配置产品位置或进度80%位置。

【问题描述】 畅捷通T软件在安装过程中&#xff0c; 进度条一直停留在【正在配置产品…】位置。 【解决方法】 打开【任务管理器】&#xff0c;想必这个如何打开&#xff0c;大家应该都会。 在【进程】中找到【DBConfig.exe】或者【Ufida.T.Tool.SM.DBConfig.exe】进程并结束…

Qt6 QRibbon 一键美化Qt界面

强烈推荐一个 github 项目&#xff1a; https://github.com/gnibuoz/QRibbon 作用&#xff1a; 在几乎不修改任何你自己代码的情况下&#xff0c;一键美化你的 UI 界面。 代码环境&#xff1a;使用 VS2019 编译 Qt6 GUI 程序&#xff0c;继承 QMainWindow 窗口类 一、使用方法 …

Docker的数据卷、数据卷容器,容器互联

数据卷&#xff08;容器与宿主机之间数据共享&#xff09; 数据卷是一个供容器使用的特殊目录&#xff0c;位于容器中。可将宿主机的目录挂载到数据卷上&#xff0c;对数据卷的修改操作立刻可见&#xff0c;并且更新数据不会影响镜像&#xff0c;从而实现数据在宿主机与容器之…

解锁全球潜力:IT外包解决跨国企业海外分支的IT需求

在全球化的浪潮中&#xff0c;跨国企业为了拓展业务辐射面&#xff0c;经常在世界各地设立海外分支。然而&#xff0c;这些分支机构面临着独特的挑战&#xff0c;其中包括解决复杂的IT需求。为了更高效地应对这些挑战&#xff0c;越来越多的企业正在转向IT外包&#xff0c;以便…

Vue配置代理解决跨域

Network的status中报CORS error指在前端&#xff08;Vue.js&#xff09;发起跨域请求时&#xff0c;被服务器拒绝访问的错误 在本地开发环境中&#xff0c;Vue.js 将默认从 http://localhost:8080 启动服务器。如果浏览器访问服务器时使用的 URL 不是该地址&#xff0c;就可能…

计算机网络实用工具之nbtscan

简介 nbscan是一个用于扫描IP网络的NetBIOS名称信息的程序。它向提供范围内的每个地址发送NetBIOS状态查询&#xff0c;并以人类可读的形式列出接收到的信息。对于每个响应的主机&#xff0c;它列出了IP地址、NetBIOS计算机名、登录用户名和MAC地址。 对于安全检查、网络发现…

网络安全威胁——DDoS攻击

DDoS攻击 1. 定义2. DDoS攻击类型2.1 网络层攻击2.2 传输层攻击2.3 应用层攻击 3.DDoS攻击态势特点 1. 定义 分布式拒绝服务&#xff08;DDoS&#xff09;攻击是一种常见的网络攻击形式。攻击者利用恶意程序对一个或多个目标发起攻击&#xff0c;企图通过大规模互联网流量耗尽…

超越GPT-4!谷歌发布最强多模态大模型—Gemini

12月7日凌晨&#xff0c;谷歌在官网发布了全新最强多模态大模型——Gemini。 据悉&#xff0c;Gemini有Ultra、Pro、Nano三个版本&#xff0c;可自动生成文本、代码、总结内容等&#xff0c;并能理解图片、音频和视频内容。在MMLU、DROP 、HellaSwag、GSM8K等主流评测中&#…

手把手教你新建一个winform项目(史上最全)

文章目录 前言&#xff1a;第1步、打开Microsoft Visual Studio&#xff08;简称vs&#xff09;&#xff0c;本人这里使用的是Visual Studio 2017 专业版&#xff0c;如下图&#xff1a;1.2 Visual Studio Community 2019下载1.3 Visual Studio Community 2019 安装 第2步、点击…