Скопировать/перехватить данные AJAX с помощью JavaScript?

Можно ли использовать JavaScript для очистки всех изменений на веб-странице, которая обновляется в реальном времени с помощью AJAX? Сайт, который я хочу очистить, обновляет данные с помощью AJAX каждую секунду, и я хочу получить все изменения. Это веб-сайт аукциона, и несколько объектов могут меняться всякий раз, когда пользователь ставит ставку. При размещении ставки происходит следующее изменение:

Текущая цена предложения Текущая высокая ставка Таймер аукциона добавляет к нему время

Я хочу захватить эти данные, используя расширение Chrome, основанное на JavaScript. Есть ли прослушиватель AJAX для JavaScript, который может это сделать? Набор инструментов? Мне нужно какое-то направление. Может ли JavaScript выполнить это?

ОТВЕТЫ

Ответ 1

Я собираюсь показать два способа решения проблемы. Какой бы метод вы ни выбрали, не забудьте прочитать нижнюю часть моего ответа!

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

В следующих примерах показано, как вы можете внедрять фильтры на основе данных (например, POST/GET), URL и прочитанных (POST) данных и органов реагирования.

Использовать глобальное событие ajax в jQuery

Более подробную информацию о методе jQuery можно найти в документации .ajaxSuccess. Использование:

jQuery.ajaxSuccess(function(event, xhr, ajaxOptions) {
    /* Method        */ ajaxOptions.type
    /* URL           */ ajaxOptions.url
    /* Response body */ xhr.responseText
    /* Request body  */ ajaxOptions.data
});

Чистый JavaScript-способ

Когда веб-сайт не использует jQuery для своих запросов AJAX, вам необходимо изменить встроенный метод XMLHttpRequest. Для этого требуется больше кода...:

(function() {
    var XHR = XMLHttpRequest.prototype;
    // Remember references to original methods
    var open = XHR.open;
    var send = XHR.send;

    // Overwrite native methods
    // Collect data: 
    XHR.open = function(method, url) {
        this._method = method;
        this._url = url;
        return open.apply(this, arguments);
    };

    // Implement "ajaxSuccess" functionality
    XHR.send = function(postData) {
        this.addEventListener('load', function() {
            /* Method        */ this._method
            /* URL           */ this._url
            /* Response body */ this.responseText
            /* Request body  */ postData
        });
        return send.apply(this, arguments);
    };
})();

Как работать с расширением Chrome

Ранее показанный код должен быть запущен в контексте страницы (в вашем случае на странице аукциона). По этой причине необходимо использовать контент script, который вводит (!) script. Использование этого не сложно, я ссылаюсь на этот ответ на подробное объяснение плюс примеры использования: Создание расширения Chrome - ввод кода на странице с использованием содержимого script.

Общий метод

Вы можете прочитать тело запроса, заголовки запросов и заголовки ответов с помощью chrome.webRequest API. Заголовки также могут быть изменены. Тем не менее, пока (пока) невозможно прочитать, не говоря уже об изменении тела ответа запроса. Если вы хотите эту функцию, выберите https://code.google.com/p/chromium/issues/detail?id=104058.