Sobes.tech
Junior

¿Qué acepta el método fetch?

sobes.tech AI

Respuesta de la IA

El método fetch acepta un argumento obligatorio — la ruta de la solicitud (RequestInfo o URL) — y un argumento opcional — un objeto de configuración (RequestInit).

Argumento obligatorio (input):

  • Cadena: URL del recurso.
  • Objeto Request: Instancia de la clase Request, que proporciona una configuración más flexible de la solicitud (cabeceras, método, etc.).

Argumento opcional (init): Un objeto con campos que describen la configuración de la solicitud. Algunos campos comúnmente utilizados:

  • method: Método HTTP de la solicitud (GET, POST, PUT, DELETE, OPTIONS, etc.).
  • headers: Cabeceras de la solicitud. Puede ser un objeto clave-valor o una instancia de la clase Headers.
  • body: Cuerpo de la solicitud (para métodos distintos de GET o HEAD). Puede ser una cadena, ArrayBuffer, TypedArray, DataView, Blob, FormData, URLSearchParams o ReadableStream.
  • mode: Modo de la solicitud (cors, no-cors, same-origin, navigate).
  • credentials: Configuración para enviar credenciales (omit, same-origin, include).
  • cache: Configuración de caché (default, no-store, reload, no-cache, force-cache, only-if-cached).
  • redirect: Cómo manejar las redirecciones (follow, error, manual).
  • referrer: Valor para la cabecera Referer.
  • referrerPolicy: Política para enviar la cabecera Referer.
  • integrity: Valor para la cabecera Integrity. Se usa para la integridad de recursos subyacentes.
  • keepalive: Valor booleano que indica que la solicitud debe mantenerse activa después de que la página se cierre (para enviar análisis o informes).
  • signal: Instancia de AbortSignal para cancelar la solicitud.
  • window: Objeto Window asociado a la solicitud (por defecto, la ventana actual).

Ejemplo de uso:

// Solicitud GET
fetch('/api/users')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

// Solicitud POST con cuerpo y cabeceras
fetch('/api/products', {
  method: 'POST', // Método HTTP
  headers: {
    'Content-Type': 'application/json', // Tipo de datos enviados
    'Authorization': 'Bearer your_token' // Ejemplo de cabecera de autorización
  },
  body: JSON.stringify({ name: 'Nuevo producto', price: 100 }) // Cuerpo de la solicitud
})
  .then(response => {
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }
    return response.json();
  })
  .then(data => console.log('Éxito:', data))
  .catch(error => console.error('Error:', error));