Как установить заголовок с модулем Ax ios и vuejs в nuxt

Question

Я пытаюсь определить заголовок «Accept-Language» для моего SPA в vue. js (с nuxt ).

Вот что я пробовал, но это не работает. Я указываю, что я использую модуль ax ios для nuxt .

Я создал плагин как , объясненный в документации . Я включил плагин в nuxt.config. js.

Я пытался использовать setHeader, как объяснено здесь , но он не работает.

export default function ({ store, $axios, redirect }) {
  $axios.setBaseURL(process.env.BASE_URL);

  if (process.server) {
    return
  }

  $axios.onRequest(config => {
    const baseUrl = $axios.defaults.baseURL;

    const locale = store.getters['lang/locale'];

    if (locale) {
      $axios.setHeader('Accept-Language', locale)
    }
  });
}

Но этот код не работает. Однако, когда я делаю console.log, я вижу их, поэтому это учитывается.

Answer 1

Используйте $ ax ios .interceptors вместо $ ax ios .onRequest

export default function({store, $axios, redirect}) {
        $axios.setBaseURL(process.env.BASE_URL);
        if (process.server) {
            return
        }
        $axios.interceptors.request.use((config) => {

            const baseUrl = $axios.defaults.baseURL;

            const locale = store.getters['lang/locale'];

            if (locale) {
                $axios.setHeader('Accept-Language', locale)
            }
            return config;
        });
    }

Answer 2

как вы делаете запрос? Если вы хотите использовать хелперы (setHeader, setToken, ...), предоставляемые @ nuxtjs / ax ios, вы должны всегда использовать хелперы запросов, предоставленные им, которые являются просто строчными именами http-методов с префиксом $

Вместо $axios.get( ... ) используйте $axios.$get( ... ) и т. Д. Для put, post, delete ...

Вы также можете попробовать установить заголовки следующим образом:

$axios.onRequest(config => {
    const baseUrl = $axios.defaults.baseURL;

    const locale = store.getters['lang/locale'];

    if (locale) {
        config.headers.common['Accept-Language'] = locale;
    }
});