如何让 Nuxt-auth 和 Nuxt-i18n 成为朋友答案

【问题标题】：How to make Nuxt-auth and Nuxt-i18n to be friends如何让 Nuxt-auth 和 Nuxt-i18n 成为朋友
【发布时间】：2019-02-21 04:25:08
【问题描述】：

我想同时使用 nuxt@auth 模块和 nuxt-i18n。当我想为登录页面设置不同的路由时，就会出现问题。例如：

pages: {
 login: {
  en: '/authorization',
  fr: '/autorisation'
 }
}

路由运行良好，但是当我尝试在所有页面受限的情况下使用 nuxt@auth 时，默认重定向会要求 /login 页面。在 nuxt.config.js 文件中我可以重写重定向路由，但我只能设置一个重定向。

auth: {
 redirect: {
  login: '/fr/autorisation'
 }
}

如何向身份验证模块显示以询问所选语言的路线？提前致谢！

【问题讨论】：

标签： javascript authentication vue.js internationalization nuxt.js

【解决方案1】：

https://github.com/nuxt-community/auth-module/pull/185 似乎有解决该问题的方法，但我无法在当前版本中访问onRedirect 方法。

我做了一个解决方法。我添加了auth-lang-redirect.js 插件，它覆盖了nuxt.config.js 文件中定义的redirect 选项。

export default ({ app }) => {
  var redirect = app.$auth.$storage.options.redirect
  for (var key in redirect) {
    redirect[key] = '/' + app.i18n.locale + redirect[key]
  }
  app.$auth.$storage.options.redirect = redirect
}

请注意，我不使用nuxt-i18n 模块，但您应该明白这一点。你必须像这样在nuxt.config.js注册这个插件：

auth: {
    strategies: { ... },
    redirect: {
      login: '/login',
      logout: '/',
      callback: '/login',
      home: '/user/profile'
    },
    plugins: ['@/plugins/auth-lang-redirect.js']
  },

【讨论】：

谢谢，我已经解决了这个问题，我的解决方法是没有 for，但做同样的事情。

【解决方案2】：

希望对某人有所帮助 =)

export default ({ app, $auth }) => {
 $auth.onRedirect((to, from) => {
   return app.localePath(to)
  })
}

【讨论】：

这是正确的解决方案。它尊重 prefix_except_default （默认语言没有前缀），并且可以完美地与单页行为（切换语言 -> 登录）
这是插件还是中间件？
@Rozkalns 这是插件
效果很好。谢谢！
完美运行！只是想明确插件必须在 auth config 中注册，而不是在 plugins 属性中注册，auth.nuxtjs.org/recipes/extend

【解决方案3】：

export default function({ app, $auth }) {
  const redirect = { ...$auth.$storage.options.redirect };

  const localizeRedirects = () => {
    for (const key in redirect) {
      $auth.$storage.options.redirect[key] = app.localePath(redirect[key]);
    }
  };

  localizeRedirects();

  app.i18n.onLanguageSwitched = () => {
    localizeRedirects();
  };
}

【讨论】：