Выполнение ajax-запроса с другого домена

Содержание

Вопрос или проблема
Ответ или решение
Шаг 1: Использование функции echo вместо return
Пример исправления кода:
Шаг 2: Изучение REST API WordPress
Пример использования REST API:
Шаг 3: Проверка кросс-доменных запросов
Шаг 4: Пример AJAX-запроса
Заключение

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

Я делаю ajax-запрос с моего основного домена на поддомен. Я решил свои проблемы с кросс-доменными запросами, поэтому ошибок нет. Ответ возвращает data:0. Я проверил конфигурацию ответа, ajax-URL правильный, как и “action”. Мой functions.php выглядит так:

add_action("wp_ajax_sendhire", "sendhire");
add_action("wp_ajax_nopriv_sendhire", "sendhire");

function sendhire() {

    $cars = array("Volvo", "BMW", "Toyota");
    return json_encode($cars);
    die();

}

Данные, очевидно, предназначены только для тестирования.

Если вы хотите использовать Admin-Ajax для вывода содержимого, вам следует использовать echo вместо этого. Ничего не будет видно, когда вы используете return, поэтому вы получите 0.

Это цитата из кодекса, которая объясняет дальнейшие детали о ответе 0:

Если ajax-запрос не удался в wp-admin/admin-ajax.php, ответ будет -1 или 0, в зависимости от причины сбоя. Кроме того, если запрос успешен, но действие Ajax не соответствует хуку WordPress, определенному с помощью add_action('wp_ajax_(action)', ...) или add_action('wp_ajax_nopriv_(action)', ...), то admin-ajax.php ответит 0.

Теперь, если вы собираетесь выводить JSON-ответ, вам стоит обратить внимание на REST API. Его тип ответа по умолчанию – JSON.

Для этого зарегистрируйте путь для конечной точки и создайте функцию обратного вызова:

add_action( 'rest_api_init', function () {
    register_rest_route( 'dcp3450', '/test_endpoint/', array(
            'methods' => 'GET', 
            'callback' => 'sendhire' 
    ) );
});

function sendhire() {

    $cars = array("Volvo", "BMW", "Toyota");
    return $cars;

}

Теперь, обращаясь к http://example.com/wp-json/dcp3450/test_endpoint/, вы получите ваш JSON-ответ, и сможете избавиться от этого неприятного 0, который преследует человечество до конца.

У WordPress есть очень полезный API (REST API) для этой работы, вы можете использовать его вместо отправки ajax-запроса. Вот документация, посмотрите, пожалуйста https://developer.wordpress.org/rest-api/

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

Когда вы делаете AJAX-запрос с одного домена на поддомен в WordPress, важно учитывать особенности работы с кросс-доменными запросами и API WordPress. Похоже, вы уже решили проблемы с кросс-доменным доступом, и это отлично. Однако вы сталкиваетесь с проблемой, когда ответ вашего запроса возвращает data:0. Давайте подробно разберем, как правильно осуществлять такие запросы и устранить возникшие трудности.

Шаг 1: Использование функции `echo` вместо `return`

Ваша текущая реализация функции sendhire() возвращает JSON-данные с помощью оператора return, что, как выясняется, не является оптимальным в данном контексте. Вместо этого вам следует использовать echo. Дело в том, что AJAX-запросы в WordPress ожидают, что обработчик будет выводить результаты, а не возвращать их.

Пример исправления кода:

add_action("wp_ajax_sendhire", "sendhire");
add_action("wp_ajax_nopriv_sendhire", "sendhire");

function sendhire() {
    $cars = array("Volvo", "BMW", "Toyota");
    echo json_encode($cars); // Измените return на echo
    wp_die(); // Альтернатива die(), рекомендованная в WordPress
}

Шаг 2: Изучение REST API WordPress

Если вы собираетесь часто использовать AJAX-запросы, стоит рассмотреть возможность использования REST API, который более удобен и эффективен для работы с JSON. В отличие от традиционных AJAX запросов, REST API автоматически возвращает JSON и включает в себя ряд преимуществ, таких как простота ұйымдации и маршрутизации запросов.

Пример использования REST API:

add_action('rest_api_init', function () {
    register_rest_route('dcp3450', '/test_endpoint/', array(
        'methods' => 'GET',
        'callback' => 'sendhire'
    ));
});

function sendhire() {
    $cars = array("Volvo", "BMW", "Toyota");
    return new WP_REST_Response($cars, 200); // Возвращаем JSON через REST API
}

Теперь, получая доступ к http://example.com/wp-json/dcp3450/test_endpoint/, вы получите ваши данные в формате JSON без дополнительных символов или неправильных значений.

Шаг 3: Проверка кросс-доменных запросов

Если ваш AJAX-запрос приходит с другого домена или поддомена, обязательно убедитесь, что вы добре настроили CORS (Cross-Origin Resource Sharing). Это необходимо для корректной работы AJAX-запросов между разными источниками.

add_action('init', function() {
    header("Access-Control-Allow-Origin: *"); // Укажите ваш домен вместо '*', если возможно
});

Шаг 4: Пример AJAX-запроса

Не забудьте протестировать ваш AJAX-запрос с помощью jQuery или другого JavaScript-фреймворка:

jQuery(document).ready(function($) {
    $.ajax({
        url: 'http://example.com/wp-json/dcp3450/test_endpoint/',
        method: 'GET',
        success: function(data) {
            console.log(data); // Ожидаемый вывод: ["Volvo", "BMW", "Toyota"]
        },
        error: function(error) {
            console.error("Ошибка:", error);
        }
    });
});

Заключение

Использование API WordPress, а не традиционных AJAX-запросов, помогает избежать ненужных ошибок и упрощает процесс обработки данных. Убедитесь, что ваш код возвращает корректные ответы и правильно обрабатывает запросы, чтобы минимизировать вероятность неполадок. Тем самым, ваш проект станет более надежным и эффективным. Не стесняйтесь обращаться к официальной документации WordPress REST API для более глубокого понимания возможностей, которые она предоставляет.