Was sind die Integritäts- und Crossorigin-Attribute?

362

Bootstrapcdn hat kürzlich seine Links geändert. Es sieht jetzt so aus:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" 
rel="stylesheet" 
integrity="sha256-MfvZlkHCEqatNoGiOXveE8FIwMzZg4W85qfrfIFBfYc= sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" 
crossorigin="anonymous">

Was bedeuten die integrityund crossoriginAttribute? Wie wirken sie sich auf das Laden des Stylesheets aus?

— Neuer Benutzer
quelle

Antworten:

237

Beide Attribute wurden dem Bootstrap-CDN hinzugefügt, um die Subresource-Integrität zu implementieren .

Subresource Integrity definiert einen Mechanismus, mit dem Benutzeragenten überprüfen können, ob eine abgerufene Ressource ohne unerwartete Manipulationsreferenz bereitgestellt wurde

Das Integritätsattribut soll es dem Browser ermöglichen, die Dateiquelle zu überprüfen, um sicherzustellen, dass der Code niemals geladen wird, wenn die Quelle manipuliert wurde.

Das Crossorigin-Attribut ist vorhanden, wenn eine Anforderung mit 'CORS' geladen wird. Dies ist jetzt eine Anforderung der SRI-Prüfung, wenn sie nicht vom 'gleichen Ursprung' geladen wird. Weitere Infos zu Crossorigin

Weitere Informationen zur Implementierung von Bootstrap-CDNs

— jim.taylor.1974
quelle

Ich habe gerade den HTML-Validator w3c verwendet und diese Meldung erhalten, wenn ich das Attribut "Integrität" verwende:Attribute integrity not allowed on element link at this point.

— Tomas Gonzalez

@TomasGonzalez Ich denke, Sie können davon ausgehen, dass das w3c-Tool noch nicht aktualisiert wurde, um SRI-Unterstützung

— einzuschließen

— Ihrer Information

Betreuer des W3C HTML Checker (auch bekannt als Validator) hier. Ja, tut mir leid, der Prüfer weiß noch nichts über das integrityAttribut. Aber ich werde bald Unterstützung dafür hinzufügen, wie unter github.com/validator/validator/issues/151 angefordert . Vielleicht möchten Sie dieses Problem abonnieren, um eine Benachrichtigung zu erhalten, wenn es landet.

— Sideshowbarker

OnlineWebCheck.com unterstützt das integrityAttribut (ich bin der Betreuer dieses Prüfers).

— Albert Wiersch

112

Integrität - Definiert den Hashwert einer Ressource (wie eine Prüfsumme), die abgeglichen werden muss, damit der Browser sie ausführt. Der Hash stellt sicher, dass die Datei unverändert war und erwartete Daten enthält. Auf diese Weise lädt der Browser keine unterschiedlichen (z. B. böswilligen) Ressourcen. Stellen Sie sich eine Situation vor, in der Ihre JavaScript-Dateien auf dem CDN gehackt wurden und es keine Möglichkeit gab, dies zu wissen. Das Integritätsattribut verhindert das Laden von Inhalten, die nicht übereinstimmen.

Ungültige SRI werden blockiert (Chrome Developer-Tools), unabhängig von der Herkunft. Unterhalb des NON-CORS-Falls, wenn das Integritätsattribut nicht übereinstimmt:

Die Integrität kann berechnet werden unter: https://www.srihash.org/ Oder durch Eingabe in die Konsole ( Link ):

openssl dgst -sha384 -binary FILENAME.js | openssl base64 -A

crossorigin - Definiert Optionen, die verwendet werden, wenn die Ressource von einem Server auf einem anderen Ursprung geladen wird. (Siehe CORS (Cross-Origin Resource Sharing) hier: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS ). Es ändert effektiv die vom Browser gesendeten HTTP-Anforderungen. Wenn das Attribut "crossorigin" hinzugefügt wird, wird das Schlüssel-Wert-Paar origin: <ORIGIN> zur HTTP-Anforderung hinzugefügt, wie unten gezeigt.

crossorigin kann entweder auf "anonym" oder "Anmeldeinformationen" gesetzt werden. Beides führt zum Hinzufügen von origin: zur Anforderung. Letzteres stellt jedoch sicher, dass die Anmeldeinformationen überprüft werden. Kein Crossorigin-Attribut im Tag führt zum Senden einer Anforderung ohne Ursprung: Schlüssel-Wert-Paar.

Hier ist ein Fall, in dem "Use-Credentials" von CDN angefordert werden:

<script 
        src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"
        integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" 
        crossorigin="use-credentials"></script>

Ein Browser kann die Anforderung abbrechen, wenn Crossorigin falsch eingestellt ist.

Links
- https://www.w3.org/TR/cors/
- https://tools.ietf.org/html/rfc6454
- https://developer.mozilla.org/en-US/docs/Web/HTML / Element / Link

Blogs
- https://frederik-braun.com/using-subresource-integrity.html
- https://web-security.guru/en/web-security/subresource-integrity

— Witold Kaczurba
quelle

Sehr nützliche Antwort!

— Emiel Koning

Danke für deine Antwort. Ich liebe technische Details!

— Anh Tran

Wie können wir feststellen, ob die Integrität der Datei noch nicht manipuliert wurde? Irgendein Rat?

— Vadi Taslim

@ yon.fun: Bitte schlagen Sie keine Änderungen vor, um Ihre eigenen Links hinzuzufügen. Wir reagieren hier sehr empfindlich auf möglichen Spam, auch wenn Ihre Inhalte wertvoll sind.

— Halfer

Technisch hilft das Integrity-Attribut dabei - es ermöglicht die ordnungsgemäße Überprüfung der Datenquelle. Das heißt, der Browser kann lediglich die Nummern in der richtigen Quelldatei mit den Beträgen überprüfen, die von der Quelldatei auf dem CDN-Server angefordert werden.

Wenn der festgelegte verschlüsselte Hashwert dieser Quelle und die überprüfte Übereinstimmung mit einem vordefinierten Wert im Browser etwas tiefer gehen, wird der Code ausgeführt und die Benutzeranforderung wird erfolgreich verarbeitet.

Das Crossorigin-Attribut hilft Entwicklern dabei, die CDN-Leistung zu optimieren und gleichzeitig den Website-Code vor schädlichen Skripten zu schützen.

Insbesondere lädt Crossorigin den Programmcode der Site im anonymen Modus herunter, ohne Cookies herunterzuladen oder den Authentifizierungsvorgang durchzuführen. Auf diese Weise wird verhindert, dass Benutzerdaten verloren gehen, wenn Sie die Site zum ersten Mal auf einen bestimmten CDN-Server laden. Diese Netzwerkbetrüger können Adressen problemlos ersetzen.

Quelle: https://yon.fun/what-is-link-integrity-and-crossorigin/

— yon.fun
quelle