【SpringMVC】SpringMVC 小案例：加法计算器初步理解前后端接口交互与数据处理
文章目录
- 加法计算器
- (一) 约定前后端交互接口
- 1.概念
- 2.需求分析
- 3.接口定义
- 4.**请求参数:**
- 5.**响应数据:**
- (二) 服务器代码
- (三) 前端页面代码
- (四) 测试运行
结合前两篇关于SpringMVC的学习,做一些小案例
- 1.理解前后端交互过程
- 2.接口传参,数据返回,以及页面展示
加法计算器
需求: 输入两个整数, 点击"点击相加"按钮, 显示计算结果
(一) 约定前后端交互接口
1.概念
约定"前后端交互接口"是进行 Web 开发中的关键环节.
接口又叫 API（Application Programming Interface),我们一般讲到接口或者 API，指的都是同一个东西.是指应用程序对外提供的服务的描述,用于交换信息和执行任务(与JavaSE阶段学习的[类和接口]中的接口是两回事).
简单来说,就是允许客户端给服务器发送哪些 HTTP 请求,并且每种请求预期获取什么样的 HTTP 响应.
现在"前后端分离"模式开发,前端和后端代码通常由不同的团队负责开发.双方团队在开发之前,会提前约定好交互的方式.客户端发起请求,服务器提供对应的服务.服务器提供的服务种类有很多,客户端按照双方约定指定选择哪一个服务.
接口,其实也就是我们前面网络模块讲的的"应用层协议".把约定的内容写在文档上,就是"接口文档",接口文档也可以理解为是 应用程序的"操作说明书".
在项目开发前,根据需求先约定好前后端交互接口,双方按照接口文档进行开发.
接口文档通常由服务提供方来写,交由服务使用方确认,也就是客户端.
接口文档一旦写好,尽量不要轻易改变.
如若需要改变,必须要通知另一方知晓.
2.需求分析
加法计算器功能,对两个整数进行相加,需要客户端提供参与计算的两个数,服务端返回这两个整数计算的结果
3.接口定义
基于以上分析,我们来定义接口
接口定义
请求路径: calc/sum
请求方式: GET/POST
接口描述: 计算两个整数相加
4.请求参数:
| 参数名 | 类型 | 是否必须 | 备注 |
|---|---|---|---|
| num1 | Integer | 是 | 参与计算的第一个数 |
| num2 | Integer | 是 | 参与计算的第二个数 |
示例: num1=5&num2=3
5.响应数据:
Content-Type: text/html
响应内容: 计算机计算结果: 8
服务器给浏览器返回计算的结果
(二) 服务器代码
(三) 前端页面代码
(四) 测试运行
