webRequest.onBeforeRequest

Syntax

browser.webRequest.onBeforeRequest.addListener(
  listener,             // function
  filter,               //  object
  extraInfoSpec         //  optional array of strings
)
browser.webRequest.onBeforeRequest.removeListener(listener)
browser.webRequest.onBeforeRequest.hasListener(listener)

Ereignisse haben drei Funktionen:

addListener(listener, filter, extraInfoSpec)

Fügt einen Listener zu diesem Ereignis hinzu.

removeListener(listener)

Hört auf, diesem Ereignis zuzuhören. Das listener-Argument ist der zu entfernende Listener.

hasListener(listener)

Überprüfen Sie, ob listener für dieses Ereignis registriert ist. Gibt true zurück, wenn es zuhört, ansonsten false.

Syntax von addListener

Parameter

listener

Die Funktion, die aufgerufen wird, wenn dieses Ereignis auftritt. Der Funktion wird dieses Argument übergeben:

details

object. Details zur Anfrage. Siehe den Abschnitt details für weitere Informationen.

Gibt zurück: webRequest.BlockingResponse. Wenn "blocking" im extraInfoSpec-Parameter angegeben ist, sollte der Ereignis-Listener ein BlockingResponse-Objekt zurückgeben und kann entweder seine cancel- oder seine redirectUrl-Eigenschaften festlegen. Ab Firefox 52 kann der Listener anstelle eines BlockingResponse ein Promise zurückgeben, das mit einem BlockingResponse aufgelöst wird. Dies ermöglicht es dem Listener, die Anfrage asynchron zu verarbeiten.

filter

webRequest.RequestFilter. Ein Filter, der die Ereignisse einschränkt, die an diesen Listener gesendet werden.

extraInfoSpec Optional

array von string. Zusätzliche Optionen für das Ereignis. Sie können einen der folgenden Werte übergeben:

• "blocking": macht die Anfrage synchron, sodass Sie die Anfrage abbrechen oder umleiten können
• "requestBody": schließt requestBody in das an den Listener übergebene details-Objekt ein

Zusätzliche Objekte

details

documentId Optional

string. Die UUID des Dokuments, das die Anfrage stellt. Weitere Informationen finden Sie im Artikel Arbeiten mit documentId.

documentLifecycle

string. Der Lebenszyklus, in dem sich das Dokument befindet. Gibt die Werte "prerender", "active", "cached" oder "pending_deletion" zurück.

cookieStoreId

string. Wenn die Anfrage von einem in einer kontextuellen Identität geöffneten Tab ausgestellt wird, die Cookie-Store-ID der kontextuellen Identität. Weitere Informationen finden Sie im Artikel Arbeiten mit kontextuellen Identitäten.

documentUrl

string. URL des Dokuments, in dem die Ressource geladen wird. Wenn beispielsweise die Webseite unter "https://example.com" ein Bild oder ein Iframe enthält, dann ist die documentUrl für das Bild oder Iframe "https://example.com". Für ein Top-Level-Dokument ist documentUrl undefiniert.

frameAncestors

array. Enthält Informationen für jedes Dokument in der Rahmenhierarchie bis zum Top-Level-Dokument. Das erste Element im Array enthält Informationen über das unmittelbare übergeordnete Dokument des angeforderten Dokuments, und das letzte Element enthält Informationen über das Top-Level-Dokument. Wenn der Ladevorgang tatsächlich für das Top-Level-Dokument ist, ist dieses Array leer.

url

string. Die URL, von der das Dokument geladen wurde.

frameId

integer. Die frameId des Dokuments. details.frameAncestors[0].frameId ist dieselbe wie details.parentFrameId.

frameId

integer. Null, wenn die Anfrage im Hauptrahmen erfolgt; ein positiver Wert ist die ID eines Unterrahmens, in dem die Anfrage ausgeführt wird. Wenn das Dokument eines (Unter-)Rahmens geladen wird (type ist main_frame oder sub_frame), zeigt frameId die ID dieses Rahmens an, nicht die ID des äußeren Rahmens. Rahmen-IDs sind innerhalb eines Tabs einzigartig.

frameType

string. Der Typ des Rahmens, in dem die Anfrage aufgetreten ist. Gibt die Werte "outermost_frame", "fenced_frame" oder "sub_frame" zurück.

incognito

boolean. Ob die Anfrage aus einem privaten Browserfenster stammt.

method

string. Standard-HTTP-Methode: zum Beispiel "GET" oder "POST".

originUrl

string. URL der Ressource, die die Anfrage ausgelöst hat. Zum Beispiel, wenn "https://example.com" einen Link enthält und der Benutzer auf den Link klickt, dann ist die originUrl für die resultierende Anfrage "https://example.com".

Die originUrl ist oft, aber nicht immer dieselbe wie die documentUrl. Zum Beispiel, wenn eine Seite ein Iframe enthält und das Iframe einen Link enthält, der ein neues Dokument in das Iframe lädt, dann wird die documentUrl für die resultierende Anfrage das übergeordnete Dokument des Iframes sein, aber die originUrl wird die URL des Dokuments im Iframe sein, das den Link enthielt.

parentDocumentId Optional

string. Eine UUID des übergeordneten Dokuments, das den Rahmen besitzt. Wird nicht gesetzt, wenn kein übergeordnetes Dokument existiert. Weitere Informationen finden Sie im Artikel Arbeiten mit documentId.

parentFrameId

integer. ID des Rahmens, der den Rahmen enthält, der die Anfrage gesendet hat. Setzt auf -1, wenn kein übergeordneter Rahmen existiert.

proxyInfo

object. Diese Eigenschaft ist nur vorhanden, wenn die Anfrage über einen Proxy gestellt wird. Sie enthält die folgenden Eigenschaften:

host

string. Der Hostname des Proxyservers.

port

integer. Die Portnummer des Proxyservers.

type

string. Der Typ des Proxyservers. Einer von:

• "http": HTTP-Proxy (oder SSL CONNECT für HTTPS)
• "https": HTTP-Proxying über TLS-Verbindung zum Proxy
• "socks": SOCKS v5 Proxy
• "socks4": SOCKS v4 Proxy
• "direct": kein Proxy
• "unknown": unbekannter Proxy

username

string. Benutzername für den Proxydienst.

proxyDNS

boolean. True, wenn der Proxy die DNS-Auflösung basierend auf dem bereitgestellten Hostnamen durchführt, was bedeutet, dass der Client seine eigene DNS-Abfrage nicht durchführen sollte.

failoverTimeout

integer. Failover-Timeout in Sekunden. Wenn die Proxyverbindung fehlschlägt, wird der Proxy für diesen Zeitraum nicht mehr verwendet.

requestBody Optional

object. Enthält die HTTP-Anfragekörperdaten. Nur bereitgestellt, wenn extraInfoSpec "requestBody" enthält.

error Optional

string. Dies wird gesetzt, wenn beim Abrufen der Anfragedaten aus dem Anfragekörper Fehler aufgetreten sind.

formData Optional

object. Dieses Objekt ist vorhanden, wenn die Anfragemethode POST ist und der Körper eine Sequenz von Schlüssel-Wert-Paaren ist, die in UTF-8 als entweder "multipart/form-data" oder "application/x-www-form-urlencoded" kodiert ist.

Es ist ein Wörterbuch, in dem jeder Schlüssel die Liste aller Werte für diesen Schlüssel enthält. Zum Beispiel: {'key': ['value1', 'value2']}. Wenn die Daten eines anderen Medientyps sind oder wenn sie fehlerhaft sind, ist das Objekt nicht vorhanden.

raw Optional

array von webRequest.UploadData. Wenn die Anfragemethode PUT oder POST ist, und der Körper nicht bereits in formData analysiert wurde, enthält dieses Array die nicht-parsierten Anfragekörper-Elemente.

requestId

string. Die ID der Anfrage. Anfrage-IDs sind innerhalb einer Browsersitzung einzigartig, sodass Sie sie verwenden können, um verschiedene Ereignisse mit derselben Anfrage in Verbindung zu bringen.

tabId

integer. ID des Tabs, in dem die Anfrage erfolgt. Auf -1 gesetzt, wenn die Anfrage nicht mit einem Tab in Zusammenhang steht.

thirdParty

boolean. Gibt an, ob die Anfrage und ihre Inhaltsfensterhierarchie von Drittanbietern stammen.

timeStamp

number. Der Zeitpunkt, zu dem dieses Ereignis ausgelöst wurde, in Millisekunden seit der Epoche.

type

webRequest.ResourceType. Der Typ der angeforderten Ressource: zum Beispiel "image", "script", "stylesheet".

url

string. Ziel der Anfrage.

urlClassification

object. Die Art der Verfolgung, die mit der Anfrage verbunden ist, falls die Anfrage von Firefox Tracking Protection klassifiziert wird. Dies ist ein Objekt mit diesen Eigenschaften:

firstParty

array von string. Klassifikationsflags für die First-Party der Anfrage.

thirdParty

array von string. Klassifikationsflags für die Anfrage oder deren Fensterhierarchie von Drittanbietern.

Die Klassifikationsflags umfassen:

• fingerprinting und fingerprinting_content: zeigt an, dass die Anfrage mit Fingerprinting (Ermitteln einer eindeutigen Identität) verbunden ist ("eine Herkunft, die zum Fingerprinting gefunden wurde").
  • fingerprinting zeigt, dass die Domain in der Kategorie Fingerprinting und Tracking ist. Beispiele für diese Art von Domain sind Werbetreibende, die ein Profil mit dem besuchenden Benutzer verknüpfen möchten.
  • fingerprinting_content zeigt, dass die Domain in der Kategorie Fingerprinting ist, jedoch nicht in der Tracking-Kategorie. Beispiele für diese Art von Domain sind Zahlungsdienstleister, die Fingerprinting-Techniken nutzen, um den besuchenden Benutzer zur Betrugsbekämpfung zu identifizieren.
• cryptomining und cryptomining_content: ähnlich der Fingerprinting-Kategorie, jedoch für Cryptomining-Ressourcen.
• tracking, tracking_ad, tracking_analytics, tracking_social und tracking_content: zeigt an, dass die Anfrage mit Tracking verbunden ist. tracking ist jede generische Tracking-Anfrage; die Suffixe ad, analytics, social und content identifizieren den Typ des Trackers.
• emailtracking und emailtracking_content: zeigt an, dass die Anfrage mit dem Verfolgen von E-Mails verbunden ist.
• any_basic_tracking: ein Meta-Flag, das Tracking- und Fingerprinting-Flags kombiniert, ohne tracking_content und fingerprinting_content.
• any_strict_tracking: ein Meta-Flag, das alle Tracking- und Fingerprinting-Flags kombiniert.
• any_social_tracking: ein Meta-Flag, das alle sozialen Tracking-Flags kombiniert.

Mehr Informationen über Tracker-Typen finden Sie auf der disconnect.me Website. Das Suffix content zeigt Tracker an, die Inhalte verfolgen und bereitstellen. Wenn man sie blockiert, schützt das Benutzer, kann aber dazu führen, dass Seiten nicht mehr funktionieren oder Elemente nicht angezeigt werden.

DNS-Auflösungsreihenfolge bei Verwendung von BlockingResponse

Bezüglich DNS-Auflösung, wenn BlockingResponse mit OnBeforeRequest verwendet wird: Im HTTP-Kanal passiert onBeforeRequest mit Blocking-Response vor der DNS-Auflösung und auch vor der spekulativen Verbindung. Bei anderen Kanälen kann die spekulative Verbindung dazu führen, dass DNS-Anfragen vor onBeforeRequest stattfinden. Diese Reihenfolge ist etwas, worauf sich ein Erweiterungsentwickler nicht verlassen sollte, da sie je nach Browser und von einer Browserversion zur anderen variieren kann, ganz zu schweigen von einem Anforderungskanal zum anderen. Siehe BugZilla-Problemerklärung von Mozilla-Entwicklern zur DNS-Auflösungsreihenfolge

Beispiele

Dieser Code protokolliert die URL für jede angeforderte Ressource, die dem <all_urls> Muster entspricht:

function logURL(requestDetails) {
  console.log(`Loading: ${requestDetails.url}`);
}

browser.webRequest.onBeforeRequest.addListener(logURL, {
  urls: ["<all_urls>"],
});

Dieser Code bricht Anfragen für Bilder ab, die an URLs unter "https://developer.mozilla.org/" gesendet werden (um den Effekt zu sehen, besuchen Sie eine beliebige Seite auf MDN, die Bilder enthält, wie webRequest):

// match pattern for the URLs to redirect
let pattern = "https://developer.mozilla.org/*";

// cancel function returns an object
// which contains a property `cancel` set to `true`
function cancel(requestDetails) {
  console.log(`Canceling: ${requestDetails.url}`);
  return { cancel: true };
}

// add the listener,
// passing the filter argument and "blocking"
browser.webRequest.onBeforeRequest.addListener(
  cancel,
  { urls: [pattern], types: ["image"] },
  ["blocking"],
);

Dieser Code ersetzt, durch Umleitung, alle Netzwerk-Anfragen für Bilder, die an URLs unter "https://developer.mozilla.org/" gesendet werden (um den Effekt zu sehen, besuchen Sie eine beliebige Seite auf MDN, die Bilder enthält, wie webRequest):

// match pattern for the URLs to redirect
let pattern = "https://developer.mozilla.org/*";

// redirect function
// returns an object with a property `redirectURL`
// set to the new URL
function redirect(requestDetails) {
  console.log(`Redirecting: ${requestDetails.url}`);
  return {
    redirectUrl:
      "https://38.media.tumblr.com/tumblr_ldbj01lZiP1qe0eclo1_500.gif",
  };
}

// add the listener,
// passing the filter argument and "blocking"
browser.webRequest.onBeforeRequest.addListener(
  redirect,
  { urls: [pattern], types: ["image"] },
  ["blocking"],
);

Dieser Code ist genau wie das vorherige Beispiel, außer dass der Listener die Anfrage asynchron behandelt. Es gibt ein Promise zurück, das einen Timer setzt und die Umleitungs-URL zurückgibt, wenn der Timer abläuft:

// match pattern for the URLs to redirect
let pattern = "https://developer.mozilla.org/*";

// URL we will redirect to
let redirectUrl =
  "https://38.media.tumblr.com/tumblr_ldbj01lZiP1qe0eclo1_500.gif";

// redirect function returns a Promise
// which is resolved with the redirect URL when a timer expires
function redirectAsync(requestDetails) {
  console.log(`Redirecting async: ${requestDetails.url}`);
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({ redirectUrl });
    }, 2000);
  });
}

// add the listener,
// passing the filter argument and "blocking"
browser.webRequest.onBeforeRequest.addListener(
  redirectAsync,
  { urls: [pattern], types: ["image"] },
  ["blocking"],
);

Ein weiteres Beispiel, das alle Bilder auf eine Data-URL umleitet:

let pattern = "https://developer.mozilla.org/*";

let image = `
  <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
    <rect style="stroke-width: 10; stroke: #666666;" width="100%" height="100%" fill="#d4d0c8" />
    <text transform="translate(0, 9)" x="50%" y="50%" width="100%" fill="#666666" height="100%" style="text-anchor: middle; font: bold 10pt 'Segoe UI', "Helvetica", "Arial";">Blocked</text>
  </svg>
`;

function listener(details) {
  const redirectUrl = `data:image/svg+xml,${encodeURIComponent(image)}`;
  return { redirectUrl };
}

browser.webRequest.onBeforeRequest.addListener(
  listener,
  { urls: [pattern], types: ["image"] },
  ["blocking"],
);

Hier ist eine andere Version:

function randomColor() {
  return `#${Math.floor(Math.random() * 16777215).toString(16)}`;
}

const pattern = "https://developer.mozilla.org/*";

let image = `
  <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
    <rect width="100%" height="100%" fill="${randomColor()}"/>
  </svg>
`;

function listener(details) {
  const redirectUrl = `data:image/svg+xml,${encodeURIComponent(image)}`;
  return { redirectUrl };
}

browser.webRequest.onBeforeRequest.addListener(
  listener,
  { urls: [pattern], types: ["image"] },
  ["blocking"],
);

Beispielerweiterungen

• http-response

Browser-Kompatibilität