可以设置 location.href 强制在服务器端进行路由吗?
Is it OK settings location.href to force routing on the server-side?
我正在开发一个带有 Asp.Net Core + Typescript 后端的 React 网络应用程序。路由在前端,由 React-Router v4 管理。目前一切正常。
顺便说一下,有些情况下我需要(我想要)通过服务器重定向路由,而不是让其进入浏览器逻辑。例如,我想在 cookie 不存在或过期时强制重定向到某个页面。
例如,如果我使用 <Redirect to="/reserved" />
之类的东西,React.Router 会尽力而为:指向 "reserved" 页面的路由,但这不是我想要的。我需要将此路径提供给服务器,即绕过前端路由。
在这种情况下,我找到的解决方案是按如下方式设置所需的路径:
window.location.href = '/reserved';
这似乎直接将新路径请求发送到服务器,没有(明显)参与 React.Router。显然,一切正常,如我所料。
问题是:它是实现所需行为的可靠方法,还是看起来很可能是黑客攻击(我应该避免它)?
在单页应用程序 (SPA) 的上下文中,无论您使用的框架或技术如何,显式设置 window.location
都是离开 SPA 的路由控制并强制执行的完美方式浏览器为该新路由发出实际的 HTTP 请求。
这样做当然意味着整个页面将被卸载,所以当这样做时,您将离开您的 SPA。如果该目标 URL 然后再次加载相同的 SPA,这通常会分散用户的注意力。这就是为什么常见的 SPA 路由器实现会拦截路由更改并通过自己的路由来处理它们,而不是让浏览器发出实际请求。
您应该查看路由器的文档,看看是否可以添加一些路由器保护程序,以允许您在负载或路由更改时验证事物,以便您可以将用户导航到某个强制位置。
如果目标 URL 不是 SPA 的一部分,那么当然设置 window.location
是完全没问题的。这当然不是黑客,而是不通过 SPA 路由器更改位置的正确方法。
我正在开发一个带有 Asp.Net Core + Typescript 后端的 React 网络应用程序。路由在前端,由 React-Router v4 管理。目前一切正常。
顺便说一下,有些情况下我需要(我想要)通过服务器重定向路由,而不是让其进入浏览器逻辑。例如,我想在 cookie 不存在或过期时强制重定向到某个页面。
例如,如果我使用 <Redirect to="/reserved" />
之类的东西,React.Router 会尽力而为:指向 "reserved" 页面的路由,但这不是我想要的。我需要将此路径提供给服务器,即绕过前端路由。
在这种情况下,我找到的解决方案是按如下方式设置所需的路径:
window.location.href = '/reserved';
这似乎直接将新路径请求发送到服务器,没有(明显)参与 React.Router。显然,一切正常,如我所料。
问题是:它是实现所需行为的可靠方法,还是看起来很可能是黑客攻击(我应该避免它)?
在单页应用程序 (SPA) 的上下文中,无论您使用的框架或技术如何,显式设置 window.location
都是离开 SPA 的路由控制并强制执行的完美方式浏览器为该新路由发出实际的 HTTP 请求。
这样做当然意味着整个页面将被卸载,所以当这样做时,您将离开您的 SPA。如果该目标 URL 然后再次加载相同的 SPA,这通常会分散用户的注意力。这就是为什么常见的 SPA 路由器实现会拦截路由更改并通过自己的路由来处理它们,而不是让浏览器发出实际请求。
您应该查看路由器的文档,看看是否可以添加一些路由器保护程序,以允许您在负载或路由更改时验证事物,以便您可以将用户导航到某个强制位置。
如果目标 URL 不是 SPA 的一部分,那么当然设置 window.location
是完全没问题的。这当然不是黑客,而是不通过 SPA 路由器更改位置的正确方法。