AJAX в плагине wp_send_json() для отправки HTML

На чтение 3 мин Опубликовано 03.10.2024

Содержание

Вопрос или проблема
Ответ или решение
JavaScript (jQuery)
PHP
Важные моменты

Вопрос или проблема

Я написал плагин, который вызывает функцию PHP из JQuery, и PHP отправляет ответ в формате JSON обратно в JQuery с помощью wp_send_json(). Функции вызываются успешно, но каждый раз JSON-запрос отправляет много HTML в функцию JQuery. Как сделать так, чтобы JSON, отправляемый функцией PHP, содержал только конкретное сообщение?

JQUERY:

jQuery( document ).ready( function() {

        jQuery( 'body' ).on( 'click', '.wpm_mail_link', function( e ) {

            var varData="name:foobar&[email protected]";      

      jQuery.ajax({
        type: "POST",
        action: "wp_ajax_send_email",
        url: my_ajax_obj.ajax_url,
        data: varData,
        success: function(data) {
          console.log('Ajax-запрос успешен');
          console.log(data.message);
        }
      });



        });

});

PHP:

    public function send_email() {
        $response = array(
        'message' => 'Отправлено',
        'ID'      => 1,
    );

    wp_send_json( $response );
    }

Исправил! У меня возникла ложная срабатывание с Ajax-запросом. Я думал, что все проходит, но возвращает ‘undefined’, но на самом деле я использовал неправильный URL.

Ответ или решение

Для решения проблемы с получением ненужного HTML в ответ на AJAX-запрос, который отправляет JSON, вам необходимо правильно настроить ваш AJAX-запрос и обработчик на стороне PHP. В вашем случае вы уже достигли успеха в использовании wp_send_json(), чтобы возвращать нужные данные в формате JSON.

Но давайте удостоверимся, что всё настроено должным образом:

JavaScript (jQuery)

Убедитесь, что ваш AJAX-запрос отправляется правильно:

jQuery(document).ready(function() {
    jQuery('body').on('click', '.wpm_mail_link', function(e) {
        e.preventDefault(); // Это предотвратит переход по ссылке

        var varData = {
            name: 'foobar',
            email: jQuery(this).data('email') // Предполагаем, что адрес электронной почты хранится в data-атрибуте
        };

        jQuery.ajax({
            type: "POST",
            url: my_ajax_obj.ajax_url,
            data: {
                action: "send_email",
                data: varData
            },
            success: function(data) {
                console.log('Ajax request successful');
                console.log(data.message);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error('AJAX error: ', textStatus, errorThrown);
            }
        });
    });
});

PHP

На стороне сервера убедитесь, что ваш обработчик AJAX настроен и регистрируется правильно. Убедитесь, что вы добавили соответствующий хук для регистрации вашего AJAX-обработчика:

add_action('wp_ajax_send_email', 'send_email');
add_action('wp_ajax_nopriv_send_email', 'send_email'); // Если вы хотите, чтобы неавторизованные пользователи также могли отправлять запрос

function send_email() {
    // Обрабатывайте входные данные здесь, если это необходимо
    // Например, можно использовать sanitize_text_field() для очистки данных

    $response = array(
        'message' => 'Sent',
        'ID'      => 1,
    );

    wp_send_json($response); // Отправляем ответ в JSON формате
    wp_die(); // Завершаем выполнение
}

Важные моменты

URL для AJAX: Убедитесь, что my_ajax_obj.ajax_url правильно определен в вашем скрипте. Обычно он устанавливается так:
```
wp_localize_script('your-script-handle', 'my_ajax_obj', array('ajax_url' => admin_url('admin-ajax.php')));
```
Структура данных: Правильно структурируйте данные, которые вы отправляете на сервер. В вашем случае varData должно представлять собой объект или массив, чтобы избежать ошибок.
Отладка: Если всё равно получаете нежелательный HTML, вам стоит проверить, не выводит ли что-то сторонний код в обработчике send_email(). Используйте функцию wp_die() в конце вашего AJAX-обработчика, чтобы гарантировать, что ничего лишнего не выводится.

Следуя вышеуказанным рекомендациям, вы сможете гарантировать корректную передачу данных через AJAX и настройку вашего плагина без лишнего HTML в ответах.