Подтвердить что ты не робот

Назначение атрибута перекрестного происхождения...?

И в тегах изображений и скриптов.

Насколько я понимаю, вы можете получить доступ как к сценариям, так и к изображениям в других доменах. Так когда же использовать этот атрибут?

Это когда вы хотите ограничить возможность доступа других к вашим скриптам и изображениям?

Изображений:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-crossorigin

Сценарии:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script

4b9b3361

Ответ 1

Изображения с поддержкой CORS могут быть повторно использованы в элементе, не будучи испорченным. Допустимые значения:

Страница уже отвечает на ваш вопрос.

Если у вас есть изображение с поперечным проецированием, вы можете скопировать его в холст, но это "затушевывает" холст, который мешает вам его читать (чтобы вы не могли "украсть" изображения, например, из интрасети, где сам сайт не иметь доступ к). Однако, используя CORS, сервер, на котором хранится изображение, может сообщить браузеру, что доступ к кросс-началу разрешен и, таким образом, вы можете получить доступ к данным изображения через холст.

В MDN также есть страница об этой вещи: https://developer.mozilla.org/en-US/docs/HTML/CORS_Enabled_Image

Это, когда вы хотите ограничить возможность доступа других пользователей к вашим сценариям и изображениям?

Нет.

Ответ 2

Ответ можно найти в спецификации.

Для img:

Атрибут crossorigin является атрибутом CORS. Его цель - разрешить изображения с сторонних сайтов, которые позволяют использовать сквозной доступ с canvas.

и для script:

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

Ответ 3

Вот как мы успешно использовали атрибут crossorigin в теге script:

Проблема, с которой мы столкнулись: мы пытались регистрировать ошибки js на сервере, используя window.onerror

Почти все ошибки, которые мы регистрировали, имели это сообщение: Script error. и мы получили очень мало информации о том, как решить эти ошибки JS.

Оказывается, нативная реализация в chrome сообщать об ошибках

if (securityOrigin()->canRequest(targetUrl)) {
        message = errorMessage;
        line = lineNumber;
        sourceName = sourceURL;
} else {
        message = "Script error.";
        sourceName = String();
        line = 0;
}

отправит message как Script error. если запрошенный статический ресурс нарушает политику браузера того же происхождения.

В нашем случае мы обслуживали статический актив с CDN.

Мы решили это путем добавления атрибута crossorigin в тег script.

PS получил всю информацию из этого ответа

Ответ 4

Если вы разрабатываете быстрый фрагмент кода локально, и вы используете Chrome, есть проблема. если ваша страница загружается с использованием URL-адреса формы "file://xxxx", тогда попытка использовать getImageData() на холсте не удастся и выдает ошибку безопасности для перекрестного происхождения, даже если ваше изображение извлекается из того же каталог на вашем локальном компьютере в качестве страницы HTML, отображающей холст. Поэтому, если ваша HTML-страница извлечена из, скажем:

Файл://D:/wwwroot/mydir/mytestpage.html

и ваш файл Javascript и изображения извлекаются из, скажем:

файл://D:/wwwroot/mydir/mycode.js

Файл://D:/wwwroot/mydir/myImage.png

то, несмотря на то, что эти вторичные объекты извлекаются из одного и того же источника, ошибка безопасности все еще бросается.

По какой-то причине, вместо того, чтобы правильно установить источник, Chrome устанавливает атрибут origin требуемых объектов на "null", что делает невозможным проверку кода с использованием getImageData() просто путем открытия страницы HTML в вашем браузере и отладки локально.

Кроме того, по этой же причине установка свойства crossOrigin изображения на "анонимный" не работает.

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

Я просто попробовал запустить свой код в Firefox, и Firefox правильно это понял, узнав, что мое изображение происходит от того же источника, что и скрипты HTML и JS. Поэтому я бы приветствовал некоторые подсказки о том, как обойти проблему в Chrome, так как на данный момент, пока работает Firefox, отладчик больно медленный, с тем, чтобы удалить один шаг из отказа служебной атаки.

Ответ 5

Я узнал, как убедить Google Chrome разрешить ссылки на файл://, не перебрасывая ошибку перекрестного происхождения.

Шаг 1. Создайте ярлык (Windows) или эквивалент в других операционных системах;

Шаг 2: Задайте цель примерно следующим образом:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files

Этот специальный аргумент командной строки, --allow-file-access-from-files, сообщает Chrome о том, что вы можете использовать файл://ссылки на веб-страницы, изображения и т.д., не перебрасывая ошибки перекрестного происхождения при каждом попытке например, для переноса этих изображений на холст HTML. Он работает на моей установке Windows 7, но стоит проверить, будет ли он работать с Windows 8/10 и различными дистрибутивами Linux. Если это так, проблема решена - автономное развитие возобновляется как обычно.

Теперь я могу ссылаться на изображения и данные JSON из файлов://URI, без Chrome, бросающих ошибки кросс-оригинала, если я пытаюсь передать данные изображения на холст или передавать данные JSON в элемент формы.