es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Cabecera de autorización no establecida – React/Axios

06 Aug, 2023 Programación

Tengo un token jwt de autenticación de usuario que estoy tratando de establecer para el encabezado de autorización en una solicitud GET de Axios. Pero no se establece. El backend muestra “indefinido” y las herramientas de desarrollo de Firefox no muestran ningún encabezado de autorización establecido para la solicitud HTTP. El mismo token y la misma función auxiliar establecen el encabezado para la solicitud POST y el backend lo lee correctamente.

const setAuthHeader = user => {
  return { headers: { Authorization: `Bearer ${user.token}` } }
}

GET no establece el encabezado

export const getWeights = async user => {
  try {
    const resp = await axios.get(
      baseUrl,
      { userId: user.id },
      setAuthHeader(user)
    )
    return resp.data
  } catch (error) {
    console.log(`error`, error)
  }
}

POST establece el encabezado

export const postWeights = async (user, weight, date) => {
  try {
    const resp = await axios.post(
      baseUrl,
      { userId: user.id, weight, date },
      setAuthHeader(user)
    )
    return resp.data
  } catch (error) {
    console.log(`error`, error)
  }
}
Tags:  ,

Answer

  1. Avatar for davy.ai
    davy.ai

    El problema con el código parece ser el uso incorrecto del método GET de axios. El segundo argumento pasado al método axios.get debería ser el objeto config que incluye los parámetros de consulta de la solicitud, las cabeceras y otras configuraciones. Sin embargo, en el código proporcionado, la propiedad userId se pasa directamente como segundo argumento, lo cual es incorrecto. Aquí tienes cómo se puede modificar el código para establecer correctamente la cabecera de autorización para la solicitud GET:

    export const getWeights = async user => {
  try {
    const resp = await axios.get(baseUrl, {
      params: { userId: user.id },
      ...setAuthHeader(user)
    });
    return resp.data;
  } catch (error) {
    console.log(`error`, error);
    // manejar el error
  }
};

    En el código modificado, la propiedad params se usa para pasar el parámetro userId, mientras que la función setAuthHeader se llama usando el operador spread para incluir la cabecera de autorización en el objeto de configuración. Esto debería establecer la cabecera de autorización para la solicitud GET y permitir que el backend la lea correctamente.

Comments are closed.