上届世界杯_世界杯韩国 - cngkpt.com

最简单的前后端连接(新手小白)

第一部分,简单的前端页面

1、创建一个简单的html文件,写超级简单的输入框

第二部分,简单的后端接口

1、先创建一个简单的java的spring项目,具体详见

第一个接口笔记-CSDN博客

2、在之前创建的数据库里面创建一个数据表,如图:

3、在之前创建好的项目下面,创建一个entity包,然后写一个User类,

在User类里面写上数据库中的属性,注意要意义对应,然后一定要记得加上@Data注解

(这个是由lombok插件提供的,有这个注解就不用写一大堆get和set方法了)

4、创建一个mapper包,新建一个UserMapper接口(注意是接口)

一定记得加上@Mapper注解,不然后面会报错

5、此时的UserMapper仅仅是一个接口,然后可以在Demo1Application里面注入

但是通常为了规范,会新建一个专门的controller包,然后注入,并且修改之前的方法

这是UserController的补充

6、试运行,没有问题, 9090端口也可以查到数据

第三部分,前后端连接

运行以后,会出现一个报错,经典的跨域问题

跨域解决:

这是一种最简单的方式,在Controller类里面加一个注解@CrossOrigin(origins="*")就可以了

成功拿到数据

接下来再去前端页面详细写写

Document

username:

password:

nickname:

email:

phone:

address:

最终显示效果

那个password的type改成password了

终于完工了!!!这是一个小小的里程碑事件!!!