springboot-前后端分离——第一篇

本篇主要对前后端分离的一些基础知识进行总结,主要对HTTP请求协议、HTTP响应格式、Http协议解析等进行总结。重点在于简单了解前端如何向服务端发送请求,服务端如何接收请求并返回响应结果。

一、简单案例:

首先创建一个springboot项目(注意创建项目时要勾选web依赖),整体结构如下:

在HelloController类中编写如下代码,来接收请求,@RestController注解以及@RequestMapping后续会详细讲解。下面代码中有简单的注释:

package com.webs.controller;

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

//请求处理类:加上下面restcontroller注解之后才是一个请求处理类;
@RestController
public class HelloController {
    @RequestMapping("/hello")//这里添加上之后才知道处理的是哪一个请求,这里请求的是/hello,浏览器请求这个之后就会调用下面的代码;
    public String hello(){
        System.out.println("hello world");
        return "hello world!";
    }

}

其中SpringbootWebStudyApplication.java这个类是启动类,运行启动类之后会显示如下结果:可以看到下面端口号8080,然后在网页中输入对应的ip地址以及端口号,就可以请求这个/hello,执行请求处理类的方法,然后得到请求结果.

然后在浏览器中输入以下地址,可得到响应结果:

整个流程就是首先客户端发送请求/hello,然后服务端接收这个请求并return “hello world”返回给前端结果,这样前端页面就会得到hello world!

完成这个简单案例肯定会有很多疑问,前端与服务端之间如何进行数据解析的,HTTP请求数据格式是什么以及HTTP响应格式是什么...下面开始对前后端之间的联系进行简单介绍:

二、HTTP协议:

HTTP协议:

概念:

超文本传输协议,规定了浏览器和服务器之间的数据传输规则。

特点:

  • 基于TCP协议:面向连接,安全。
  • 基于请求-响应模型:一次请求对应一次响应
  • HTTP协议是无状态的协议:对于事务处理没有记忆能力,每次请求-响应都是独立的。

缺点:

多次请求之间不能共享数据。

优点:

速度快。

浏览器请求服务器并把数据发送给服务器,然后服务器要解析请求数据,如何解析呢,就要按照Http协议进行解析,同样服务器发送给前端响应数据也按照http协议进行解析;

HTTP 协议基本工作流程

HTTP 协议基本工作流程,就是“请求 - 应答”“一发一收”的模式。

在这个过程中参与请求和应答的是服务器端、客户端、http 协议本身。

HTTP请求:

HTTP-请求数据格式:

请求方式为Get:

GET /brand/findAll?name=OPPO&status=1 HTTP/1.1

Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*

Accept-Encoding:gzip,deflate,br

Accept-Language:zh-CN,zh;q=0.9

Host:localhost:8080

User-Agent:Mozilla/5.0(Windows NT 10.0;Win64;×64)AppleWebkit/537.36(KHTML,like Gecko)Chrome/.

请求方式为Post :

POST /brand HTTP/1.1

Accept:application/json,text/plain,*/*

Accept-Encoding:gzip,deflate,br

Accept-Language:zh-CN,zh;q=0.9

Content-Length:161

Content-Type:application/json;charset=UTF-8

Cookie:Idea-8296eb32=841b16f0-0cfe-495a-9cc9-d5aaa71501a6;JSESSIONID=OFDE4E430876BD9C5C955F061207386F

Host:localhost:8080

User-Agent:Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,like Gecko)Chrome/.

{"status":1,"brandName":"javaweb","id":"","description":"前后端分离"}

上面两个请求方式中,第一行是请求方式:get和post,后面是资源路径,再后面就是协议以及对应的版本;但是Get请求中间有数据,这些是请求参数。

第二行以下是请求头,key:value格式的;

post请求最后一行是请求体,存放请求参数;get请求中的请求参数是放在请求行中的也就是第一行,在资源路径后面key=value&key=value...的方式,没有请求体;get请求大小有限制,post请求没有大小限制;

可以看到下图案例中请求头中显示为Get请求:

 HTTP响应:

浏览器发送请求信息后,然后服务器解析,解析后将响应信息发送给浏览器;

http响应格式:

HTTP/1.1200 OK

Content-Type:application/json

Transfer-Encoding:chunked

Date:Tue,10 May 202207:51:07 GMT

Keep-Alive:timeout=60

Connection:keep-alive

[{id:1,GameName:“王者荣耀”,PeopleName:“:“东方曜”}]

响应行:响应数据第一行(协议、状态码、描述)

响应头:第二行开始,格式key:value

响应体:最后一部分,存放响应数据

 常见的响应状态码:

 HTTP协议解析:

Web服务器:

    Web服务器是是一个软件程序,对HTTP协议的操作进行封装,使程序员不必直接对协议进行操作,让Web开发更加便捷,主要功能是提供网上信息浏览服务。

    java网络编程就是服务器与客户端之间的数据解析,但是这种方式代码量很多,因此推出了web服务器tomcat,直接将解析代码封装起来,可以直接用;并且可以将项目部署到web服务器上,对外提供网上信息浏览服务;

tomcat:

    tomcat是⼀个Http服务器(能够接收并且处理http请求,所以tomcat是⼀个http服务器)
我们使⽤浏览器向某⼀个⽹站发起请求,发出的是Http请求,那么在远程,Http服务器接收到这个请求之后,会调⽤具体的程序(Java类)进⾏处理,往往不同的请求由不同的Java类完成处理。

 注意:springboot中内置了tomcat,并且springboot项目都是运行在内嵌的tomcat中的,web程序的话需要部署在外部的tomcat服务器中运行。

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

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

相关文章

使用pygame建立一个简单的使用键盘方向键移动的方块小游戏

import pygame import sys# 初始化pygame pygame.init()# 设置窗口大小 screen_size (640, 480) # 创建窗口 screen pygame.display.set_mode(screen_size) # 设置窗口标题 pygame.display.set_caption("使用键盘方向键移动的方块的简单小游戏")# 设置颜色 bg_colo…

帅气的性能监控平台Grafana(Windows下使用Grafana监控系统指标与GPU指标)

帅气的性能监控平台Grafana(Windows下使用Grafana监控系统指标与GPU指标) 前情提要 系统环境准备 windows_exporter下载 nvidia_gpu_exporter下载 prometheus下载 Grafana下载 安装指导 windows_exporter安装与nvidia_gpu_exporter安装 promethe…

ApacheNginx配置ssl证书

一、Apache配置ssl Linux版本:CentOS Linux release 7.9.2009 (Core) Apache版本:Apache/2.4.6 (CentOS) 1、安装Apache(使用默认yum源) [root10-35-1-25 ~]# yum -y install httpd2、查Apache版本&启动Apache [root10-35-…

深度解读NVMe计算存储协议-2

近日,NVME协议组织为了解决这些性能问题并为供应商提供标准化机制,在其架构中集成优化的计算功能,开发了NVM Express (NVMe) 计算存储特性。 计算存储的核心特性包括两个命令集:计算程序集和子系统本地内存。 其中,计算…

postgresql|数据库|pg_repack插件的部署和使用

一, 表和索引的膨胀现象 Postgres SQL 实现的MVCC的机制不同于 oracle , mysql innodb 的 undo tablespace 的机制。 表上所用的更新和删除等操作的行为,都不会实际的删除或修改,而是标记为死元祖 (dead rows or dead…

非鸿蒙官方低代码源码生成器

介绍 鸿蒙低代码可视化开发神器快速对鸿蒙ArkUI生成源码,结合类似小程序类似设计,页面设计底部菜单,支持宫格组件、轮播图、图文列表、图片组件、文本内容组件,快速对接第三方HttpApi。通过鸿蒙扩展axios扩展库加载数据源&#x…

jmeter+nmon+crontab简单的执行接口定时压测

一、概述 临时接到任务要对系统的接口进行压测,上面的要求就是:压测,并发2000 在不熟悉系统的情况下,按目前的需求,需要做的步骤: 需要有接口脚本需要能监控系统性能需要能定时执行脚本 二、观察 >…

Spring的事件监听机制

这里写自定义目录标题 1. 概述(重点)2. ApplicationEventMulticaster2.1 SimpleApplicationEventMulticaster2.2 AbstractApplicationEventMulticaster 3. ApplicationListener3.1 注册监听器3.2 自定义 4. SpringApplicationRunListeners 1. 概述&#…

协会认证!百望云荣获信创工委会年度“卓越贡献成员单位”称号

当前,新一轮科技革命和产业变革正加速重塑全球经济结构,强化企业科技创新的主体地位,推动创新链、产业链、人才链深度融合,加快科技成果产业化进程至关重要。 近日,中国电子工业标准化技术协会信息技术应用创新工作委员…

对付勒索病毒,复杂的往往无法落地

一道道复杂门墙防护安全, 还是一个精密的锁更安全? 👇👇👇 在网络数据安全问题频发的当下,除了常规的备份、灾备措施以外,企业是否有做好应对最坏情况的准备?一旦病毒绕过了一道道…

shell - 免交互

一.Here Document 免交互 1. 交互的概念 交互:当计算机播放某多媒体程序的时候,编程人员可以发出指令控制该程序的运行,而不是程序单方面执行下去,程序在接受到编程人员相应的指令后而相应地做出反应。 对于Linux操作系统中&…

ztest中ddof起什么作用

⭐️ statsmodels 中 ztest 基本使用 statsmodels 也是一个强大的统计分析库,提供了丰富的统计模型和检验功能。对于 Z 检验,statsmodels 提供了 ztest 函数。 以下是使用 statsmodels 进行 Z 检验的示例: from statsmodels.stats.weights…

ElementUI 组件:Container 布局容器

ElementUI安装与使用指南 Container 布局容器 点击下载learnelementuispringboot项目源码 效果图 el-container.vue&#xff08;Container 布局容器&#xff09;页面效果图 项目里el-container.vue代码 <script> import PagePath from "/components/PagePat…

[NOIP2011 提高组] 聪明的质监员

[NOIP2011 提高组] 聪明的质监员 题目描述 小T 是一名质量监督员&#xff0c;最近负责检验一批矿产的质量。这批矿产共有 n n n 个矿石&#xff0c;从 1 1 1 到 n n n 逐一编号&#xff0c;每个矿石都有自己的重量 w i w_i wi​ 以及价值 v i v_i vi​ 。检验矿产的流程…

Python代码覆盖率工具

Coverage.py是一个用于测量Python程序代码覆盖率的工具。它监视您的程序&#xff0c;注意代码的哪些部分已经执行&#xff0c;然后分析源代码&#xff0c;以确定哪些代码本可以执行&#xff0c;但没有执行。 覆盖率测量通常用于衡量测试的有效性。它可以显示代码的哪些部分正在…

S275 4G网络IO模块:智能酒店的理想选择

行业背景 随着物联网技术的发展&#xff0c;酒店服务也变得更加“智能”——自动灯光效果、室内温湿度控制、各种人性化操作等贴心服务&#xff0c;带给顾客真正的宾至如归之感。 同时&#xff0c;智慧酒店更为管理者提供了高效的管理手段&#xff0c;将酒店物耗、能耗、人员…

全网最简单的幻兽帕鲁服务器搭建教程

幻兽帕鲁是一款备受欢迎的多人在线游戏&#xff0c;为了提供更好的游戏体验&#xff0c;许多玩家选择自行搭建服务器。本文将指导大家如何简单快速地搭建幻兽帕鲁服务器&#xff0c;轻松享受游戏的乐趣。 第一步&#xff1a;购买游戏联机服务器 购买入口&#xff1a;https://tx…

【八大排序】直接插入排序 | 希尔排序 + 图文详解!!

&#x1f4f7; 江池俊&#xff1a; 个人主页 &#x1f525;个人专栏&#xff1a; ✅数据结构冒险记 ✅C语言进阶之路 &#x1f305; 有航道的人&#xff0c;再渺小也不会迷途。 文章目录 一、排序的概念二、直接插入排序2.1 基本思想2.2 适用说明2.3 过程图示2.4 代码实现2.…

排序之计数排序

꒰˃͈꒵˂͈꒱ write in front ꒰˃͈꒵˂͈꒱ ʕ̯•͡˔•̯᷅ʔ大家好&#xff0c;我是xiaoxie.希望你看完之后,有不足之处请多多谅解&#xff0c;让我们一起共同进步૮₍❀ᴗ͈ . ᴗ͈ აxiaoxieʕ̯•͡˔•̯᷅ʔ—CSDN博客 本文由xiaoxieʕ̯•͡˔•̯᷅ʔ 原创 CSDN …

vue+element 换肤功能

1.首先建深色和浅色两个主题样式变量样式表&#xff0c;样式表名和按钮中传入的值一样&#xff0c;本例中起名为default.scss和dark.scss 2.在data中定义主题变量名 zTheme:‘defalut’&#xff0c;默认引用defalut.scss, 在点击按钮时切换引用的样式表&#xff0c;达到换肤效果…