Was ist eine URL-Transformation?
Eine URL-Transformation bildet Anweisungen zur Medienverarbeitung in einer Anfrage-URL ab, sodass eine abgeleitete Mediendatei während der Auslieferung erzeugt oder abgerufen werden kann. Signaturen und die Validierung von Parametern können die zulässigen Vorgänge einschränken.
So funktionieren URL-Transformationen
Ein Dienst für URL-Transformationen liest zwei Dinge aus der Anfrage-URL: welche Quelldatei verwendet werden soll und was damit geschehen soll. Bei einem Cache-Miss ruft er die Quelle ab, führt die Verarbeitung aus, speichert das Ergebnis und gibt es zurück; bei einem Cache-Treffer gibt er das gespeicherte Ergebnis ohne erneute Verarbeitung zurück. Cloudflare beschreibt diesen Ablauf für seine Bildtransformationen, und Cloudinary erzeugt die abgeleitete Datei beim ersten Zugriff auf eine Transformations-URL. Die URL beschreibt somit die auszuführende Arbeit und bildet den Ausgangspunkt für den Cache-Schlüssel, mit zwei Einschränkungen: Ein Dienst kann die URL zunächst normalisieren, und wenn die Ausgabe auch von Anfrageheadern abhängt, etwa bei der automatischen Formatauswahl, kann eine URL mehrere zwischengespeicherte Ergebnisse erzeugen. Die Syntax variiert je nach Dienst: Cloudinary und imgproxy platzieren die Vorgänge in Pfadsegmenten, imgix verwendet Abfrageparameter, und das Smart CDN von Transloadit benennt ein gespeichertes Template im Pfad und übergibt dessen Variablen als Abfrageparameter. Auch ob die angegebene Reihenfolge der Vorgänge relevant ist, hängt vom Dienst ab. Cloudinary führt jede durch Schrägstriche getrennte Komponente auf dem Ergebnis der vorherigen aus, während imgproxy und Fastly Image Optimizer Optionen in beliebiger Reihenfolge akzeptieren und sie in einer festen internen Reihenfolge anwenden.
Wichtige Fakten
- Was hindert jemanden daran, Tausende von Größen anzufordern? Nichts, sofern Sie nicht einschränken, welche URLs gültig sind. Die Dokumentation von Thumbor bezeichnet dies als URL-Manipulation und zeigt als Angriff eine Schleife über verschiedene Abmessungen. Aus demselben Grund empfiehlt imgproxy, dessen Signaturprüfung standardmäßig deaktiviert ist, diese im Produktivbetrieb zu aktivieren. Übliche Schutzmaßnahmen sind eine Signatur, die Optionen und Quelle abdeckt (imgproxy signiert den gesamten Pfad nach der Signatur, Thumbor die Optionen und die Bild-URL), oder eine Positivliste zulässiger Transformationen (die Einstellung für strikte Transformationen von Cloudinary). Eine gespeicherte Vorlage, die wenige Variablen zugänglich macht, begrenzt, welche Optionen ein Aufrufer ändern kann, aber nicht, wie viele Werte jede davon akzeptiert: Eine Vorlage mit einer frei wählbaren Breitenvariable lässt die Schleife weiterhin zu. Kombinieren Sie sie daher mit einer Signatur oder einer festen Liste zulässiger Werte. Das Signieren erfordert einen geheimen Schlüssel. Signierte URLs müssen deshalb von Ihrem Server ausgegeben werden und dürfen nicht im Browsercode zusammengesetzt werden. Eine Signatur blockiert neue Varianten nur, wenn sie jede Option abdeckt: imgix weist darauf hin, dass ein nicht signierter Wert für
expiresin der Abfragezeichenfolge frei geändert werden kann. - Teilen sich zwei URLs, die dieselbe Ausgabe erzeugen, einen Cache-Eintrag? Gehen Sie nicht davon aus: Das hängt vom Cache-Schlüssel des Dienstes und davon ab, ob er URLs normalisiert. CloudFront dokumentiert, dass
?color=red&size=largeund?size=large&color=redseparat abgerufen und zwischengespeichert werden, wenn Abfrageparameter für das Caching verwendet werden. Unterschiede in der Groß- und Kleinschreibung führen ebenfalls zu getrennten Abrufen und Cache-Einträgen. Der CDN-Cache von Cloudflare behandelt Abfragezeichenfolgen mit unterschiedlicher Parameterreihenfolge standardmäßig als verschieden. Mit der optionalen Einstellung Query String Sort werden sie vor der Cache-Abfrage sortiert. Für die Abrechnung gelten eigene Regeln: Cloudinary zählt unterschiedlich geschriebene Transformationen, etwa dieselben Parameter in einer anderen Reihenfolge, als separate Transformationen, selbst wenn das Ergebnis identisch ist. Cloudflare speichert und berechnet jede eindeutige Kombination aus Quellbild und Parametern separat. Erzeugen Sie URLs mit einer einzigen Hilfsfunktion, die Parameter in einer festen Reihenfolge und Groß- und Kleinschreibung ausgibt, und runden Sie angeforderte Breiten auf Werte aus einer kurzen Liste von Größen. - Was passiert mit bestehenden Varianten, wenn die Quelldatei ersetzt wird? Sie können weiterhin ausgeliefert werden, weil ihre URLs unverändert sind. Cloudinary erklärt, dass ausgelieferte Versionen mit oder ohne Transformationen nach dem Überschreiben eines Assets auf CDN-Servern zwischengespeichert bleiben können, sofern sie nicht invalidiert werden. Kopien können außerdem in Browsern und Proxys außerhalb des Netzwerks von Cloudinary verbleiben. Der Anbieter empfiehlt eine Versionskomponente in der URL, wenn die neueste Datei sofort ausgeliefert werden muss. Wenn Sie URLs auch signieren, prüfen Sie, ob die Invalidierung diese ebenfalls erfasst: Cloudinary invalidiert signierte URLs standardmäßig nicht. imgproxy bietet die Option
cachebuster, die die URL ändert, ohne die Verarbeitung zu ändern, und empfiehlt sie statt eines Query-Strings, weil sie signiert werden kann. Planen Sie vor dem Start eine der beiden Möglichkeiten ein: eine Version in der URL oder im Quellpfad oder einen expliziten Schritt zur Invalidierung.
Wann URL-Transformationen relevant sind
Nutzen Sie URL-Transformationen, wenn sich responsive Größen oder Varianten nicht vollständig vorhersagen und vorab erzeugen lassen. Unbegrenzte Abmessungen oder unsignierte Parameter können missbräuchliche Verarbeitung, Cache-Fragmentierung und unerwartete Kosten ermöglichen.
So hilft Transloadit bei URL-Transformationen
Smart CDN von Transloadit ist ein Dienst für URL-Transformationen auf Basis von Templates. In einer URL der Form tlcdn.com bezeichnet der Hostname Ihren Workspace, der Pfad ein gespeichertes Template und die Quelldatei. Die Query-Parameter befüllen die Assembly Variables, die das Template ausliest, etwa ${fields.w} für eine Breite. Die Verarbeitungs-Steps selbst sind im Template hinterlegt, sodass Aufrufende nur die Werte ändern können, die das Template freigibt. Das dokumentierte Beispiel übergibt den Query-Parameter w direkt als Breite für die Größenänderung. Die Freigabe einer Variable beschränkt Aufrufende also nicht von selbst auf die Größen, die Ihre Seiten verwenden; Transloadit empfiehlt, die veränderbaren Parameter festzulegen und Anfragen mit signierten URLs zu autorisieren. Die Signatur ist ein HMAC, der den Workspace, den Template-Namen, den Dateipfad und die sortierten Query-Parameter umfasst und so Änderungen an den Parametern verhindert. Sie muss auf Ihrem Backend erzeugt werden, weil dafür Ihr Auth Secret verwendet wird.
Das Signieren wird als optional beschrieben, und die verlinkten Seiten erklären nicht, wie unsignierte URLs abgewiesen werden. Überprüfen Sie dies daher in Ihrem eigenen Workspace, bevor Sie sich darauf verlassen, dass Signaturen neue Varianten blockieren. Die Seiten beschreiben auch keine Operation zum Leeren des Caches und erklären nicht, was mit einem zwischengespeicherten Ergebnis passiert, wenn die Quelldatei unter demselben Pfad ersetzt wird. Wird die Ersatzdatei unter einem neuen Pfad gespeichert, ändert sich die URL; testen Sie den Fall mit unverändertem Pfad in Ihrem eigenen Workspace, bevor Sie sich darauf verlassen.
Quellen
- Cloudflare Images: Überblick über Transformationen (Cache-Treffer, Cache-Miss, Abrechnung)
- Cloudinary: Bildtransformationen (URL-Struktur, verkettete Transformationen, Zählung)
- Cloudinary: wie Transformationen gezählt werden (URL-Änderungen, automatisches Format)
- Cloudinary: Zugriff auf Medien steuern (strikte Transformationen, signierte URLs)
- Cloudinary: zwischengespeicherte Assets und Asset-Versionen invalidieren
- imgproxy: Signieren einer URL
- imgproxy: Verarbeitungsoptionen einschließlich cachebuster
- imgproxy: zur Verarbeitungspipeline
- imgproxy: externer Cache (Anfrage-Header im Cache-Schlüssel)
- Thumbor: Sicherheit und URL-Manipulation
- imgix: Assets absichern
- Referenz zu Fastly Image Optimizer: Verarbeitungsreihenfolge
- Amazon CloudFront: Inhalte anhand von Query-String-Parametern zwischenspeichern
- Cloudflare Cache: Query String Sort