MockJax не отправляет ответ на мой запрос AJAX в приложении JavaScript

Question

Я использую jQuery библиотека называется MockAjax который позволяет вам макетировать / тестировать реальные AJAX-звонки.

В моем приложении я могу использовать свою версию приложения AJAX и MockAjax перехватит запрос AJAX и ответит ложным ответом!

Я также использую другую библиотеку под названием M<ockJson что аналогично, но вместо этого позволяет генерировать ответ Mock JSON.

Используя обе библиотеки вместе, мое приложение делает запрос AJAX. MockAjax ловит запрос AJAX и затем MockJson генерирует и возвращает случайный JSON ответ.

В моих прошлых проектах это работало отлично без проблем до сегодняшнего дня...

Теперь, когда мое приложение работает довольно хорошо, я решил, что пришло время реструктурировать JavaScript в более структурированную версию. (размещение событий, задач и т. д. в разделах кода).

Это где моя проблема началась....

В моем новом коде

1. мое приложение делает запрос AJAX.
2. MockAjax ловит AJAX запрос.
3. MockJson называется, чтобы получить JSON ответ
4. ОШИБКИ это где все идет не так...

На этом последнем этапе он должен пройти JSON ответ обратно на оригинал AJAX звонки Success функция. Это просто не так!

Я не получаю ошибок или чего-либо в консоли. Я создал простой alert() в моих звонках AJAX success() функция, и это не делает это так далеко, чтобы даже вызвать предупреждение!

Я не уверен, есть ли какая-то проблема объема или в чем проблема может быть. Когда мое приложение было плоским, все переменные и функции на корневом уровне glbal без какой-либо структуры для приложения... все работало. Как только я переместил все в Objects и т. Д.… Все это работает, кроме этой 1 проблемы - не возвращать ответ MockAjax обратно на ответ Real Ajax!

Я удалил 95% кода приложения и заново собрал его с минимальными затратами, чтобы запустить этот пример проблемы. Демонстрация проблемы здесь... http://jsbin.com/vugeki/1/edit?js

Поток приложений:

• projectTaskModal.init(); запускается при загрузке страницы
• This fires off projectTaskModal.mockAjax.init(); который устанавливает MockAjax а также MockJson код
• затем projectTaskModal.task.openTaskModal(projectTaskModal.cache.taskId); запускается, который выполняет AJAX запрос
• AJAX POST Request отправлено /gettaskevents
• MockAjax ловит запрос, отправленный на /gettaskevents
• MockAjax затем звонит MockJson генерировать JSON ответ. projectTaskModal.mockAjax.generateTaskEventsJson(); вызывает эту функцию, и она выводит JSON-ответ в консоль, чтобы я мог видеть, что он генерирует ее!
• В моем MockAjax код, var taskevents держит JSON ответ, а затем установить его на это... this.responseText = taskevents; `` this.responseTextI believe is what is supposed to be returned to the Applications originalAJAX` звонок. Похоже, что именно здесь проблема может быть! Похоже, он не возвращает ответ обратно к исходному коду AJAX, который запрашивал его в первую очередь!

Может ли это быть какой-то проблемой?

var projectTaskModal = {

    cache: {
        taskId: 1,
        projectId: '12345',
    },


    init: function() {
        projectTaskModal.mockAjax.init();
      //console.log(projectTaskModal.mockAjax.init.generateTaskEventsJson());
        projectTaskModal.task.openTaskModal(projectTaskModal.cache.taskId);
    },


    task: {


        openTaskModal: function(taskId) {
            // Load Task Events/Comments Panel from AJAX Request
            projectTaskModal.task.loadTaskEventsPanel(taskId);
        },

        /**
         * Load Task Events/Comments from backend Database JSON
         * @param  {string} jsonServerEndpoint URL for AJAX to Request
         * @return {string} Generated HTML of all Task Events built from JSON
         */
        loadTaskEventsPanel: function(taskId) {


            // Request Task Events and Comments using AJAX Request to Server
            $.ajax({
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                url: '/gettaskevents',
                data: {
                    action: 'load-task-events',
                    task_id: projectTaskModal.cache.taskId
                },
                success: function(data) {

alert('TESTING AJAX SUCCESS CALLBACK WAS CALLED!');

                    console.log('function loadTaskEventsPanel(taskId) DATA: ');
                    console.log(data);

                    // Parse JSON data
                    var taskEventsJson = data;
                    var task_events = taskEventsJson.task_events;

                    // Loop over each Task Event record returned
                    $.each(task_events, function(i, event) {
                        console.log('commentID: ' + event.commentId);
                        console.log('create_at DateTime: ' + event.created_at);
                    });

                }
            });
        },

    },


    mockAjax: {
        init: function(){

          // Adding the @EVENT_TYPE keyword for MockJSON Template Usage
          $.mockJSON.data.EVENT_TYPE = [
              'Comment Created',
              'Task Status Changed',
              'Task Completed'
          ];



          // Mock AJAX response for AJAX request to /gettaskevents
          $.mockjax({
              url: '/gettaskevents',
              contentType: 'text/json',
              responseTime: 2900, // Simulate a network latency of 750ms
              response: function(settings) {
                  console.log('mockJax POST to /gettaskevents :');
                  //console.log(settings);
                  //DEBUG('Get Task Events JSON', settings.data);
                  if(settings.data.value == 'err') {
                     alert('MockAjax Error');
                     this.status = 500;
                     this.responseText = 'Validation error!';
                  } else {
                     alert('MockAjax Success');
                     //var taskevents = generateTaskEventsJson();
                     var taskevents =  projectTaskModal.mockAjax.generateTaskEventsJson();
                     this.responseText = taskevents;
                     console.log(taskevents);
                  }
              }
          });

        },



          // Generate Mock JSON Response to load fake Task Evewnt/Comments JSON for Mock AJAX request
          //var generateTaskEventsJson = function () {
          generateTaskEventsJson: function() {
            var mockTaskJson = $.mockJSON.generateFromTemplate({
            "task_events|10-14" : [{
                "commentId|+1" : 100000000,
                "projectId|+1" : 100000000,
                "taskId|+1" : 100000000,
                "userId|+1" : 100000000,
                "created_at" : "@DATE_YYYY-@DATE_MM-@DATE_DD",
                "event_type" : "@EVENT_TYPE",
                "userName" : "@MALE_FIRST_NAME @LAST_NAME",
                "description" : "@LOREM_IPSUM @LOREM_IPSUM"
              }]
            });
            //DEBUG('Generate Mock Task Events JSON', mockTaskJson.task_events);
            //console.log(mockTaskJson.task_events);
            //return mockTaskJson.task_events;
            return mockTaskJson;
          }







    },


};

$(function() {
    projectTaskModal.init();
});

Answer 1

Ваш пример JSBin показывает, что вы используете очень старую версию Mockjax (1.5.0-pre). Последний - 1.6.2, выпущенный совсем недавно (сейчас я ведущий разработчик ядра). Ниже приведена ссылка на обновленный JSBin, где все работает нормально. Старая версия Mockjax, которую вы запускали, была создана до появления jQuery 2.0 и, следовательно, не поддерживает ее (1.6.2 поддерживает).

http://jsbin.com/qucudeleve/1/

Итак... обновите свою версию Mockjax, чтобы использовать Bower, npm или просто Rawgit ( https://rawgit.com/jakerella/jquery-mockjax/master/jquery.mockjax.js) от основной учетной записи (моей) по сравнению с вашей собственной вилка, которая крайне устарела!

Удачи.