1.创建项目

2.导入前端代码

2.1 static包内

2.2 测试前端代码是否有误

显示成功说明无误

2.3 定义用户接口

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

请求参数:

3.服务器代码

@RestController
@RequestMapping("/calc")
public class CalcController {@RequestMapping("/sum")public String add(Integer num1,Integer num2){Integer sum=num1+num2;return "<h1>计算机计算结果: "+sum+"</h1>";}
}

3.1 测试是否有误

两种方式测试接口

3.1.1 浏览器测试

3.1.2 postman测试

后端无误

4.前后端交互 

添加访问url和请求⽅式

<form action="calc/sum" method="post"><h1>计算器</h1>数字1：<input name="num1" type="text"><br>数字2：<input name="num2" type="text"><br><input type="submit" value=" 点击相加 "></form>

成功