Wenn Sie mit der Content Security Policy (CSP) nicht vertraut sind, ist die Einführung in die Content Security Policy ein guter Ausgangspunkt. Dieses Dokument befasst sich mit der allgemeinen Webplattformansicht der CSP; die CSP für Chrome-Apps ist nicht so flexibel.
Die CSP ist eine Richtlinie zur Vermeidung von Problemen mit Cross-Site-Scripting. Wir alle wissen, dass Cross-Site-Scripting schlecht ist. Wir werden nicht versuchen, Sie davon zu überzeugen, dass es sich bei der CSP um eine warme und ungenaue neue Richtlinie handelt. Sie müssen lernen, grundlegende Aufgaben anders zu erledigen.
In diesem Dokument wird genau erläutert, was die CSP-Richtlinie für Chrome-Apps ist, was Sie tun müssen, um sie einzuhalten, und wie Sie diese grundlegenden Aufgaben weiterhin gemäß CSP-konform ausführen können.
Was ist die CSP für Chrome-Apps?
Die Content Security Policy für Chrome-Apps schränkt die folgenden Aktionen ein:
- Sie können auf Ihren Chrome App-Seiten keine Inline-Skripts verwenden. Die Einschränkung sperrt sowohl
<script>-Blöcke als auch Event-Handler (<button onclick="...">). - Sie können in keiner Ihrer Anwendungsdateien auf externe Ressourcen verweisen. Ausgenommen hiervon sind Video- und Audioressourcen. Sie können keine externen Ressourcen in einen iFrame einbetten.
- Sie können keine String-zu-JavaScript-Methoden wie
eval()undnew Function()verwenden.
Dies wird über den folgenden Richtlinienwert implementiert:
default-src 'self';
connect-src * data: blob: filesystem:;
style-src 'self' data: 'unsafe-inline';
img-src 'self' data:;
frame-src 'self' data:;
font-src 'self' data:;
media-src * data: blob: filesystem:;
Ihre Chrome-App kann nur auf Skripts und Objekte innerhalb der App verweisen, mit Ausnahme von Mediendateien. Apps können außerhalb des Pakets auf Video und Audio verweisen. Mit Chrome-Erweiterungen können Sie die standardmäßige Content Security Policy lockern, bei Chrome-Apps nicht.
CSP einhalten
Sämtlicher JavaScript-Code und sämtliche Ressourcen sollten lokal sein, d. h. alles wird in Ihrer Chrome-App verpackt.
„Aber wie kann ich...“
Es ist sehr möglich, dass Sie Vorlagenbibliotheken verwenden. Viele davon funktionieren mit der CSP nicht. Möglicherweise möchten Sie auch auf externe Ressourcen in Ihrer App zugreifen, z. B. externe Bilder, Inhalte von Websites.
Vorlagenbibliotheken verwenden
Verwenden Sie eine Bibliothek, die vorkompilierte Vorlagen anbietet, und schon sind Sie startklar. Sie können immer noch eine Bibliothek verwenden, die keine Vorkompilierung anbietet, aber dafür sind einige Schritte erforderlich und es gelten Einschränkungen.
Du musst die Sandbox verwenden, um alle Inhalte zu isolieren, die du auswerten möchtest. Sandboxing verbessert die CSP bei den von Ihnen angegebenen Inhalten. Wenn Sie die leistungsstarken Chrome-APIs in Ihrer Chrome-App nutzen möchten, können Ihre in einer Sandbox ausgeführten Inhalte nicht direkt mit diesen APIs interagieren (siehe Lokale Sandbox-Inhalte).
Auf Remote-Ressourcen zugreifen
Sie können Remote-Ressourcen über XMLHttpRequest abrufen und über blob:-, data:- oder filesystem:-URLs bereitstellen. Weitere Informationen finden Sie unter Auf externe Ressourcen verweisen.
Video und Audio können von Remote-Diensten geladen werden, da sie ein gutes Fallback-Verhalten haben, wenn sie offline oder bei schlechter Verbindung sind.
Webinhalte einbetten
Anstatt einen iFrame zu verwenden, kannst du eine externe URL mit einem WebView-Tag aufrufen (siehe Externe Webseiten einbetten).