tailor
3.9.2
Tailor ist ein Layout -Dienst, der Streams verwendet, um eine Webseite aus Fragmentdiensten zu komponieren. O'Reilly beschreibt es im Titel dieses Blog -Beitrags als "eine Bibliothek, die eine Middleware bietet, die Sie in jeden Node.js -Server integrieren können". Es ist teilweise von Facebooks Bigpipe inspiriert, aber in einem E -Commerce -Kontext entwickelt.
Einige Funktionen und Vorteile des Schneiders:
Tailor ist Teil von Project Mosaic, das Entwicklern helfen soll, Microservices für den Frontend zu erstellen. Das Mosaik enthält auch einen erweiterbaren HTTP -Router für die Service -Komposition (Skipper) mit verwandtem erholsamen API, der Routen (Gastwirt) speichert. Weitere Komponenten finden Sie in der Pipeline für die Veröffentlichung. Wenn Ihr Front-End-Team den Übergang von Monolith-to-Microservices zum Übergang macht, finden Sie möglicherweise Schneider und seine verfügbaren Geschwister.
Microservices erhalten heutzutage viel Traktion. Sie ermöglichen es mehreren Teams, unabhängig voneinander zu arbeiten, ihre eigenen Technologiestapel auszuwählen und ihre eigenen Release -Zyklen zu etablieren. Leider hat die Frontend -Entwicklung noch nicht vollständig auf die Vorteile von Microservices teilgenommen. Die übliche Praxis zum Erstellen von Websites bleibt „der Monolith“: eine einzige Frontend -Codebasis, die mehrere APIs verbraucht.
Was wäre, wenn wir Microservices am Frontend haben könnten? Dies würde es Frontend -Entwicklern ermöglichen, mit ihren Backend -Kollegen in derselben Funktion zusammenzuarbeiten und Teile der Website unabhängig bereitzustellen - „Fragmente“ wie Header, Produkt und Fußzeile. Das Einbringen von Microservices an den Frontend erfordert einen Layout -Service, der eine Website aus Fragmenten zusammenstellt. Schneider wurde entwickelt, um dieses Bedürfnis zu lösen.
Verwenden Sie den Schneider mit:
yarn add node-tailor const http = require ( 'http' ) ;
const Tailor = require ( 'node-tailor' ) ;
const tailor = new Tailor ( { /* Options */ } ) ;
const server = http . createServer ( tailor . requestHandler ) ;
server . listen ( process . env . PORT || 8080 ) ; fetchContext(request) - Funktion, die ein Versprechen des Kontexts zurückgibt, dh ein Objekt, das die Fragment -ID in die Fragment -URL bildet, um URLs der Fragmente auf der Seite zu überschreiben, standardmäßig zu Promise.resolve({})fetchTemplate(request, parseTemplate) - Funktion, die die Vorlage abrufen, parseTemplate aufrufen und ein Versprechen des Ergebniss zurückgeben sollte. Nützlich, um Ihren eigenen Weg zu implementieren, um die Vorlagen abzurufen und zwischen S3 abzurufen. Standardimplementierung lib/fetch-template.js ruft die Vorlage aus dem Dateisystem abtemplatesPath - Um den Pfad anzugeben, an dem die Vorlagen lokal gespeichert werden, standardmäßig /templates/fragmentTag - Name des Fragment -Tags, Standard zu fragmenthandledTags - Eine Reihe von benutzerdefinierten Tags, prüfen Sie tests/handle-tag um weitere Informationen zu erhaltenhandleTag(request, tag, options, context) - empfängt ein Tag oder ein Schließ -Tag und serialisiert es in eine Zeichenfolge oder gibt einen Stream zurückfilterRequestHeaders(attributes, request) - Funktion, die die Anforderungsübergänge filtert, die an lib/filter-headers übergeben werden, prüfenfilterResponseHeaders(attributes, headers) - Funktion, die die angegebenen Antwortheader von der primären Fragmentanforderung zur endgültigen Antwort abgebildetmaxAssetLinks - Anzahl der Link -Header -Direktiven für CSS und JS Respektiert pro Fragment - Standardeinstellungen zu 1requestFragment(filterHeaders)(url, attributes, request) - Funktion, die ein Versprechen der Anfrage an einen Fragmentserver zurückgibt, überprüfen Sie die Standardimplementierung in lib/request-fragmentamdLoaderUrl - URL zu AMD Loader. Wir verwenden Anforderungen von CDNJs als StandardpipeInstanceName - Rohrinstanzname, der im Browserfenster verfügbar ist, um Frontend -Haken zu verbrauchen.pipeAttributes(attributes) - Funktion, die den minimalen Satz von Fragmentattributen zurückgibt, die auf den Frontend -Hooks verfügbar sind.tracer - OpenTracing -konforme Tracer -Implementierung. Tailor verwendet Parse5, um die Vorlage zu analysieren, wo sie jeden fragmentTag durch einen Stream aus dem Fragmentserver ersetzt und durch das Ergebnis der handleTag -Funktion handledTags .
< html >
< head >
< script type =" fragment " src =" http://assets.domain.com " > </ script >
</ head >
< body >
< fragment src =" http://header.domain.com " > </ fragment >
< fragment src =" http://content.domain.com " primary > </ fragment >
< fragment src =" http://footer.domain.com " async > </ fragment >
</ body >
</ html >id - Optionale eindeutige Kennung (autogeneriert)src - URL des Fragmentsprimary - bezeichnet ein Fragment, das den Antwortcode der Seite festlegttimeout - optionales Fragment -Fragment -in -Millisekunden -Zeitpunkt (Standard ist 3000)async - Verschreibt das Fragment bis zum Ende des Body -Tagspublic - Um zu verhindern, dass der Schneider gefilterte Anfrage -Header von stromaufwärts zu den Fragmenten weiterleitet.fallback-src - URL des Fallback -FragmentAndere Attribute sind zulässig und werden auch an relevante Funktionen übergeben (z. B.
filterRequestHeaders,filterResponseHeadersusw.)
Ein Fragment ist ein HTTP -Server, der nur den Teil der Seite rendert und Link -Header so festlegt, dass sie URLs für CSS und JavaScript -Ressourcen bereitstellen. Überprüfen Sie examples/basic-css-and-js/index.js für eine Implementierungentwurfs.
Ein JavaScript des Fragments ist ein AMD -Modul, das eine init -Funktion exportiert, die mit DOM -Element des Fragments als Argument aufgerufen wird.
Schneider folgt nicht den Umleitungen, selbst wenn die Fragmentantwort "Ort" -Header enthält, das ist absichtlich, da Weiterleitungen eine unerwünschte Latenz einführen können. Fragmente mit dem Attribut primary können eine Umleitung durchführen, da es den Statuscode der Seite steuert.
Hinweis: Für die Kompatibilität mit AWS kann der Link Header auch als x-amz-meta-link übergeben werden
Standardmäßig wird die eingehende Anforderung zur Auswahl der Vorlage verwendet.
Um die index.html -Vorlage zu erhalten, gehen Sie zu /index .
Wenn Sie /product/my-product-123 anhören möchten, um zu product.html Vorlage zu gehen, können Sie die req.url in /product ändern.
Jeder Header wird standardmäßig gefiltert, um Ausgrenzungsinformationen zu vermeiden. Sie können jedoch den ursprünglichen URI und Host geben, indem Sie sie zu den Header, x-request-host und x-request-uri hinzufügen, und dann im Fragment die Headers zu wissen, um zu wissen, welches Produkt abrufen und angezeigt werden.
http
. createServer ( ( req , res ) => {
req . headers [ 'x-request-uri' ] = req . url
req . url = '/index'
tailor . requestHandler ( req , res ) ;
} )
. listen ( 8080 , function ( ) {
console . log ( 'Tailor server listening on port 8080' ) ;
} ) ;Einige der Konzepte des Schneiders werden ausführlich auf den spezifischen Dokumenten beschrieben.
Tailor hat die verteilte Verzeichnis -Instrumentierung mit OpenTracing aus der Box. Es wird einen beliebigen Spannungskontext in der Eingangsanforderung in HTTP aufnehmen und sie in die vorhandenen Remote -Prozedur -Aufrufe (RPCs) verbreiten.
Derzeit ist nur das Abrufen von Fragmenten instrumentiert und bietet einige zusätzliche Details wie das Fragment -Tag, Attribute und einige Protokollierungsnutzlast wie die Stapelspur für Fehler.
# Get a copy of the repository
git clone https://github.com/zalando/tailor.git
# Change to the folder
cd tailor
# Install dependencies
yarnnode examples/basicnode examples/basic-css-and-jsnode examples/multiple-fragments-with-custom-amdnode examples/fragment-performanceGehen Sie nach dem Ausführen des spezifischen Beispiels zu http: // localhost: 8080/Index.
Hinweis: Bitte führen Sie die Beispiele mit Knotenversionen> 6.0.0 aus
Auch einseitige Anwendungsbeispiele sind verfügbar:
Um den Benchmark auszuführen, führen Sie npm run benchmark und warten Sie ein paar Sekunden, um die Ergebnisse zu sehen.
Bitte überprüfen Sie die beitragenden Richtlinien hier.
