Para hacer peticiones a un servidor remoto con JavaScript desde el navegador podemos usar la API Fetch. fetch() tiene el mismo objetivo que XMLHttpRequest pero su uso es más sencillo y además usa Promises.

Veamos un ejemplo rápido:

fetch('/url')
  .then(response => response.json())
  .then(data => console.log(data));

Llamamos la función fetch y le pasamos la url o path a la que se realizará la petición. La respuesta que obtenemos es un objeto Stream, por lo que al llamar el método json(), devuelve otra Promise de forma asíncrona y luego lo mostramos por pantalla.

Opciones de fetch

El método fetch permite pasarle un segundo parámetro donde podemos definir múltiples opciones, los más importantes:

• method: El tipo de llamada, por defecto GET, pero podemos usar POST, PUT, DELETE, etc.
• body: Datos que podemos enviar juto a la petición principalmente string, FormData, Blob, BufferSource o URLSearchParams.
• headers: Encabezamientos el servidor puede esperar, el más común Content-Type.

Compatibilidad con navegadores

fetch sirve en todos los navegadores modernos, pero si quieres vere una lista exhaustiva de los naveegadores soportados y las versiones requeridas puedes visitar la página de Mozilla sobre fetch.