Qué es ajax
request.send();Eso es bastante código para una operación bastante simple. Como es lógico, los desarrolladores no tardaron en crear bibliotecas para simplificar el caso común. La más utilizada fue el método .getJSON() que se añadió a la popular biblioteca jQuery. Sustituyó el código anterior por esto://suponiendo que la librería jQuery ha sido añadida a la página…
<script src=”js/app.js”></script>Solicitudes asíncronas y promesasDebido a que las solicitudes HTTP se realizan de forma asíncrona, la función fetch() devuelve un objeto conocido como promesa. Una Promesa representa una operación asíncrona que eventualmente se completará con éxito o fallará. Una Promise permite a los desarrolladores añadir funciones que deben ser llamadas cuando cualquiera de esas condiciones ocurra. Son como los escuchadores de eventos, excepto que sólo hay dos eventos: éxito (también conocido como resolver), y fracaso (también conocido como rechazar). Así que el objeto Promise proporciona dos métodos diferentes, uno para registrar un oyente de éxito (.then()), y otro para registrar un oyente de fallo (.catch()).Para obtener una URL, llama a la función fetch() pasando la URL que quieres obtener. Esta función devuelve una promesa, que puedes utilizar para registrar una función de devolución de llamada que se invocará cuando el servidor responda:var promise = fetch(“/mi/data/url”);
Js post ajax request
La funcionalidad de Ajax está contenida en el objeto global Ajax. El transporte para las peticiones Ajax es XmlHttpRequest, con las diferencias del navegador abstraídas de forma segura del usuario. Las peticiones reales se realizan creando instancias del objeto Ajax.Request.
Recuerde que por razones de seguridad (es decir, para prevenir ataques de scripting entre sitios), las peticiones Ajax sólo pueden hacerse a URLs del mismo protocolo, host y puerto de la página que contiene la petición Ajax. Algunos navegadores pueden permitir URLs arbitrarias, pero no deberías confiar en su soporte.
También están disponibles las devoluciones de llamada onXXX, donde XXX es el estado de la respuesta HTTP, como 200 o 404. Ten en cuenta que, cuando uses estos, tus onSuccess y onFailure no se dispararán porque onXXX tiene prioridad, por lo que usarlos significa que sabes lo que estás haciendo.
Puedes usar parámetros tanto con peticiones GET como POST. Sin embargo, ten en cuenta que las peticiones GET a tu aplicación nunca deberían provocar cambios en los datos. Además, es menos probable que los navegadores almacenen en caché una respuesta a una petición POST, pero es más probable que lo hagan con GET.
El Ajax consigue
¿Qué debe hacer esta función? Primero, la función necesita comprobar el estado de la petición. Si el estado tiene el valor de XMLHttpRequest.DONE (correspondiente a 4), eso significa que se recibió la respuesta completa del servidor y que está bien que se siga procesando.
A continuación, compruebe los códigos de estado de la respuesta HTTP. Los posibles códigos están listados en el W3C. En el siguiente ejemplo, diferenciamos entre una llamada AJAX exitosa y una no exitosa al comprobar un código de respuesta 200 OK.
Nota: Si no se establece la cabecera Cache-Control: no-cache, el navegador guardará la respuesta en la caché y no volverá a enviar la solicitud, lo que dificulta la depuración. También puede añadir un parámetro GET siempre diferente, como una marca de tiempo o un número aleatorio (ver saltarse la caché)
Nota: Si la variable httpRequest se utiliza globalmente, las funciones que compiten entre sí llamando a makeRequest() pueden sobrescribirse unas a otras, causando una condición de carrera. Declarar la variable httpRequest localmente a un cierre que contenga las funciones AJAX evita esto.
Ejemplo de Ajax
AJAX se convirtió entonces en un estándar web aprobado por el W3C. Como resultado, los desarrolladores ahora pueden usar las APIs de AJAX en cualquier navegador estándar para obtener contenido JSON, XML, HTML o cadenas crudas en páginas web a través del protocolo HTTP.
En este tutorial, demostraré varios enfoques para manejar las solicitudes AJAX en sus aplicaciones React Native con ejemplos prácticos. Además, explicaré cómo manejar los errores de AJAX y las latencias de la red de una manera fácil de usar.
Empecemos identificando las posibles formas de hacer peticiones AJAX en React Native – luego, podemos probarlas prácticamente con ejemplos. Podemos llamar a estas bibliotecas de clientes HTTP o APIs ya que ambas nos ayudan a comunicarnos con un servidor utilizando el protocolo HTTP.
En 2015, la API Fetch se presentó como un sucesor moderno de la conocida API XMLHttpRequest heredada. Fetch ofrece una interfaz moderna basada en promesas para enviar solicitudes AJAX con muchas configuraciones HTTP, como métodos HTTP, cabeceras, cargas útiles, etc. No es necesario un polyfill de terceros para utilizar Fetch en React Native, ya que es una función preincluida en el framework de React Native.
