16

JavaScript を使用して、AJAX でライブ更新されている Web ページへのすべての変更をスクレイピングすることは可能ですか? スクレイピングしたいサイトは、AJAX を使用して毎秒更新データを取得し、すべての変更を取得したいと考えています。これはオークション Web サイトであり、ユーザーが入札するたびにいくつかのオブジェクトが変更される可能性があります。入札が行われると、次の変更が行われます。

現在の入札価格 現在の最高入札者 オークション タイマーの時間が加算されます

JavaScript で構築された Chrome 拡張機能を使用して、このデータを取得したいと考えています。これを実現できる JavaScript 用の AJAX リスナーはありますか? ツールキット？方向性が必要です。JavaScript でこれを達成できますか??

4

1 に答える 1

28

問題を解決する 2 つの方法を紹介します。どちらの方法を選択しても、私の回答の最後を読むことを忘れないでください!

最初に、ページが jQuery を使用している場合にのみ機能する簡単な方法を提示します。2 番目の方法は少し複雑に見えますが、jQuery を使用しないページでも機能します。

次の例は、メソッド (POST/GET など)、URL、および読み取り (POST) データと応答本文に基づいてフィルターを実装する方法を示しています。

jQuery でグローバル ajax イベントを使用する

jQuery メソッドの詳細については、 のドキュメントを参照して.ajaxSuccessください。使用法：

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

純粋な JavaScript の方法

Web サイトが AJAX 要求に jQuery を使用していない場合は、組み込み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 拡張機能で動作させる

前に示したコードは、ページ (この場合はオークション ページ) のコンテキストで実行する必要があります。このため、スクリプトを注入 (!) するコンテンツ スクリプトを使用する必要があります。詳細な説明と使用例については、この回答を参照してください: Build a Chrome Extension - Inject code in a page using a Content script .

一般的な方法

chrome.webRequestAPIを使用して、リクエスト ボディ、リクエスト ヘッダー、およびレスポンス ヘッダーを読み取ることができます。ヘッダーも変更できます。ただし、リクエストのレスポンスボディを変更することはおろか、読み取ることも (まだ) 不可能です。この機能が必要な場合は、https://code.google.com/p/chromium/issues/detail?id=104058にスターを付けてください。

于 2012-12-07T18:20:05.870 に答える