Nuxt•14mo ago

Unable to restrict /es/admin path

I am using i18n Nuxt extension.

This is my code:

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  modules: ['@nuxtjs/i18n'],
  i18n: {
    vueI18n: './i18n.config.ts',
    locales: ['en', 'es'], // used in URL path prefix
    defaultLocale: 'en',
    customRoutes: 'config', // disable custom route with page components
    pages: {
      about: {
        en: '/about-us', // -> accessible at /about-us (no prefix since it's the default locale)
        es: '/sobre', // -> accessible at /es/sobre
      },
      'admin/index': false,
      'admin/*': false, <----- doesn't work
    },
  },
});

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  modules: ['@nuxtjs/i18n'],
  i18n: {
    vueI18n: './i18n.config.ts',
    locales: ['en', 'es'], // used in URL path prefix
    defaultLocale: 'en',
    customRoutes: 'config', // disable custom route with page components
    pages: {
      about: {
        en: '/about-us', // -> accessible at /about-us (no prefix since it's the default locale)
        es: '/sobre', // -> accessible at /es/sobre
      },
      'admin/index': false,
      'admin/*': false, <----- doesn't work
    },
  },
});

I can visit /admin and cannot visit /es/admin . That's great and as expected.

But I can visti both /admin/settings and /es/admin/settings. Which is not good.

How to use stars or regex or something to block every other subpath for /es locale/prefix?

kapa.ai•11/15/24, 3:30 AM

Hi @Wirkhof. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base.

kapa.ai•11/15/24, 3:31 AM

----------------------
Based on the information provided in the knowledge sources, I can offer some insights into your issue with restricting the path using the Nuxt i18n module.

The configuration you've shown is close, but there's a small adjustment needed to achieve what you're trying to do. According to the Nuxt i18n documentation (https://nuxt.com/docs/getting-started/configuration), the configuration in the i18n module is used to define custom routes for specific pages, not to restrict access to certain paths.

To restrict access to the path, you should use the configuration in your

nuxt.config.ts

nuxt.config.ts

file instead. Here's how you can modify your configuration:

In this configuration, we've moved the admin route rules to the section. The wildcard will match all paths under and , effectively applying the rule to all admin pages in both languages.

The setting will make these routes client-side only, which can be a way to restrict access. However, if you want to completely block access to these routes, you might need to implement additional logic in your middleware or server-side code.

kapa.ai•11/15/24, 3:31 AM

Remember that this configuration will affect how these routes are rendered and accessed, but it doesn't provide authentication or authorization by itself. For proper access control, you should implement authentication and authorization logic in your application.

Nuxt Configuration Reference (https://nuxt.com/docs/getting-started/configuration) provides more details on how to use and other configuration options in Nuxt 3.

If this doesn't solve your specific issue, you might need to provide more details about what exactly you're trying to achieve with the path restriction.
----------------------
Note: you can ask me a follow up question by @ mentioning me again

----------------------

kapa.ai•11/15/24, 3:31 AM

@1184447325335199871 Kapa.ai is still learning and improving, please let me know how I did by reacting below.

HardWare•11/15/24, 8:53 AM

Not gonna lie, if page is localized I prefere to use prefix on all pages, or no prefix at all. It's going to work any way correct cause i18n redirect on default browser locale if enabled.
You have literary described here how to do it.
https://i18n.nuxtjs.org/docs/v8/guide/custom-paths#module-configuration

@nuxtjs/i18n

Custom Route Paths

Customize the names of the paths for specific locale.

WirkhofOP•11/29/24, 4:24 PM

I don't prefer that and I prefer /admin or /this-is-for-my-chinese-wife to be in one and one language only. In Laravel you can just select routes you want to localize in the web.php file be encapsulating that code e.g.

Why is this concept so hard to grasp for JS people?