{"id":7767,"date":"2022-07-22T06:34:23","date_gmt":"2022-07-22T06:34:23","guid":{"rendered":"https:\/\/www.jose-aguilar.com\/blog\/?p=7767"},"modified":"2022-07-22T06:34:23","modified_gmt":"2022-07-22T06:34:23","slug":"todo-lo-que-necesitas-saber-sobre-xmlhttprequest","status":"publish","type":"post","link":"https:\/\/www.jose-aguilar.com\/blog\/todo-lo-que-necesitas-saber-sobre-xmlhttprequest\/","title":{"rendered":"Todo lo que necesitas saber sobre XMLHttpRequest"},"content":{"rendered":"

XMLHttpRequest<\/strong> es un objeto nativo del navegador que permite hacer solicitudes HTTP desde JavaScript<\/strong>.<\/p>\n

Con este objeto puedes cargar y descargar cualquier tipo de archivo pero tambi\u00e9n se puede utilizar para conseguir otras metas.<\/p>\n

Se que hoy en d\u00eda hay otro m\u00e9todo m\u00e1s moderno que hace que el objeto XMLHttpRequest<\/strong> se quede obsoleto pero te voy a explicar 3 razones por las que XMLHttpRequest<\/strong> todav\u00eda se utiliza y no debes dejar de aprender su uso o al menos conocer su existencia.<\/p>\n

XMLHttpRequest<\/strong> se usa por tres razones:<\/p>\n

    \n
  1. Existen infinidad de scripts existentes que usan XMLHttpRequest<\/strong>.<\/li>\n
  2. Mantener el funcionamiento de aplicaciones en navegadores antiguos.<\/li>\n
  3. Rastreo del progreso de la subida de archivos.<\/li>\n<\/ol>\n

    Si algunos de estos motivos tiene mucho peso para ti, usa XMLHttpRequest<\/strong> sin duda.<\/p>\n

    De lo contrario, te recomiendo usar la t\u00e9cnica m\u00e1s moderna \u00abfetch\u00bb de la que pronto hablar\u00e9 en este blog.<\/p>\n

    Creaci\u00f3n de las instancia<\/h2>\n

    Puedes crear una instancia del objeto as\u00ed:<\/p>\n

    <\/a>Source code<\/a><\/td><\/a> <\/a> <\/a> <\/td><\/tr><\/table><\/div>
    const<\/span> request =<\/span> new<\/span> XMLHttpRequest(<\/span>)<\/span>;<\/span><\/pre><\/div><\/div>\n
    Es una llamada sencilla sin par\u00e1metros, ya que, el constructor no tiene argumentos.<\/p>\n
    M\u00e9todos principales<\/h2>\n
    Lo primero que se suele hacer, justo despu\u00e9s de crear la instancia del objeto es inicializarlo con la funci\u00f3n:<\/p>\n
    <\/a>Source code<\/a><\/td><\/a> <\/a> <\/a> <\/td><\/tr><\/table><\/div>
    request.open<\/span>(<\/span>method,<\/span> URL,<\/span> [<\/span>async,<\/span> user,<\/span> password]<\/span>)<\/span><\/pre><\/div><\/div>\n
    Este m\u00e9todo open() especifica los par\u00e1metros principales para la petici\u00f3n:<\/p>\n