震惊!图文并茂——Java后端如何响应不同格式的数据给前端(带源码)

简介: 文章介绍了Java后端如何使用Spring Boot框架响应不同格式的数据给前端,包括返回静态页面、数据、HTML代码片段、JSON对象、设置状态码和响应的Header。

注:以下我写的所有方法都在我的一个类中,类已经添加好@Controller注解

1、返回静态页面

现在前后端分离,基本不再由后端来返回前端的静态页面,但此处还是分享一下用法,以防万一

如果想要返回静态页面,对应的类和方法就不能再用 @RestController@ResponseBody 这两个注解了,后者表示不再返回静态页面,而是返回数据,前者功能包含后者

需使用@Controller注解(已在类中使用):

    @RequestMapping("/index")
    public String returnIndex(){
        return "/index.html";
    }

index.html是我早已定义好,且放在static目录下的静态页面

你若也想返回静态页面,在static目录下也需要提前放好对应的静态页面

2、返回数据

    @ResponseBody
    @RequestMapping("/returnData")
    public String returnData(){
        return "返回视图需要的数据";
    }

返回数据需使用@ResponseBody注解

该注解可以修饰类,也可以修饰方法

  • 修饰类的时候,表示这个类下的所有方法,返回的均为数据
  • 修饰方法时,表示该方法返回的是数据

如果一个类中的所有方法返回的是数据,我们就把这个注解加在类上

3、返回html代码片段

    @ResponseBody
    @RequestMapping("/returnHtml")
    public String returnHtml(){
        return "<h1>返回HTML代码片段</h1>";
    }

直接在return处编写Html代码即可

4、返回JSON(即主要是对象和Map)

返回JSON是目前最常用的返回数据的格式,对象等数据格式通过注解会自动转换为JSON

    @ResponseBody
    @RequestMapping("/returnJson")
    public Person returnJson(){
        Person person = new Person();
        person.setId(1);
        person.setName("zhangsan");
        person.setAge(7);
        return person;
    }

    @ResponseBody
    @RequestMapping("/returnMap")
    public Map<String,String> returnMap(){
        Map<String,String> kv = new HashMap<>();
        kv.put("k1","v1");
        kv.put("k2","v2");
        kv.put("k3","v3");
        return kv;
    }

返回数据的格式是String还是对象,是通过content-type决定的(可以手动指定)

  • 当我们的接口返回的是String时,content-type是text/html
  • 当我们的接口返回的是对象/Map时,content-type自动设置为application/json

手动指定:

设置@RequestMapping的produces参数,来手动指定返回的数据格式

@RequestMapping(value = "/example", produces = "application/json")

5、设置状态码

状态码不影响页面的展示

    // 不常用,目前状态码通常还是用servlet设置的
    @ResponseBody
    @RequestMapping("/setStatus")
    public String setStatus(HttpServletResponse response){
        response.setStatus(401);//通常表示没有登录
        return "设置状态码";
    }

不常用,目前状态码通常还是用servlet设置的

6、设置响应的Header

    @ResponseBody
    @RequestMapping(value = "/r1",produces = "application/json;charset=utf-8")
//    @RequestMapping(value = "/r1")
    public String r1(HttpServletResponse response){
        //设置header
        response.setHeader("myhead","myhead");
        return "{'OK':1}";
    }

Header是HTTP的请求头

Header的详细介绍及获取方式

目录
相关文章
|
6月前
|
存储 前端开发 安全
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
300 5
|
6月前
|
存储 小程序 Java
热门小程序源码合集:微信抖音小程序源码支持PHP/Java/uni-app完整项目实践指南
小程序已成为企业获客与开发者创业的重要载体。本文详解PHP、Java、uni-app三大技术栈在电商、工具、服务类小程序中的源码应用,提供从开发到部署的全流程指南,并分享选型避坑与商业化落地策略,助力开发者高效构建稳定可扩展项目。
|
8月前
|
小程序 安全 关系型数据库
专业打造一款圈子源码软件系统 / 后端 PHP 搭建部署一样实现利益化
本教程详解基于PHP后端与Uni-app的小程序开发全流程,涵盖技术选型、环境搭建、源码导入、接口对接及功能实现。采用Laravel/Symfony框架,结合MySQL/PostgreSQL数据库,使用WebSocket实现实时通信,并集成IM SDK实现音视频聊天。前端使用Uni-app开发,支持跨平台运行。教程包含完整部署流程与安全优化方案,助力快速搭建高性能、安全稳定的小程序系统。
517 5
|
10月前
|
存储 消息中间件 前端开发
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
校园圈子系统校园论坛小程序采用uni-app前端框架,支持多端运行,结合PHP后端(如ThinkPHP/Laravel),实现用户认证、社交关系管理、动态发布与实时聊天功能。前端通过组件化开发和uni.request与后端交互,后端提供RESTful API处理业务逻辑并存储数据于MySQL。同时引入Redis缓存热点数据,RabbitMQ处理异步任务,优化系统性能。核心功能包括JWT身份验证、好友系统、WebSocket实时聊天及活动管理,确保高效稳定的用户体验。
569 4
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
|
10月前
|
JavaScript Java 关系型数据库
家政系统源码,java版本
这是一款基于SpringBoot后端框架、MySQL数据库及Uniapp移动端开发的家政预约上门服务系统。
333 6
家政系统源码,java版本
|
9月前
|
存储 安全 Java
Java 集合面试题从数据结构到 HashMap 源码剖析详解及长尾考点梳理
本文深入解析Java集合框架,涵盖基础概念、常见集合类型及HashMap的底层数据结构与源码实现。从Collection、Map到Iterator接口,逐一剖析其特性与应用场景。重点解读HashMap在JDK1.7与1.8中的数据结构演变,包括数组+链表+红黑树优化,以及put方法和扩容机制的实现细节。结合订单管理与用户权限管理等实际案例,展示集合框架的应用价值,助你全面掌握相关知识,轻松应对面试与开发需求。
447 3
|
9月前
|
人工智能 监控 前端开发
AI工具:前端与后端的终极对决?谁将成为新时代的宠儿?
深入探讨AI工具对前端和后端开发的具体影响、各自的机遇与挑战,并分析未来开发者如何驾驭AI,实现能力跃迁。
595 0
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
1387 14
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
665 0
|
SpringCloudAlibaba JavaScript 前端开发
谷粒商城笔记+踩坑(2)——分布式组件、前端基础,nacos+feign+gateway+ES6+vue脚手架
分布式组件、nacos注册配置中心、openfegin远程调用、网关gateway、ES6脚本语言规范、vue、elementUI
谷粒商城笔记+踩坑(2)——分布式组件、前端基础,nacos+feign+gateway+ES6+vue脚手架