Nuxt 前端获取浏览器语言并获取对应信息

使用 Nuxt 提供的 $axios 对象可以方便地获取浏览器语言信息，并根据语言信息获取对应的数据。具体实现步骤如下：

配置 $axios 对象 在 nuxt.config.js 文件中配置 $axios 对象，用于发送请求：

export default {
  modules: [
    '@nuxtjs/axios'
  ],
  axios: {
    // axios 配置
  }
}

在页面组件中获取浏览器语言信息 在页面组件中使用 asyncData 方法获取浏览器语言信息并发送请求：

export default {
  asyncData({ $axios }) {
    const language = navigator.language || navigator.userLanguage;
    const res = await $axios.$get(`api/getLanguageInfo?language=${language}`);
    return { languageInfo: res };
  }
}

其中，navigator.language || navigator.userLanguage 用于获取浏览器语言信息，$axios.$get 方法用于发送 GET 请求，获取对应语言的信息。最后将获取到的信息通过 asyncData 方法返回给页面组件即可。

注意: 在服务器端渲染时，navigator 对象是不存在的，因此需要在浏览器端获取浏览器语言信息。