react-router-dom中的BrowserRouter和HashRouter

Posted 2022-10-31 Ly_cat

服务器路由: browserRouter,前端路由: hashRouter

1、browserRouter

如果前端使用了browserRouter，每次改变路由时，会向服务器发送请求，因为服务器未配置对应的路径指向对应的文件，自然导致出现404的情况.(对于初始化页面,即路由为/时,不会发送请求)

因此在使用browserHistory需要再加一层服务器配置(node/nginx),让前端发送的请求映射到对应的html文件上.

2、hashRouter

由于hashRouter会在路径上添加/#/，而/#/后面的所有都不会发送到服务器端，即对于服务器而言，路径依旧是localhost:3000，路由切换在前端完成。

但是官方会更推荐使用browserRouter，貌似是因为其构建于H5的History API，比起hashRouter，它多出了更多的方法操控url。