Исключение безопасности CORS/перекрестного домена при назначении видеотега HTML5 текстуре webGL

Я хотел бы назначить удаленное видео текстуре в WebGL. Поскольку источник видео отличается от источника документа, я добавил Access-Control-Allow-Origin:* в заголовки http источника видео. Кроме того, я назначил анонимное происхождение видеотеку с помощью video.crossOrigin = '';. Интересно, что атрибут кросс-домена работает с изображениями, но НЕ с тегом видео. Как только текстуру WebGL присваивается видеообъекту, javascript генерирует следующее исключение:

Непринятая ошибка: SECURITY_ERR: исключение DOM 18

Вот вам jsfiddle, чтобы воспроизвести эту проблему. Этот пример основан на примере webgl_kinect из файла three.js: http://jsfiddle.net/ZgeTU/2/

Вот соответствующие разделы:

// CROSS-ORIGIN VIDEO SOURCE 
// REMOTE VIDEO SOURCE PROVIDES "Access-Control-Allow-Origin:*" HEADER
video.src =
  'http://kammerl.de/threejs/three.js/examples/textures/kinect.webm';
// DEFINING ANONYMOUS ORIGIN
video.crossOrigin = '';
video.play();

Затем тег видео привязан к тексту Three.js:

texture = new THREE.Texture( video );

По-видимому, эта проблема с использованием видеоролика crossOrigin в webGL известна некоторое время, но я не нашел никаких обновлений: http://jbuckley.ca/2012/02/cross-origin-video/

Кто-нибудь знает, каков статус этой проблемы? Есть ли способ обхода доступа к удаленным видео в webGL? Любая помощь очень ценится!

Спасибо!

Ответы

Ответ 1

Поскольку вы работаете в jquery, и рекомендуется использовать некоторую обработку на стороне клиента, возможно, вы можете взглянуть на плагин или на базу для плагина cors (2,3).

Предполагая, что вы делаете все правильно и добавляете заголовки в зависимости от каждого браузера (4,5), вытащите анализатор пакетов, например wirehark, и просмотрите пакеты, чтобы дать вам больше информации.

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

Удачи.

(1) Источник: https://www.khronos.org/webgl/public-mailing-list/archives/1106/msg00042.html

(2) Источник: archive.plugins.jquery.com/project/cors

(3) Источник: saltybeagle.com/2009/09/cross-origin-resource-sharing-demo/

(4) Источник: www.html5rocks.com/en/tutorials/cors/

(5) Источник: github.com/saltybeagle/cors

Также обратите внимание: www.jaanga.com/2012/04/access-cross-origin-images-from.html

Ответ 2

Я был заблокирован подобной ошибкой, когда я устанавливал атрибут видео в "crossOrigin" вместо "crossorigin"... Как только я опустил все, он начал работать.