Para habilitar o envio de cookies em aplicações Vue.js, é necessário configurar algumas opções específicas. A abordagem mais recomendada é utilizar o Axios, um cliente HTTP popular para JavaScript.

Configuração Básica com Axios Prmieiramente, importe e configure o Axios no seu arquivo principal (geralmente main.js):

import axios from 'axios'

axios.defaults.withCredentials = true; // Permite que as requisições AJAX carreguem cookies

Vue.prototype.$http = axios;

Com essa configuração, todas as requisições feitas através do Axios incluirão os cookies necessários para autenticação.

Solução Alternativa com JavaScript Nativo Se você prefere usar requisições nativas, adicione a seguinte configuração:

xhrFields: {  
  withCredentials: true  
}

Essa abordagem é útil quando você precisa de controle mais granular sobre as requisições HTTP.

Configuração Específica para Vue Resource Ao utilizar o Vue Resource, existem duas opções importantes:

vue.http.options.xhr = { withCredentials: true }; // Permite requisições cross-domain com cookies
vue.http.options.emulateJSON = true; // Converte requisições para application/x-www-form-urlencoded

A opção emulateJSON é útil quando o servidor não processa requisições aplpication/json.

Implementação de Requisições GET com Cookies Para garantir que as requisições GET incluam cookies, podemos criar uma função wrapper:

const realizarGet = (url, callback) => {
  let resultado = null;
  Vue.http.get(url, { credentials: true }).then((resposta) => {
    if (resposta.ok) {
      resultado = resposta.body;
      callback(1, resultado);
    } else {
      callback(0, resultado);
    }
  }, (erro) => {
    if (erro) {
      callback(0, resultado);
    }
  });
};

Essa função garante que as requisições GET sempre incluirão os cookies necessários.

Implementação de Requisições POST com Cookies As requisições POST exigem uma abordagem diferente. Utilizamos interceptors para modificar as requisições antes de serem enviadas:

Vue.http.interceptors.push((requisicao, proximo) => {
  requisicao.credentials = true;
  proximo();
});

Com esse interceptor, todas as requisições POST incluirão cookies. Podemos então criar uma função wrapper para requisições POST:

const realizarPost = (url, parametros, opcoes, callback) => {
  let resultado = null;

  if (typeof opcoes === 'function' && arguments.length <= 3) {
    callback = opcoes;
    opcoes = {};
  }
  
  Vue.http.interceptors.push((requisicao, proximo) => {
    requisicao.credentials = true;
    proximo();
  });
  
  Vue.http.post(url, parametros, opcoes).then((resposta) => {
    if (resposta.ok) {
      resultado = resposta.body;
      callback(1, resultado);
    } else {
      callback(0, resultado);
    }
  }, (erro) => {
    if (erro) {
      callback(0, resultado);
    }
  });
};

Essa implementação garante que tanto GET quanto POST incluam cookies nas requisições, permitindo uma autenticação adequada em aplicações Vue.js.

É importante lembrar que o servidor também deve estar configurado para aceitar requisições com credentials, definindo o cabeçalho Access-Control-Allow-Credentials como true.