Einführung in @rxliuli/vista: Eine einheitliche Request-Interceptor-Bibliothek für Fetch und XHR mit Middleware-Unterstützung.

@rxliuli/vista ist eine leistungsstarke homogene Request-Interceptor-Bibliothek, die das einheitliche Abfangen von Fetch/XHR-Anfragen unterstützt. Es ermöglicht Ihnen, in verschiedenen Phasen des Anforderungslebenszyklus einzugreifen und verschiedene Funktionen wie die Überwachung, Änderung und Verspottung von Anforderungen zu ermöglichen.

Eigenschaften

• ? Unterstützt sowohl das Abfangen von Fetch- als auch XHR-Anfragen
• ? Verwenden Sie ein Middleware-Muster, flexibel und einfach zu erweitern
• ? Unterstützende Interventionen vor und nach Anfragen
• ? Veränderbare Anfrage- und Antwortdaten
• ? Keine Abhängigkeit, kompakte Größe
• ? Unterstützt nur die Browserumgebung

Installation

npm install @rxliuli/vista
# Or
yarn add @rxliuli/vista
# Or
pnpm add @rxliuli/vista

Grundlegende Verwendung

import { Vista } from '@rxliuli/vista'

new Vista()
  .use(async (c, next) => {
    console.log('Request started:', c.req.url)
    await next()
  })
  .use(async (c, next) => {
    await next()
    console.log('Response data:', await c.res.clone().text())
  })
  .intercept()

Erweiterte Anwendungsfälle

Fügen Sie globale Anforderungsheader hinzu

new Vista()
  .use(async (c, next) => {
    c.req.headers.set('Authorization', 'Bearer token')
    await next()
  })
  .intercept()

Anforderungsergebnis-Cache

const cache = new Map()

new Vista()
  .use(async (c, next) => {
    const key = c.req.url
    if (cache.has(key)) {
      c.res = cache.get(key).clone()
      return
    }
    await next()
    cache.set(key, c.res.clone())
  })
  .intercept()

Die Anfrage ist fehlgeschlagen. Bitte versuchen Sie es erneut

new Vista()
  .use(async (c, next) => {
    const maxRetries = 3
    let retries = 0

    while (retries < maxRetries) {
      try {
        await next()
        break
      } catch (err) {
        retries++
        if (retries === maxRetries) throw err
      }
    }
  })
  .intercept()

Dynamische Änderungsreaktion

new Vista()
  .use(async (c, next) => {
    await next()
    if (c.req.url === 'https://example.com/example') {
      const json = await c.res.json()
      json.id = 2
      c.res = new Response(JSON.stringify(json), c.res)
    }
  })
  .intercept()

API-Referenz

Vista-Klasse

Haupt-Interceptor-Klasse, die die folgenden Methoden bereitstellt:

• use(middleware): Middleware hinzufügen
• intercept(): Beginnen Sie mit dem Abfangen von Anfragen
• destroy(): Stoppt das Abfangen von Anfragen

Middleware-Kontext

Die Middleware-Funktion erhält zwei Parameter:

• Kontext: Enthält Anforderungs- und Antwortinformationen
  • req: Objekt anfordern res: Antwortobjekt
  • Typ: Anforderungstyp, fetch oder xhr
• Weiter: Rufen Sie die Funktion der nächsten Middleware oder Originalanforderung auf

FAQ

1. Wie kann man das Abfangen stoppen?

   const vista = new Vista()
   vista.intercept()
   // When not needed
   vista.destroy()

1. Unterstützt es asynchrone Vorgänge?
   Ja, die Middleware unterstützt die Async/Await-Syntax.

2. Unterstützt es das Abfangen von Anfragen in Node.js?

Nein, es unterstützt nur das Abfangen von Anfragen im Browser.

Danke

• xhook: Eine Bibliothek, die das Abfangen von xhr implementiert und für die Implementierung einiger Funktionen hilfreich ist.
• hono: Ein hervorragendes Webserver-Framework, das in seiner API viel Inspiration bietet.

Beitragsrichtlinien

Herzlich willkommen zum Einreichen von Issues und Pull Requests!

Lizenz

MIT-Lizenz

Probieren Sie es aus und teilen Sie mir Ihre Erfahrungen mit. Wir freuen uns über jeden Fehler oder Feedback zu Funktionen.

Das obige ist der detaillierte Inhalt vonEinführung in @rxliuli/vista: Eine einheitliche Request-Interceptor-Bibliothek für Fetch und XHR mit Middleware-Unterstützung.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!