Использование Backbone с WordPress AJAX API

8

Я пытаюсь создать простой плагин TODO, используя Backbone, и столкнулся с проблемой с AJAX API. Для получения правильного обратного вызова AJAX вы должны передать параметр "action" следующим образом:

админ-ajax.php? действие = get_todos

который отлично работает для метода GET в Backbone. Однако при использовании DELETE Backbone по умолчанию будет использоваться такой URL-адрес:

админ-ajax.php? действие = get_todos / 9

где «9» - идентификатор удаляемой задачи. Добавляя этот идентификатор, он прерывает вызов AJAX на стороне WordPress. Я могу вручную переопределить URL-адреса для каждого из методов, но я хотел бы знать, есть ли более элегантный способ заставить AJAX API работать с Backbone.

Я создал демонстрационный плагин, который показывает конкретную проблему, с которой я столкнулся. Загрузите страницу настроек и нажмите любую из X, наблюдая за вашим Инспектором сети, чтобы увидеть результаты AJAX со значением 0, полученные из WordPress.

https://github.com/hereswhatidid/wordpress-todo-backbone-demo

ajax restful backbone

— hereswhatidid
источник

+1, поскольку я нахожу тему интересной, но, пожалуйста, добавьте к вопросу конкретные / соответствующие / не рабочие части вашего кода.

— Кайзер

Я пробовал это раньше и до сих пор не получилось. Вместо этого я использовал правила API переписывания WordPres для получения идентификатора записи. Обратите внимание, что я использую его только для получения архива (архива или термина пост-типа) в качестве коллекции и одного (пост-тип или пользовательский тип поста) в качестве модели.

— ifdion

2

Вам необходимо переопределить Backbone.syncфункцию, чтобы изменить URL-адрес, используемый для вызова AJAX. Вы можете узнать из плагина wp-backbone это и многое другое. Ниже вы можете увидеть, как он изменяет все действия на POSTили GET, создает параметры, добавляет actionпараметр и многое другое.

(function($) {
Backbone.sync = function(method, model, options) {

    var params = _.extend({
        type:         'POST',
        dataType:     'json',
        url: wpBackboneGlobals.ajaxurl,
        contentType: 'application/x-www-form-urlencoded;charset=UTF-8'
    }, options);

    if (method == 'read') {
        params.type = 'GET';
        params.data = model.id
    }

    if (!params.data && model && (method == 'create' || method == 'update' || method == 'delete')) {
        params.data = JSON.stringify(model.toJSON());
    }


    if (params.type !== 'GET') {
        params.processData = false;
    }

    params.data = $.param({action:'backbone',backbone_method:method,backbone_model:model.dbModel,content:params.data});

    // Make the request.
    return $.ajax(params);


};

})(jQuery);

— Симус Лихи
источник

2

Вам не нужно переопределять, Backbone.syncтак как Backbone.sync переопределит свой собственный запрос $ .ajax с параметрами, которые вы передадите в качестве параметров. Посмотрите эту ссылку для ознакомления с Backbone.syncвнутренними принципами работы: http://backbonejs.org/docs/backbone.html#section-141

Вы можете добавить что-то вроде следующего в вашу модель или коллекцию:

save: function(){
    var $params = {
        emulateJSON: true, 
        data: { 
                 action: 'your_wp_ajax_action', 
                 payload : this.toJSON() 
              } 
        };

    //return $.post(this.url, $params, null);

    return Backbone.sync( 'create', this, $params );
}

А затем обработайте данные как обычные данные на стороне сервера (с вашей моделью / моделями $_POST['payload']).

Этот метод делает:

создайте массив необходимых переопределений для вызова ajax.
включите «классический POST» с помощью emulateJSONпараметра: это упрощает синтаксис как во внешнем, так и во внутреннем интерфейсе. В противном случае вам придется использовать JSON.stringify в параметре data.
вернуть результат вызова Backbone.sync с конфигурацией по умолчанию 'create' (POST), набором данных {model} или {models}, если коллекция, и нашими собственными переопределениями.

$_POST['payload'] затем содержит массив всех ваших данных Backbone.

— Мауро Колелла
источник