it-swarm.com.de

So können Sie alle http-Anfragen abfangen, einschließlich Formularsendungen

Ich möchte alle http-Anforderungen abfangen, die von meiner Webseite ausgehen, und dem Anforderungstext einen Parameter hinzufügen. Meine Seite enthält Formulare - ich möchte auch Formularsendungen erfassen. Ich habe Jquery ajaxSend und Javascript setRequestHeader ausprobiert, aber beide haben für mich nicht funktioniert. Wie kann ich das erreichen?

Vielen Dank

8
lenniekid

https://developer.mozilla.org/de/docs/Web/API/Service_Worker_API

Service-Mitarbeiter fungieren im Wesentlichen als Proxy-Server, die sich zwischen Webanwendungen und dem Browser und dem Netzwerk (sofern verfügbar) befinden.

Es handelt sich dabei um eine JavaScript-Datei, die die Webseite/Website, mit der sie verbunden ist, steuern und Navigations- und Ressourcenanforderungen abfangen und ändern kann

Sie registrieren einen Service-Worker in Ihrem Anwendungscode aus einer Datei mit dem Namen sw.js, indem Sie Folgendes tun:

if ('serviceWorker' in navigator) {
  window.addEventListener('load', function() {
    navigator.serviceWorker.register('sw.js').then(function(registration) {
      console.log('Service worker registered with scope: ', registration.scope);
    }, function(err) {
      console.log('ServiceWorker registration failed: ', err);
    });
  });
}

Und in der sw.js-Datei (dem eigentlichen Service-Worker-Code): Um Anforderungen abzufangen, hängen Sie einen fetch-Ereignislistener an den Service-Worker an, der die respondWith()-Methode aufruft und mit dem .request-Member des Ereignisobjekts etwas unternimmt:

self.addEventListener('fetch', function(event) {
  event.respondWith(
    // intercept requests by handling event.request here
  );
});

Ein einfacher Service-Worker, der Anforderungen nur unverändert durchläuft, sieht folgendermaßen aus:

self.addEventListener('fetch', function(event) {
  event.respondWith(
    fetch(event.request)
  );
});

Um dem Anforderungshauptteil einen Parameter hinzuzufügen, müssen Sie die Anforderung wahrscheinlich serialisieren, diese serialisierte Anforderung ändern und dann deserialisieren, um eine neue Anforderung zu erstellen, und dann fetch(…) mit dieser neuen Anforderung aufrufen.

Ich denke also, dass ein Servicemitarbeiter, der all das tut, so aussehen würde (ungeprüft): 

self.addEventListener('fetch', function(event) {
  event.respondWith(
    fetchWithParamAddedToRequestBody(event.request)
  );
});
function fetchWithParamAddedToRequestBody(request) {
  serialize(request).then(function(serialized) {
    // modify serialized.body here to add your request parameter
    deserialize(serialized).then(function(request) {
      return fetch(request);
    });
}
function serialize(request) {
  var headers = {};
  for (var entry of request.headers.entries()) {
    headers[entry[0]] = entry[1];
  }
  var serialized = {
    url: request.url,
    headers: headers,
    method: request.method,
    mode: request.mode,
    credentials: request.credentials,
    cache: request.cache,
    redirect: request.redirect,
    referrer: request.referrer
  };  
  if (request.method !== 'GET' && request.method !== 'HEAD') {
    return request.clone().text().then(function(body) {
      serialized.body = body;
      return Promise.resolve(serialized);
    });
  }
  return Promise.resolve(serialized);
}
function deserialize(data) {
  return Promise.resolve(new Request(data.url, data));
}

Hinweis:https://serviceworke.rs/request-deferrer_service-worker_doc.html , eine Seite aus dem Service Worker Cookbook , ist der Punkt, an dem ich den serialize(…)-Code/Ansatz von-by aufgehoben habe Art der Antwort unter Wie ändere ich die Header einer Anfrage? - und es lohnt sich, einen Blick darauf zu werfen, da der Code detaillierte Anmerkungen enthält, die erklären, was alles tut 

15
sideshowbarker

versuchen Sie diesen Code:

(function(send) {

XMLHttpRequest.prototype.send = function(data) {

    var _valuToAdd = $("input[name='valuToAdd']").val();
    this.setRequestHeader('valueName', _valuToAdd);
    send.call(this, data);
};
})(XMLHttpRequest.prototype.send);
2
abdelhadi