前端面试题：React Router 中，HashRouter 和 BrowserRouter 的区别和原理？

React Router 是一个用于处理 React 应用中的路由的库，其中 HashRouter 和 BrowserRouter 是两种主要的路由器组件。它们的主要区别在于路由的实现方式和 URL 的处理方式。下面是它们的区别和原理：

哈希路由：HashRouter 使用 URL 的哈希（#）部分来保持和同步路由信息。哈希路由器将路由信息附加在 URL 的 # 之后，浏览器不会将其发送到服务器，这样所有的路由信息都在客户端处理。

例如：
- 当前 URL：http://example.com/#/home
- HashRouter 解析 URL 中的 #/home 部分来决定显示哪个组件。
工作机制：
- 浏览器的哈希变化不会导致页面重新加载，只会更新 window.location.hash。
- 当 URL 中的哈希部分变化时，HashRouter 会监听这些变化并更新路由。

HTML5 History API：BrowserRouter 使用 HTML5 的 History API 来管理路由。它通过 pushState 和 replaceState 操作历史记录，来改变浏览器的 URL 地址而不重新加载页面。

例如：
- 当前 URL：http://example.com/home
- BrowserRouter 直接解析 /home 来决定显示哪个组件。
工作机制：
- 通过 History API 更新浏览器的 URL，并监听这些变化来更新路由。
- 需要服务器配置来处理路由，因为所有的路由信息都会发送到服务器，服务器需要进行相应的处理和配置。