Nuxt.js v2.13.0环境下线上访问URL时query参数自动移除问题

• Nuxt 2.10+版本新增了trailingSlash路由配置，生产环境下该配置默认为undefined时，会自动对路径格式做统一重定向，你的输入路径不带尾部斜杠，触发自动加斜杠的重定向时如果没有特殊处理会丢失query参数，本地开发环境默认不会触发该重定向逻辑，所以不会复现问题。
• 部署用的Web服务器（如Nginx、Apache）配置了路径标准化的重定向规则，规则编写时没有保留query参数，跳转时直接丢弃了参数部分。
• 项目全局路由中间件、页面asyncData/fetch钩子、路由守卫中存在强制跳转逻辑，线上环境触发跳转时没有携带原query参数。

1. 调整Nuxt路由配置 #

在nuxt.config.js中明确指定trailingSlash的取值，对齐你需要的路径格式，Nuxt官方的重定向逻辑会自动保留query参数：

// nuxt.config.js
export default {
  router: {
    // 路径统一不带尾部斜杠，和你输入的 https://link-dev.com/abc/create 格式对齐
    trailingSlash: false
    // 如果需要统一带尾部斜杠，就改为 true，重定向时也会自动保留参数
  }
}

配置修改后重新打包部署即可生效。

2. 修正部署层重定向规则 #

如果是Web服务器的重定向规则导致的参数丢失，以Nginx为例，需要在重定向规则中添加参数保留的配置：

# 错误的规则，会丢失query参数
rewrite ^([^.]*[^/])$ $1/ permanent;

# 修正后的规则，自动保留原有query参数
rewrite ^([^.]*[^/])$ $1/$is_args$args permanent;

其他Web服务器对应的规则也需要同步调整，保证重定向时携带原有参数。

3. 排查项目内跳转逻辑 #

检查所有主动触发路由跳转的代码，包括全局路由中间件、页面路由守卫、asyncData/fetch中的redirect调用、$router.push/$router.replace逻辑，确认跳转时是否主动携带了原有的query参数。

内容的提问来源于stack exchange，提问作者Juno