Используйте рабочий поток вместе с WordPress Nonce (пользовательская конечная точка wp-api) - PullRequest
Новая
       5

Используйте рабочий поток вместе с WordPress Nonce (пользовательская конечная точка wp-api)

0 голосов
/ 21 ноября 2018

Я создаю плагин для WordPress, который должен выполнять большую кучу запросов ajax к пользовательской конечной точке WP API.Запросы не могут обрабатываться асинхронно, что делает необходимым использование рабочего потока, чтобы браузер не зависал во время процесса.Пока что это не так сложно, но я хочу использовать одноразовый номер WordPress для проверки.Когда я делал работника, я делал это так: 

worker = new Worker("worker.js");

Это правильно загружает работника, но теперь я хочу поговорить с нашей пользовательской конечной точкой Ajax.Поэтому скрипт должен быть загружен через wp_enqueue_script, чтобы одноразовый номер был проверен (я здесь прав?). 

wp_enqueue_script('itw_admin_update_products', plugins_url('assets/js/worker.js', __FILE__), [ 'jquery', 'wp-api' ], '1.0', true );

Вышеприведенное дважды исключает загрузку курса.Как загрузить сценарий как рабочий, при этом все еще имея возможность проверить одноразовый номер в конечной точке Ajax?

1 Ответ

0 голосов
/ 22 ноября 2018

Просто сам разобрался:

Зарегистрируйте маршрут REST 

register_rest_route('my-rest-route/v1', '/rest-action', array(
    'methods' => 'GET',
    'callback' => 'callback-function',
    'permission_callback' => function () { return current_user_can('edit_pages'); },

Поставьте в очередь сценарии

Функция wp_localize_script () передает переменные, которые нам нужны, чтобы загрузить работника и сообщить, где работник должен выполнить запрос.wp_enqueue_script () гарантирует, что скрипт загружен в нужный момент и ему разрешено делать запросы к конечной точке API. 

$params = array(
    'jsWorker'      => plugins_url('assets/js/the-worker.js', ITW_BASEDIR . '/ipp-to-woo.php'),
    'rest_route'    => get_rest_url(null, 'my-rest-route/v1/rest-action'),
);
wp_register_script('the_handler', plugins_url('assets/js/the-script.js', __FILE__), [ 'jquery', 'wp-api' ], '1.0', true );
wp_localize_script('the_handler', 'the_object', $params);
wp_enqueue_script('the_handler');

вызовите работника из-script.js

Поскольку мы использовали wp_localize_script () для передачи переменных на клиентскую сторону, теперь мы можем использовать the_object.jsWorker для загрузки работника.После загрузки работника мы передаем объект с параметром worker.postMessage, содержащим конечную точку API и одноразовый номер, сгенерированный WordPress, чтобы проверить себя. 

worker = new Worker(the_object.jsWorker);
worker.addEventListener('message', function(e) {
    var response
    response = JSON.parse(e.data)

    processResponse(response);

});

worker.postMessage({'nonce': wpApiSettings.nonce, 'url': the_object.rest_route});

Выполнить Ajax-вызов из the-worker.js

И последнее, но не менее важное: в файле-worker.js мы используем xhr.setRequestHeader для проверки себя, как это делает Wordpress. 

function doAjaxCall(url, nonce){
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, false);
        xhr.setRequestHeader( 'X-WP-Nonce', nonce );
        xhr.onload = function() {
        if (xhr.status === 200) {
            self.postMessage(xhr.response);
        }
    };
    xhr.send();
}

self.addEventListener('message', function(e) {
    var data = e.data;
    self.doAjaxCall(data.url, data.nonce);
}, false);
...