Llamada AJAX con fetch() desde el frontend

Permite enviar y recibir datos del servidor WordPress sin recargar la página, usando la API fetch() nativa del navegador. Es la alternativa moderna a jQuery AJAX.

Casos de uso: cargar más entradas al hacer scroll, enviar formularios sin recargar, actualizar el carrito de WooCommerce, sistemas de votación o favoritos.

// Llamada AJAX usando fetch() nativo (sin jQuery)
document.querySelector('#mi-boton').addEventListener('click', async function() {

    const response = await fetch(miPlugin.ajaxurl, {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        body: new URLSearchParams({
            action: 'mi_accion',
            nonce:  miPlugin.nonce,
            id:     123
        })
    });

    const data = await response.json();

    if (data.success) {
        console.log(data.data.mensaje);
    } else {
        console.error('Error:', data.data);
    }
});

• miPlugin.ajaxurl — URL del endpoint AJAX de WordPress, pasada desde PHP con wp_localize_script().
• miPlugin.nonce — Token de seguridad generado con wp_create_nonce() para verificar la petición.
• action — Nombre de la acción que WordPress usará para encontrar el callback PHP registrado con add_action('wp_ajax_mi_accion').
• data.success — WordPress devuelve true o false según si el callback llamó a wp_send_json_success() o wp_send_json_error().