Атрибут crossorigin является частью технологии CORS и применяется при загрузке таблицы стилей или иконки со стороннего сайта.
CORS (Cross-origin resource sharing, совместное использование ресурсов между разными источниками) — это механизм, который позволяет веб-страницам делать запросы к ресурсам с другого домена.
По умолчанию браузеры блокируют запросы к таким ресурсам из соображений безопасности, это называется «политика одного источника». CORS позволяет серверу разрешить запросы с разных доменов путём отправки специальных HTTP-заголовков «Access-Control-Allow-Origin». К примеру, если на сервере разрешён доступ с любого стороннего ресурса, то сервер вернёт следующий заголовок:
Access-Control-Allow-Origin: *
Браузер автоматически добавляет заголовок «Origin» в запрос, указывая источник запроса.
Если сервер отправляет заголовок «Access-Control-Allow-Origin» со значением, совпадающим с «Origin» (или с маской «*», как показано выше), запрос разрешается.
Origin: webref.ru
Синтаксис
<link href="<адрес>" crossorigin="anonymous | use-credentials">
Значения
- anonymous
- Запрос к серверу отправляется без учётной записи пользователя (не передаются куки браузера, сертификат X.509, логин и пароль).
- use-credentials
- Запрос включает все учётные данные пользователя (куки браузера, сертификат X.509, логин, пароль и запрос на авторизацию).
Пустое или некорректно значение считается как anonymous.
Пример
<!DOCTYPE html>
<html lang="ru">
<head>
<title>link</title>
<meta charset="utf-8">
<link href="https://htmlbook.ru/example/style/header.css"
rel="stylesheet" crossorigin="anonymous">
</head>
<body>
<h2>Заголовок</h2>
</body>
</html>
В данном примере если загрузка со стороннего ресурса не блокируется политикой CORS, то цвет заголовка станет красным. В противном случае цвет останется исходным.
Браузеры
Браузеры
В таблице браузеров применяются следующие обозначения.
- — элемент полностью поддерживается браузером;
- — элемент браузером не воспринимается и игнорируется;
- — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.
Число указывает версию браузреа, начиная с которой элемент поддерживается.