Traffic Hijacking and Request Interception Techniques for Unified Authentication Platforms

Background – In a unified authentication platform, multiple sub‑systems use different front‑end frameworks and third‑party request libraries (e.g., axios). Modifying each system individually would be costly, so a non‑intrusive, universal interception approach is needed.

What is Traffic Hijacking? – Traffic hijacking refers to intercepting, modifying, or redirecting network traffic at various layers (DNS, HTTP, HTTPS). While often associated with attacks, it also has legitimate uses such as ad injection, content filtering, monitoring, and load balancing.

Front‑End Solution Design – The goal is to intercept requests before they leave the client and responses after they return, without altering existing business code. The lifecycle includes intercepting fetch/xhr, applying custom logic, and then allowing the request to proceed.

Fetch Request Interception

const origin_fetch = window.fetch;
const handler = {
  apply(target, thisArg, arrArray) {
    const [request, init] = arrArray;
    // hijack request
    // ... custom logic ...
    const newRequest = new Request(request.url, {
      ...request,
      method: request.method,
      headers: request.headers,
      body: request.body
    });
    return origin_fetch(newRequest, init).then(response => {
      // hijack response
      // ... custom logic ...
      return response;
    });
  }
};
window.fetch = new Proxy(origin_fetch, handler);

The proxy rewrites the apply trap of fetch , allowing inspection and modification of request headers, method, and body, as well as post‑processing of the response.

XHR Request Interception

const origin_xhr = window.XMLHttpRequest;
const handler = {
  construct(target, ...args) {
    const xhr = new target(...args);
    const origin_open = xhr.open;
    xhr.open = function(method, url) {
      this.method = method;
      this.url = url;
      return origin_open.apply(this, arguments);
    };
    const origin_send = xhr.send;
    xhr.send = function() {
      // hijack request – inject headers
      this.setRequestHeader('xx', 'xxx');
      this.addEventListener('readystatechange', () => {
        if (this.readyState === XMLHttpRequest.DONE) {
          // hijack response – custom handling
        }
      });
      return origin_send.apply(this, arguments);
    };
    return xhr;
  }
};
window.XMLHttpRequest = new Proxy(origin_xhr, handler);

This proxy overrides the constructor, open , and send methods of XMLHttpRequest to inject headers and process responses.

ReadableStream Usage – The article demonstrates how to handle large file downloads and uploads using the Web Streams API, providing code for chunked download with progress feedback and stream‑based upload with half‑duplex support.

Back‑End Request Interception – Various back‑end techniques are outlined, including servlet filters, Spring AOP, Java agents, and sidecar‑based service mesh interception (e.g., Istio using iptables and SOL_IP/SO_ORIGINAL_DST ).

Mesh Interception – Service mesh provides a transparent, sidecar‑driven approach to traffic hijacking, decoupling interception from application code and leveraging iptables NAT redirection.

Conclusion – By combining front‑end proxy techniques, ReadableStream handling, and back‑end interception strategies, developers can achieve unified, low‑intrusion request management across heterogeneous systems.

References

Istio sidecar injection and transparent traffic hijacking documentation.

https://mosn.io/docs/products/structure/traffic-hijack/