Wie erfasst man HTTP-Antwortheader in Chrome-Erweiterungen?

So lesen Sie HTTP-Antwortheader in Chrome-Erweiterungen

Originalbeitrag:

Diese Frage zielt darauf ab, eine Chrome-Erweiterung zu erweitern Das manipuliert Anforderungsheader, um die Überprüfung von Antwortheadern zu ermöglichen. Der Benutzer konnte keine relevanten APIs in den Chrome-Erweiterungs-APIs finden.

Lösung:

Für die Erfassung von HTTP-Antworten muss ein Skript in das DOM eingefügt werden. Der folgende Code demonstriert diesen Ansatz:

// inject.js
var s = document.createElement('script');
s.src = chrome.runtime.getURL('injected.js');
s.onload = function() {
    this.remove();
};
(document.head || document.documentElement).appendChild(s);

Dieses Skript fügt inject.js ein, das den Code zum Erfassen von Anfragen und Antworten enthält:

// injected.js
(function(xhr) {

    // Override XMLHttpRequest methods
    var XHR = XMLHttpRequest.prototype;
    var open = XHR.open;
    var send = XHR.send;
    var setRequestHeader = XHR.setRequestHeader;

    // Intercept open() to capture request details
    XHR.open = function(method, url) {
        this._method = method;
        this._url = url;
        this._requestHeaders = {};
        this._startTime = (new Date()).toISOString();

        return open.apply(this, arguments);
    };

    // Intercept setRequestHeader() to track request headers
    XHR.setRequestHeader = function(header, value) {
        this._requestHeaders[header] = value;
        return setRequestHeader.apply(this, arguments);
    };

    // Intercept send() to capture response details
    XHR.send = function(postData) {

        this.addEventListener('load', function() {
            var endTime = (new Date()).toISOString();

            // Retrieve request URL, headers, and response headers
            var myUrl = this._url ? this._url.toLowerCase() : this._url;
            if (myUrl) {
                // Print request headers, response headers, and response body (if available in string format)
                console.log(this._url);
                console.log(JSON.parse(this._requestHeaders));
                console.log(this.getAllResponseHeaders());
                if ( this.responseType != 'blob' && this.responseText) {
                    console.log(JSON.parse(this.responseText));
                }
            }
        });

        return send.apply(this, arguments);
    };

})(XMLHttpRequest);

Aktualisieren Sie abschließend Ihre manifest.json auf Fügen Sie die erforderlichen Skripte und Ressourcen hinzu:

// manifest.json (MV3)
{
  "manifest_version": 3,
  "content_scripts": [
    {
      "matches": ["*://website.com/*"],
      "run_at": "document_start",
      "js": ["contentscript.js", "inject.js"]
    }
  ],
  "web_accessible_resources": [
    {
      "resources": ["injected.js"],
      "matches": ["*://website.com/*"]
    }
  ]
}

// manifest.json (MV2)
{
  "web_accessible_resources": ["injected.js"]
}

Mit diesem Ansatz können Sie jetzt Anforderungsheader ändern und Antwortheader innerhalb derselben Chrome-Erweiterung erfassen.

Das obige ist der detaillierte Inhalt vonWie erfasst man HTTP-Antwortheader in Chrome-Erweiterungen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!