03-Solicitud a un servidor

El objeto XMLHttpRequest se utiliza para solicitar datos de un servidor.

Enviar una solicitud a un servido

Para enviar una solicitud a un servidor usamos el metodo open y send del objecto XMLHttpRequest

Ejemplo con codigo

        xhttp.open("GET", "ajax_info.txt", true);
        xhttp.send();
    

...

Metodo	Desscripcion
open(method, url, async)	Especifica el tipo de solicitud. método: el tipo de solicitud: GET o POST url: la ubicación del servidor (archivo) async: verdadero (asincrónico) o falso (sincrónico)
send()	Envía la solicitud al servidor (usado para GET)
send(string)()	Envía la solicitud al servidor (usado para POST)

La url - Un archivo en un servidor

El parámetro de URL del open()método, es una dirección a un archivo en un servidor:

Ejemplo con codigo

xhttp.open("GET", "ajax_test.asp", true);

El archivo puede ser cualquier tipo de archivo, como .txt y .xml, o archivos de secuencias de comandos del servidor como .asp y .php (que pueden realizar acciones en el servidor antes de devolver la respuesta).

Asíncrono: ¿verdadero o falso?

Las solicitudes del servidor deben enviarse de forma asíncrona.

El parámetro asíncrono de open() El método debe establecerse en verdadero:

Codigo del ejemplo

xhttp.open("GET", "ajax_test.asp", true);

Al enviar de forma asíncrona, el JavaScript no tiene que esperar la respuesta del servidor, sino que puede:

• ejecutar otros scripts mientras espera la respuesta del servidor
• tratar la respuesta después de que la respuesta esté lista

• El valor predeterminado para el parámetro async es async = true.
• Puede eliminar con seguridad el tercer parámetro de su código.
• No se recomienda XMLHttpRequest síncrono (async = false) porque JavaScript deja de ejecutarse hasta que la respuesta del servidor esté lista. Si el servidor está ocupado o lento, el la aplicación se colgará o se detendrá.

OBTENER o PUBLICAR?

GET es más simple y rápido que POST, y se puede utilizar en la mayoría de los casos.

Sin embargo, siempre use solicitudes POST cuando:

• Un archivo en caché no es una opción (actualizar un archivo o base de datos en el servidor).
• Enviar una gran cantidad de datos al servidor (POST no tiene limitaciones de tamaño).
• Al enviar la entrada del usuario (que puede contener caracteres desconocidos), POST es más sólido y seguro que GET.

OBTENER solicitudes

Un pedido GET

Codigo del ejemplo

xhttp.open("GET", "demo_get.asp"); xhttp.send();

En el ejemplo anterior, puede obtener un resultado almacenado en caché. Para evitar esto, agregue una ID única a la URL:

Codigo del ejemplo

xhttp.open("GET", "demo_get.asp?t=" + Math.random()); xhttp.send();

Si desea enviar información con el GETmétodo, agregue la información a la URL:

Codigo del ejemplo

xhttp.open("GET", "demo_get2.asp?fname=Henry&lname=Ford"); xhttp.send();

Cómo el servidor usa la entrada y cómo responde el servidor a una solicitud, se explica en un capítulo posterior.

Solicitudes POST

Un simples pedido POST

Codigo del ejemplo

xhttp.open("POST", "demo_post.asp"); xhttp.send();

Para enviar datos como un formulario HTML, agregue un encabezado HTTP con setRequestHeader(). Especifique los datos que desea enviar en el send() método:

Ejemplo del codigo

xhttp.open("POST", "ajax_test.asp"); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhttp.send("fname=Henry&lname=Ford");

Metodo	Description
setRequestHeader(header, value)	Agrega encabezados HTTP a la solicitud header: especifica el nombre del encabezado value: especifica el valor del encabezado

Solicitud síncrona

Para ejecutar una solicitud síncrona, cambie el tercer parámetro en el open()método para false:

ejemplo con codigo

xhttp.open("GET", "ajax_info.txt", false);

A veces, async = false se usa para pruebas rápidas. también encontrarás solicitudes sincrónicas en código JavaScript antiguo.

Dado que el código esperará a que se complete el servidor, no hay necesidad de una función onreadystatechange:

Codigo del ejemplo

xhttp.open("GET", "ajax_info.txt", false); xhttp.send(); document.getElementById("demo").innerHTML = xhttp.responseText;

No se recomienda XMLHttpRequest síncrono (async = false) porque JavaScript deja de ejecutarse hasta que la respuesta del servidor esté lista. Si el servidor está ocupado o lento, el la aplicación se colgará o se detendrá.

Se alienta a las herramientas de desarrollo modernas a advertir sobre el uso solicitudes síncronas y puede lanzar una excepción InvalidAccessError cuando ocurre.

Ir al indice

---