Subresource Integrity für Vercel konfigurieren
Schritt-für-Schritt-Anleitung: SRI-Hashes für externe Scripts generieren und CDN-Manipulationen auf Vercel-Deployments erkennen.
Subresource Integrity auf Vercel
Subresource Integrity (SRI) schützt gegen manipulierte externe Ressourcen. Browser prüfen den Hash-Wert einer Datei gegen den im HTML deklarierten Wert — stimmen sie nicht überein, wird die Ressource blockiert. SRI ist mit 15 von 166 Punkten im Wolf-Agents Web Security Check bewertet.
Auf Vercel ist SRI ein Framework-seitiges Feature — es wird nicht per vercel.json konfiguriert, sondern direkt im HTML oder über die Framework-Konfiguration (z.B. Next.js experimental.sri). Generieren Sie SRI-Hashes für alle externen CDN-Ressourcen und binden Sie sie als integrity-Attribut ein.
SRI-Hashes generieren
Generieren Sie SHA-384-Hashes für alle externen Scripts und Stylesheets. Verwenden Sie openssl oder Online-Tools wie srihash.org. Für eigene Assets auf Vercels CDN ist SRI optional, da Sie die Dateien selbst kontrollieren — für Third-Party-CDNs ist es unverzichtbar.
# SRI-Hash generieren (SHA-384)
curl -s https://cdn.example.com/lib.js | openssl dgst -sha384 -binary | openssl base64 -A
# Ergebnis:
sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wCintegrity-Attribut einbinden
Fügen Sie den generierten Hash als integrity-Attribut in Ihre Script- und Link-Tags ein. Das crossorigin="anonymous"-Attribut ist bei externen Ressourcen zwingend erforderlich — ohne CORS funktioniert die Hash-Prüfung nicht. In Next.js können Sie SRI auch über die experimentelle Konfiguration aktivieren.
<!-- Externes Script mit SRI -->
<script
src="https://cdn.example.com/lib.js"
integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
crossorigin="anonymous"
></script>
<!-- Externes Stylesheet mit SRI -->
<link
rel="stylesheet"
href="https://cdn.example.com/style.css"
integrity="sha384-..."
crossorigin="anonymous"
/>// next.config.ts — SRI für Next.js (experimental)
const nextConfig = {
experimental: {
sri: {
algorithm: 'sha384',
},
},
};
export default nextConfig;SRI verifizieren
Öffnen Sie die Browser DevTools (F12) und prüfen Sie den Network-Tab. Ressourcen mit gültigem SRI werden normal geladen. Ändern Sie zum Testen den Hash-Wert — der Browser blockiert die Ressource mit einer Fehlermeldung in der Console. Der Wolf-Agents Web Security Check erkennt fehlende SRI-Attribute automatisch.
# HTML-Quellcode auf SRI-Attribute prüfen
curl -s https://ihre-domain.vercel.app | grep -oE 'integrity="sha[0-9]+-[^"]+"'
# Erwartete Ausgabe:
# integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K..."
# Hash einer externen Ressource manuell prüfen
curl -s https://cdn.example.com/lib.js | openssl dgst -sha384 -binary | openssl base64 -A
# DevTools Console — bei falschem Hash erscheint:
# Failed to find a valid digest in the 'integrity' attribute
# for resource 'https://cdn.example.com/lib.js'Häufige Fehler
crossorigin-Attribut fehlt
Ohne crossorigin="anonymous" funktioniert SRI bei externen Ressourcen nicht. Der Browser kann den Hash nicht prüfen, wenn CORS nicht aktiviert ist.
CDN-Update ändert den Hash
Wenn ein CDN die Datei aktualisiert, ändert sich der Hash und SRI blockiert die Ressource. Pinnen Sie CDN-Versionen (z.B. lib@1.2.3) oder aktualisieren Sie Hashes bei Updates.
SRI für dynamische Inhalte ungeeignet
SRI funktioniert nur für statische Dateien mit unveränderlichem Inhalt. API-Responses oder dynamisch generierte Scripts können nicht mit SRI geschützt werden.
Vercel Edge Network ändert keine Datei-Hashes
Anders als manche CDNs komprimiert Vercel Assets erst bei der Auslieferung (Brotli/Gzip). SRI-Hashes werden gegen den unkomprimierten Inhalt geprüft — das funktioniert korrekt. Probleme entstehen nur bei CDNs, die Dateien modifizieren (z.B. Minifizierung durch Cloudflare). Pinnen Sie trotzdem CDN-Versionen.
Compliance-Relevanz
SRI schützt gegen Supply-Chain-Angriffe über kompromittierte CDNs. PCI DSS 4.0 fordert Integritätsprüfungen für externe Scripts auf Zahlungsseiten. NIS2 verlangt Maßnahmen gegen Lieferketten-Angriffe. Der Wolf-Agents Web Security Check prüft SRI-Attribute für alle extern geladenen Scripts und Stylesheets.
Wie steht Ihre Domain bei Subresource Integrity?
Prüfen Sie es jetzt — kostenlos, ohne Registrierung, mit 166 Prüfpunkte.