Uso de Ajax en aplicaciones web con Python

Uso de Ajax en aplicaciones web con Python

Introducción

Ajax, o Asynchronous JavaScript and XML, es una técnica que permite actualizar el contenido de una página web sin necesidad de recargarla por completo. Esto se logra mediante la realización de peticiones al servidor web en paralelo utilizando código JavaScript.

Ajax es una herramienta muy útil para mejorar la experiencia de usuario de las aplicaciones web. Permite, por ejemplo, realizar búsquedas en tiempo real, actualizar datos en tiempo real, o mostrar notificaciones sin necesidad de recargar la página.

Cómo funciona Ajax

Ajax funciona mediante la creación de un objeto XMLHttpRequest en JavaScript. Este objeto permite realizar peticiones al servidor web de forma asíncrona.

El proceso de una petición Ajax se puede dividir en los siguientes pasos:

  1. El usuario realiza una acción en la página web, como por ejemplo, hacer clic en un botón o escribir en un campo de texto.
  2. El código JavaScript crea un objeto XMLHttpRequest.
  3. El objeto XMLHttpRequest realiza la petición al servidor web.
  4. El servidor web procesa la petición y envía una respuesta al cliente.
  5. El objeto XMLHttpRequest recibe la respuesta del servidor web.
  6. El código JavaScript procesa la respuesta del servidor web y actualiza el contenido de la página web.

Uso de Ajax en Python

Para utilizar Ajax en Python, podemos utilizar la librería requests. Esta librería proporciona una API sencilla para realizar peticiones HTTP.

Para realizar una petición Ajax con requests, podemos utilizar el método get() o post(). El método get() se utiliza para realizar peticiones HTTP GET, mientras que el método post() se utiliza para realizar peticiones HTTP POST.

Por ejemplo, el siguiente código realiza una petición Ajax para obtener una lista de usuarios:

Python
import requests

def get_users():
    response = requests.get("https://api.example.com/users")
    return response.json()

users = get_users()

Este código devolverá una lista de objetos JSON que representan a los usuarios.

Ejemplo de aplicación web con Ajax

Para ver un ejemplo de cómo utilizar Ajax en una aplicación web con Python, podemos crear una aplicación simple para buscar usuarios.

La aplicación tendrá dos páginas:

  • Una página de inicio que mostrará un cuadro de texto para buscar usuarios.
  • Una página de resultados que mostrará una lista de usuarios que coincidan con la consulta de búsqueda.

La página de inicio tendrá el siguiente código:

Python
import requests

def search_users(query):
    response = requests.get("https://api.example.com/users", params={"q": query})
    return response.json()

def render_page(query):
    users = search_users(query)
    return render(template="index.html", users=users)

@app.route("/")
def index():
    query = request.args.get("q")
    return render_page(query)

Este código crea una función search_users() que realiza una petición Ajax para obtener una lista de usuarios que coincidan con la consulta de búsqueda.

La función render_page() renderiza la página de resultados. Esta función recibe una lista de usuarios como parámetro.

La página de resultados tendrá el siguiente código:

HTML
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Buscar usuarios</title>
</head>
<body>
    <h1>Buscar usuarios</h1>
    <form action="/" method="GET">
        <input type="text" name="q" placeholder="Consulta de búsqueda">
        <input type="submit" value="Buscar">
    </form>
    <ul>
        {% for user in users %}
            <li>{{ user.name }}</li>
        {% endfor %}
    </ul>
</body>
</html>

Este código muestra un cuadro de texto para buscar usuarios. Cuando el usuario hace clic en el botón «Buscar», la aplicación realiza una petición Ajax para obtener una lista de usuarios que coincidan con la consulta de búsqueda.

Si el usuario escribe «Juan» en el cuadro de texto, la aplicación devolverá una lista de usuarios cuyo nombre sea «Juan».

Conclusión

Ajax es una herramienta muy útil para mejorar la experiencia de usuario de las aplicaciones web. Permite realizar actualizaciones del contenido de una página web sin necesidad de recargarla por completo.

En este tutorial, hemos visto cómo utilizar Ajax en aplicaciones web con Python. Hemos visto cómo crear una petición Ajax, cómo