0
151
Vistasestablecer token recibido de api en el encabezado axios
Envío una solicitud a la API para crear una cuenta (uso axios), luego la API me envía una respuesta que involucra un token. Guardo este token en el almacenamiento local. Pero no sé cómo enviarlo en el encabezado de axios.
if (this.sendRequest) { axios.post(url, data) .then((res) => { if (res.data.type === "success") { localStorage.setItem("token",res.data.data); } }) .catch((err) => this.msg.push("error" + err.response.status)); }1 Respuestas
Responde la pregunta0
Para hacer esto, siga los pasos a continuación:
1- crea una carpeta en tu proyecto llamada Servicios. Luego cree otro directorio en esa carpeta llamado Config. Dentro de esa carpeta, cree un archivo .js llamado auth-axios.js de la siguiente manera: 
En este archivo, utiliza el siguiente código. Al hacer esto, le informa a la aplicación que cada vez que desee llamar a la API, debe pasar por este puerto y debe configurar la URL base y el encabezado en la API automáticamente:
import axios from "axios"; import authService from "../modules/authService"; import Vue from "vue"; const headers = { "content-type": "application/json", Accept: "application/json", "Accept-Language": "fa", version: "1000" }; const API_V1 = axios.create({ baseURL: process.env.VUE_APP_BASE_URL_V1, headers: headers }); const API_DEV = axios.create({ baseURL: process.env.VUE_APP_BASE_URL_DEV, headers: headers }); API_DEV.interceptors.request.use( config => { const token = authService.getAccessToken(); if (token) { config.headers["Authorization"] = "Bearer " + token; } return config; }, error => { Promise.reject(error); } ); export { API_V1, API_V4, API_DEV };Ahora, para los servicios que tiene en la aplicación, debe crear un archivo separado en el mismo directorio de servicios y usar la variable API_1 en ese archivo.
por ejemplo, cree accountServices.js y en este archivo llame a la API de esta manera:
import { API_V1 } from "../config/auth-axios"; class employerServices { createAccount(body) { return API_V1.post("test-API-URL", body); } } export default new employerServices();