IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 网络协议 -> 后台通过GSON格式数据传入前端以及前端的接收 -> 正文阅读

[网络协议]后台通过GSON格式数据传入前端以及前端的接收

业务缘由:json数据的特点(主要):快,小,所有语言都支持

实例场景:后台传给前端需要的数据→前端接受并使用数据

pom

        <dependency>
            <groupId>com.google.code.gson</groupId>
            <artifactId>gson</artifactId>
            <version>2.8.5</version>
        </dependency>

json 是Google的产品所以别导错了

jsp(前端的处理)

<%--
  Created by IntelliJ IDEA.
  User: TianXinKun
  Date: 2021/9/10
  Time: 10:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>GsonTest</title>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css">
    <script type="text/javascript">
        function dian(){
            var httpRequest = new XMLHttpRequest();
            httpRequest.open("post","/json.do",true);
            httpRequest.onload=function ()
            {
                var data = JSON.parse(httpRequest.responseText);
                console.log(data)
                document.getElementById("name").value=data.name;
                document.getElementById("password").value=data.pssword;
                document.getElementById("sex").value=data.sex;
                document.getElementById("age").value=data.age;
                document.getElementById("aihao").value=data.aihao;
            }
            httpRequest.send()
        }
    </script>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-12 text-center">姓名:
            <input name="name" id="name" type="text"><br>
            密码:
            <input name="name" id="password" type="text"><br>
            性别:
            <input name="name" id="sex" type="text"><br>
            年龄:
            <input name="name" id="age" type="text"><br>
            爱好:
            <input name="name" id="aihao" type="text"><br>
            <button class="btn btn-info" type="button" onclick="dian()">获取</button></div>
    </div>
</div>
</body>
</html>

controller

    @RequestMapping(value = "/json.do",method = RequestMethod.POST)
    public void jsonTest(Writer out){
        GsonUser user = new GsonUser();
        user.setName("txk");
        user.setPssword("123");
        user.setAge("18");
        user.setSex("nan");
        user.setAihao("wu");
        Gson gson = new Gson();
        String s = gson.toJson(user);
        try {
            out.write(s);
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

gson.toJson支持java所有的基本类型数据,可放心食用!
最终效果
在这里插入图片描述
ok!

  网络协议 最新文章
使用Easyswoole 搭建简单的Websoket服务
常见的数据通信方式有哪些?
Openssl 1024bit RSA算法---公私钥获取和处
HTTPS协议的密钥交换流程
《小白WEB安全入门》03. 漏洞篇
HttpRunner4.x 安装与使用
2021-07-04
手写RPC学习笔记
K8S高可用版本部署
mySQL计算IP地址范围
上一篇文章      下一篇文章      查看所有文章
加:2021-09-11 19:10:26  更:2021-09-11 19:12:02 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年12日历 -2024/12/29 11:04:29-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码
数据统计