Spring MVC 练习项目

加法计算器

需求

输入两个整数，点击"点击相加"按钮，显示计算结果

约定前后端交互接口

约定"前后端交互接口"是进行Web开发中的关键环节

需求分析

加法计算器功能，对整个整数进行相加，需要客户端提供参与计算的两个数，服务端返回这两个整数计算的结果

接口定义

复制代码

请求路径：
calc/sum
请求⽅式：
GET/POST
接⼝描述：计算两个整数相加

请求参数

响应数据

复制代码

Content-Type: text/html
响应内容: 计算机计算结果

服务器代码

用户登录

需求

用户输入账号和密码，后端进行校验密码是否正确

1.如果不正确，前端进行用户告知

2.如果正确，跳转到首页，首页显示当前登录用户

3.后续再访问首页，可以获取登录用户信息

约定前后端交互接口

需求分析

对于后端开发人员而言，不涉及前端页面的展示，只需要提供两个功能

1.登录页面：通过账号和密码，校验输入的账户密码是否正确，并告知前端

2.首页：告知前端当前登录用户，如果当前已有用户登录，返回登录的账号，如果没有返回空

接口定义

1.校验接口

复制代码

请求路径：/user/login

请求⽅式：POST

接⼝描述：校验账号密码是否正确

请求参数

响应数据

复制代码

Content-Type: text/html

响应内容:
true  //账号密码验证成功
false //账号密码验证失败

2.查询登录用户接口

复制代码

请求路径：/user/getLoginUser

请求⽅式：GET

接⼝描述：查询当前登录的⽤⼾

请求参数

无

响应数据

复制代码

Content-Type: text/html

响应内容: zhangsan

实现服务端代码

留言板

需求

1.输入留言信息，点击提交，后端把数据存储起来

2.页面展示输入留言板的信息

约定前后端交互接口

需求

1.提交留言：用户输入信息之后，后端把留言信息保存起来

2.留言展示：页面展示时，需要从后端获取到所有留言的信息

接口定义

1.获取全部留言

全部留言信息，用List来表示，可以用JSON来描述这个List数据

请求：

复制代码

GET /message/getList

响应：JSON格式

复制代码

[
  {
    "from": "⿊猫",
    "to": "⽩猫",
    "message": "喵"
  },{
    "from": "⿊狗",
    "to": "⽩狗",
    "message": "汪"
  },
    //...
]

2.发表新留言

请求：body也为JSON格式

复制代码

POST /message/publish
{
  "from": "⿊猫",
  "to": "⽩猫",
  "message": "喵"
}

响应：JSON格式

复制代码

{
  ok: 1
}

实现服务端代码

图书管理系统

需求

1.登录：用户输入账号，密码完成登录功能

2.列表展示：展示图书

约定前后端交互接口

需求

图书管理系统是一个相对较大的案例，先实现其中一部分功能

1.账户密码校验接口：根据输入用户名和密码校验登录是否通过

2.图书列表：提供图书列表信息

接口定义

1.登录接口

复制代码

[URL]
POST /user/login

[请求参数]
name=admin&password=admin

[响应]
true //账号密码验证成功
false//账号密码验证失败

2.图书列表展示

复制代码

[URL]
POST /book/getList

[请求参数]
⽆

[响应]
返回图书列表

[
   {
     "id": 1,
     "bookName": "活着",
     "author": "余华",
     "count": 270,
     "price": 20,
     "publish": "北京⽂艺出版社",
     "status": 1,
     "statusCN": "可借阅"
   },
   ...
]

字段说明