Jak działa polityka bezpieczeństwa treści?

Meta-tag Content-Security-Policy pozwala zmniejszyć ryzyko atakówXSS , pozwalając określić, skąd zasoby mogą być ładowane, uniemożliwiając przeglądarkom ładowanie danych z innych lokalizacji. Utrudnia to atakującemu wprowadzenie złośliwego kodu do witryny.

Uderzyłem głową w ceglaną ścianę, próbując dowiedzieć się, dlaczego dostawałem błędy CSP jeden po drugim, i nie wydawało się, aby były jakieś zwięzłe, jasne instrukcje, jak to działa. Więc oto moja próba wyjaśnienianiektórych punktów CSP krótko, koncentrując się głównie na rzeczach, które uważam za trudne do rozwiązania.

Dla zwięzłości Nie będę pisać pełnego tagu w każdej próbce. Zamiast tego pokażę tylko właściwość content, więc próbka, która mówi content="default-src 'self'" oznacza to:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'">

1. Jak zezwolić na wiele źródeł?

Możesz po prostu wypisać swoje źródła po dyrektywie jako listę rozdzieloną spacjami:

content="default-src 'self' https://example.com/js/"

Zauważ, że nie ma cudzysłowów wokół parametry inne niż specjalne , takie jak 'self'. Poza tym nie ma dwukropka (:) po dyrektywie. Tylko dyrektywa, a następnie oddzielona spacjami lista parametrów.

Wszystko poniżej podanych parametrów jest domyślnie dozwolone. Oznacza to, że w powyższym przykładzie będą to ważne źródła: {]}

https://example.com/js/file.js
https://example.com/js/subdir/anotherfile.js

Te jednak nie będą ważne:

http://example.com/js/file.js
^^^^ wrong protocol

https://example.com/file.js
                   ^^ above the specified path

2. Jak korzystać z różnych dyrektyw, co każdy z nich robi?

Najbardziej wspólne dyrektywy to:

• default-src domyślna Polityka ładowania javascript, obrazów, CSS, czcionek, żądań AJAX, itp
• script-src definiuje poprawne źródła dla plików javascript
• style-src definiuje poprawne źródła dla plików css
• img-src definiuje poprawne źródła obrazów
• connect-src definiuje poprawne cele dla XMLHttpRequest( AJAX), WebSockets lub EventSource. Jeśli zostanie podjęta próba połączenia z hostem, który nie jest tu dozwolony, przeglądarka emuluje 400 błąd

3. Jak korzystać z wielu dyrektyw?

Definiujesz wszystkie dyrektywy wewnątrz jednego meta-tagu, kończąc je średnikiem (;):

content="default-src 'self' https://example.com/js/; style-src 'self'"

4. Jak obsługiwać porty?

content="default-src 'self' https://ajax.googleapis.com http://example.com:123/free/stuff/"

The powyższe skutkowałoby:

https://ajax.googleapis.com:123
                           ^^^^ Not ok, wrong port

https://ajax.googleapis.com - OK

http://example.com/free/stuff/file.js
                 ^^ Not ok, only the port 123 is allowed

http://example.com:123/free/stuff/file.js - OK

Jak wspomniałem, możesz również użyć gwiazdki, aby wyraźnie zezwolić wszystkim portom: {]}

content="default-src example.com:*"

5. Jak obsługiwać różne protokoły?

Domyślnie dozwolone są tylko standardowe protokoły. Na przykład, aby zezwolić WebSockets ws://, musisz zezwolić na to jawnie:

content="default-src 'self'; connect-src ws:; style-src 'self'"
                                         ^^^ web sockets are now allowed on all domains and ports

6. Jak zezwolić na protokół plików file://?

Jeśli spróbujesz zdefiniować to jako takie, to nie zadziała. Zamiast tego, pozwolicie na to z filesystem parametr:

content="default-src filesystem"

7. Jak używać wbudowanych skryptów i definicji stylów?

O ile wyraźnie nie jest to dozwolone, nie można używać definicji stylu w wierszu, kodu wewnątrz znaczników <script> ani we właściwościach znaczników, takich jak onclick. Pozwalasz im tak:

content="script-src 'unsafe-inline'; style-src 'unsafe-inline'"

Będziesz musiał również jawnie zezwolić na wbudowane, zakodowane obrazy base64:

content="img-src data:"

8. Jak pozwolić eval()?

Jestem pewien, że wiele osób powie, że nie, ponieważ "eval jest zły" i najprawdopodobniej przyczyną zbliżającego się końca świata. Ci ludzie by się mylili. Oczywiście, możesz zdecydowanie wybić poważne dziury w zabezpieczeniach swojej witryny za pomocą eval, ale ma to doskonale uzasadnione przypadki użycia. Po prostu trzeba być mądrym, żeby go używać. Pozwalasz na to tak:

content="script-src 'unsafe-eval'"

9. Co dokładnie oznacza 'self'?

Można przyjąć, że 'self' oznacza localhost, lokalny system plików lub cokolwiek na tym samym hoście. To nie znaczy nic z tych rzeczy. Oznacza źródła, które mają ten sam schemat (protokół), ten sam host i ten sam port co plik, w którym zdefiniowana jest polityka zawartości. Serwowanie witryny przez HTTP? Wtedy nie będzie dla Ciebie https, chyba że zdefiniujesz go jawnie.

Użyłem 'self' w większości przykładów, ponieważ zwykle ma to sens, ale nie jest to obowiązkowe. Zostaw to, jeśli nie potrzebujesz.

Ale poczekaj chwilę! nie mogę po prostu użyć content="default-src *" i skończyć z tym?

content="default-src * 'unsafe-inline' 'unsafe-eval'"

... ale ufam, że tego nie zrobisz.]}

Czytaj dalej:

Http://content-security-policy.com

Http://en.wikipedia.org/wiki/Content_Security_Policy