javascript / intermediate
Snippet
Sichere Einbindung von Drittanbieter-Skripten mit Nonce-Verifizierung
Das dynamische Nachladen externer Skripte birgt Sicherheitsrisiken, wenn keine Prüfung erfolgt. Die Kombination von Subresource Integrity (SRI) mit Content Security Policy (CSP) Nonces garantiert, dass nachgeladene Skripte weder manipuliert wurden noch Sicherheitsrichtlinien verletzen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
export function loadSecureScript(url, integrityHash, cspNonce) {return new Promise((resolve, reject) => {const script = document.createElement('script');script.src = url;script.integrity = integrityHash;script.crossOrigin = 'anonymous';if (cspNonce) script.setAttribute('nonce', cspNonce);script.onload = () => resolve(true);script.onerror = () => reject(new Error(`Failed script load: ${url}`));document.head.appendChild(script);});}
svelte
Erklärung
1
script.integrity = integrityHash;
Weist einen kryptografischen Hash zu, den der Browser prüft, um Manipulationen der Skriptdatei zu verhindern.
2
script.crossOrigin = 'anonymous';
Aktiviert den CORS-Modus für die Integritätsprüfung über Domain-Grenzen hinweg.
3
if (cspNonce) script.setAttribute('nonce', cspNonce);
Fügt ein Nonce-Attribut hinzu, um strengen Content-Security-Policy-Regeln des Servers zu entsprechen.
4
script.onerror = () => reject(new Error(`Failed script load: ${url}`));
Fängt Ladefehler asynchron ab und weist das Promise mit einer aussagekräftigen Fehlermeldung zurück.