Каковы атрибуты целостности и происхождения?

363

Bootstrapcdn недавно изменил свои ссылки. Теперь это выглядит так:

<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">

Что означают атрибуты integrityи crossorigin? Как они влияют на загрузку таблицы стилей?

— Новый пользователь
источник

Ответы:

237

Оба атрибута были добавлены в Bootstrap CDN для реализации целостности подресурсов .

Subresource целостность определяет механизм , с помощью которого агенты пользователей могут проверить , что извлекается ресурс был доставлен без неожиданной манипуляции Reference

Атрибут целостности позволяет браузеру проверять источник файла, чтобы гарантировать, что код никогда не загружается, если источником манипулировали.

Атрибут Crossorigin присутствует, когда запрос загружается с использованием «CORS», что теперь является требованием проверки SRI, когда он не загружен из «того же источника». Больше информации о кроссоригине

Подробнее о внедрении Bootstrap CDN

— jim.taylor.1974
источник

Только что использовал валидатор w3c html и получил это сообщение при использовании атрибута «целостность»:Attribute integrity not allowed on element link at this point.

— Томас Гонсалес

@TomasGonzalez Я думаю, вы можете с уверенностью предположить, что инструмент w3c еще не обновлен и теперь включает поддержку SRI

— Josh_at_Savings_Champion

К вашему сведению: подал ошибку с валидатором тоже: github.com/validator/validator/issues/151

— jonathanKingston

Сопровождающий W3C HTML Checker (он же валидатор) здесь. Да, извините, контролер еще ничего не знает об integrityатрибуте. Но я скоро добавлю поддержку для него, как того требует github.com/validator/validator/issues/151 . Поэтому вы можете подписаться на эту проблему, чтобы получить уведомление, когда она появится.

— Sideshowbarker

OnlineWebCheck.com поддерживает integrityатрибут (я поддерживаю эту проверку).

— Альберт Верш

112

целостность - определяет хеш-значение ресурса (например, контрольной суммы), который должен соответствовать браузеру для его выполнения. Хеш гарантирует, что файл не был изменен и содержит ожидаемые данные. Таким образом, браузер не будет загружать разные (например, вредоносные) ресурсы. Представьте себе ситуацию, когда ваши файлы JavaScript были взломаны на CDN, и не было никакой возможности узнать это. Атрибут целостности предотвращает загрузку содержимого, которое не соответствует.

Неверный SRI будет заблокирован (Chrome Developer-Tools), независимо от перекрестного происхождения. Ниже NON-CORS случай, когда атрибут целостности не совпадает:

Целостность можно рассчитать, используя: https://www.srihash.org/ Или набрав в консоли ( ссылка ):

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

crossorigin - определяет параметры, используемые при загрузке ресурса с сервера из другого источника. (См. CORS (Обмен ресурсами между источниками) здесь: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS ). Это эффективно изменяет HTTP-запросы, отправленные браузером. Если добавлен атрибут «crossorigin» - это приведет к добавлению пары «ключ-значение origin: <ORIGIN>» в HTTP-запрос, как показано ниже.

crossorigin может быть установлен как «анонимный» или «использовать учетные данные». Оба приведут к добавлению источника: в запрос. Последний, однако, обеспечит проверку учетных данных. Отсутствие атрибута crossorigin в теге не приведет к отправке запроса без источника: пара ключ-значение.

Вот случай, когда запрашивается «use-credentials» из CDN:

<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>

Браузер может отменить запрос, если кроссориген неправильно установлен.

Ссылки
- https://www.w3.org/TR/cors/
- https://tools.ietf.org/html/rfc6454
- https://developer.mozilla.org/en-US/docs/Web/HTML / Элемент / ссылка

Блоги
- https://frederik-braun.com/using-subresource-integrity.html
- https://web-security.guru/en/web-security/subresource-integrity

— Витольд Качурба
источник

Очень полезный ответ!

— Эмиэль Конинг

Спасибо за Ваш ответ. Я люблю технические детали!

— Ань Чан

Как мы можем определить, является ли целостность файла той, которой еще не манипулировали? Любой совет?

— Вади Таслим

@ yon.fun: пожалуйста, не предлагайте правки для добавления собственных ссылок. Мы довольно чувствительны к возможному спаму, даже если ваш контент является ценным.

— halfer

Стоит ли включать SRI для ресурсов того же источника, и если да, то почему?

— Void

Технически, атрибут целостности помогает именно в этом - он позволяет правильно проверить источник данных. Таким образом, он просто позволяет браузеру проверять числа в правильном исходном файле с суммами, запрошенными исходным файлом, расположенным на сервере CDN.

Пройдя немного глубже, в случае установленного зашифрованного хеш-значения этого источника и его проверки на соответствие предварительно заданному значению в браузере - код выполняется, и пользовательский запрос успешно обрабатывается.

Атрибут Crossorigin помогает разработчикам оптимизировать показатели производительности CDN, одновременно защищая код сайта от вредоносных скриптов.

В частности, Crossorigin загружает программный код сайта в анонимном режиме, без загрузки файлов cookie или выполнения процедуры аутентификации. Таким образом, он предотвращает утечку пользовательских данных при первой загрузке сайта на определенном сервере CDN, и сетевые мошенники могут легко заменить адреса.

Источник: https://yon.fun/what-is-link-integrity-and-crossorigin/

— yon.fun
источник