vuejs学习5.1 前后端渲染与前后端路由，url的hash，html5的history

路由

路由是通过互联网的网络把信息从源地址传输到目的地址的活动

前端渲染，前端路由和后端渲染，后端路由

后端渲染，后端路由

在输入路径url向服务器请求页面时，服务端已经通过css+html+java渲染了一个页面，直接将页面给浏览器显示，就是后端渲染。
浏览器将url提交给服务器，服务器对url进行解析，通过css+ html+java渲染好，然后传给前端浏览器显示，所以服务器不同的url对应不同的页面。后端处理url和页面之间的关系就是后端路由。
一个页面有自己对应的网站，也就是url，url发送给服务器，服务器通过某种方式对url进行匹配，最后交给后端的controller控制层处理，最终生成html返回给前端，这就是后端路由。

前后端分离阶段

后端只负责提供数据，不负责任何阶段的内容
在浏览器输入url在静态服务器拿到html+css+js，然后再浏览器执行js代码（Ajax），发送网络请求，获取大量数据，渲染整个网页，这就是前端渲染，浏览器中网页显示的大部分内容都是前端写的js代码在浏览器中执行，最后渲染处理的网页。

单页面富应用（SPA）

在前后端分离基础上加了一层前端路由
SPA：single page web application单页面富应用，整个网站只有一个页面

改变url，页面不会整体的刷新

修改页面不刷新

url的hash

通过location.hash修改url，然后可以看到页面没有刷新

html5的history

使用history.pushState()，第一个参数为data，第二个为title，第三个为url，可以history.pushState({} , ‘’ , ‘home’)来改变路径

history.back()表示出栈，如果一直使用history.pushState相当于入栈，如果使用history.back()会回到上一个页面

history.replaceState()不会返回到上一个页面，没有栈操作

history.go(-1)表示栈弹出一个，表示上一个界面
history.go(-2)表示栈弹出二个，表示上上一个界面，等等
history.forword()相当于history.go(1)，表示到写一个界面
以上表示浏览器的前进后退