Почему context.getImageData () выбрасывает междоменные исключения для меня по адресу https?

Question

У меня на сайте есть элемент canvas, который для некоторых пользователей генерирует междоменные исключения. Эта проблема возникла в Chrome, Firefox и Safari, но мне не удалось воспроизвести ее в любом браузере.

Вывод консоли из Chrome:

Unable to get image data from canvas because the canvas has been tainted by cross-origin data.

Ошибка выдается библиотекой StackBlur.js , где она вызывает imageData = context.getImageData( top_x, top_y, width, height );

Однако все изображения, используемые на сайте, находятся в одном домене, протоколе и порте. Пути генерируются Rails. Основной путь подобен https://myappp.com/, а пути к изображению - https://myapp.com/assets/promo/slideshow/slides/myslideimage.jpg

Развертывание точно такого же кода на нашем промежуточном сайте (который не использует HTTPS) http://staging.myapp.com/ с путями к изображениям, такими как http://myapp.com/assets/promo/slideshow/slides/myslideimage.jpg, не приводит к ошибкам.

Почему использование HTTPS может вызывать проблемы между доменами?

Спасибо.

Answer 1

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

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