Add language locale to API endpoint instead of locale suffix

Support
1

I am using Cockpit in combination with Nuxt pre-render to asynchronously fetch data and generate static html files. Now I am trying to find an elegant way to prerender multi-language content. Currently I am fetching my data with axios and render the relevant endpoint depending on locales managed by nuxt-i18n module:

Fetching data from Cockpit:

  asyncData ( { $axios } ) {
return $axios.get(`/api/singletons/get/myData?token=XXX`)
.then((res) => {
  return { data: res.data }
})}

And render the html depending on locale:

<div>{{ data['myEndpoint_'+this.$i18n.locale] }}</div>

The upper solution is working but way too inefficient. It would be nice to have something like this instead:

      asyncData ( { $axios } ) {
return $axios.get(`/api/singletons/get/myData/'+this.$i18n.locale+'/?token=XXX`)
.then((res) => {
  return { data: res.data }
})}

For that I need Cockpit to add localized fields at the end of particular colletions/singletons, e.g.:

/myData/myEndpoint_en ==> /myData/en/myEndpoint

Is this possible with a custom cockpit addon?

2

I don’t know, how Nuxt or axios work, but what about simply adding &lang=en to the url?

return $axios.get('/api/singletons/get/myData/?token=XXX&lang='+this.$i18n.locale)

1 Like
4

Yep that worked. Thank you for the simple way :slight_smile: