vue访问后端端口失效_Vue新手向——后端代码（1）

现在前后端分离是程序越来越多的趋势了&＃xff0c;今天在学习vue时&＃xff0c;前期在本地跑得好好的&＃xff0c;然后和后端一对接就出问题了&＃xff0c;但是前端和后端是不可能不和后端对接的。

1. 即便是后台数据库比较花时间&＃xff0c;但是用户体验也比前面的方式好&＃xff0c;因为用户会先看到部分页面&＃xff0c;过一小会儿再看到数据&＃xff0c;比在空白页面打圈圈等待体验好。
2. 后端只提供数据&＃xff0c;所以前后端开发耦合度降低了很多&＃xff0c;整体开发效率可以得到较大提高。

&＃64;RequestMapping("/findAll/{page}/{size}")public Page findAll(&＃64;PathVariable("page") Integer page, &＃64;PathVariable("size") Integer size){ Pageable request &＃61; PageRequest.of(page,size); return bookRepository.findAll(request);}

使用JPA 实现最简单的增删改查&＃xff0c;以上就是&＃xff1a;通过地址栏传递参数&＃xff0c;后端通过&＃64;PathVariable属性获取地址栏中的参数&＃xff0c;并将其传入代码中&＃xff0c;并在数据库中查询到所需的数据&＃xff0c;并显示出来。

下图就是通过 访问 http://localhost:8181/book/findAll/1/6 接口来获取数据&＃xff0c;其中localhost是ip&＃xff0c;就像我们访问的那些网站&＃xff0c;只不过那些网站都是域名的&＃xff0c;如&＃xff1a;baidu.com&＃xff0c;qq.com。。

在本地环境下&＃xff0c;localhost 可以等于 127.0.0.1&＃xff0c;已经你的ip&＃xff0c;具体ip查看&＃xff0c;win&＃43;R, 打开命令行窗口&＃xff0c;输入ipconfig&＃xff0c;找到你的ip&＃xff0c;如我的ip是192.168.0.192&＃xff0c;那么我通过&＃xff0c;http://192.168.0.192:8181/book/findAll/1/6&＃xff0c;也是可以访问的&＃xff0c;但是通过ip访问&＃xff0c;其他电脑也可以访问&＃xff0c;但是通过

localhost或者127.0.0.1&＃xff0c;这种只能自己访问&＃xff0c;如果别人访问&＃xff0c;那将是访问别人自己的电脑。

8181表示端口&＃xff0c;若是端口为80&＃xff0c;那么可以省略不写&＃xff0c;就像我们访问的 www.baidu.com&＃xff0c;没有在后面加端口&＃xff0c;因为80端口是默认的&＃xff0c;如果你不写端口&＃xff0c;默认就是80端口&＃xff0c;(不信&＃xff1f;&＃xff1f;&＃xff1f;不信可以尝试去访问一下&＃xff0c;www.baidu.com:80 www.baidu.com:8181)或是其他网站的非80端口试试&＃xff0c;看能不能访问。

/book/findAll 表示接口名称

以上&＃xff0c;就是后端代码的写法&＃xff0c;通过集成的JPA可以很轻易的写出较为简单的查询&＃xff0c;若是复杂一点的查询&＃xff0c;JPA就不够用了&＃xff0c;当然这是后话了