前端页面重定向-CSDN博客

本文链接：https://blog.csdn.net/wwwlixun333/article/details/148453626

在项目中遇到需要重定向的需求，在此记录一下，分享给以后可能用到的小伙伴们：

需求目标：

比如当用户访问以下两个 URL：

https://xxx.domian.com/
https://xxx.domain.com/home

需要自动重定向到：

https://www.domain.com/

前端实现方式：

在 https://xxx.domain.com 所部署的前端项目中（假设你用的是 Vue/React 或静态页面），可以在入口页面（如 index.html、App.vue 或路由初始化文件）中添加如下逻辑：

方案一：直接用原生 JavaScript 判断并重定向

放在 index.html 中的 <script>：

<script> 
    const pathname = window.location.pathname; 
    if (pathname === '/' || pathname === '/home') { 
        window.location.href = 'https://www.domain.com/'; 
    } 
</script>

方案二：Vue 应用中放在 `App.vue` 或路由守卫中处理

如果你用的是 Vue Router，可以加到路由守卫中：

router.beforeEach((to, from, next) => {
  const shouldRedirect = to.path === '/' || to.path === '/home';
  if (shouldRedirect) {
    window.location.href = 'https://www.domain.com/';
  } else {
    next();
  }
});