Как дать CORS разрешение на сервере для видео?

Question

[melishev]

Для проекта на CodePen мне нужно видео с моего хостинга, но постоянно вылезает ошибка связанная с доступом CORS.
Ужа весь инет перекопал так и не понял как сделать нормальный ответ сервера.

Answer 1

[ReActor Дмитрий Вершанский]

Добрый день.

Добавьте следующую директиву в .htaccess:
Header set Access-Control-Allow-Origin '*'

Comments

[melishev]

не помогло

[ReActor Дмитрий Вершанский]

picka, скрин консоли, будьте добры

[Павел Корнилов]

picka, значит, что-то блокирует. Вы директиву писали в файл, который в папке с видео лежит?

[melishev]

[melishev]

Павел Корнилов, Re{Actor} Дмитрий Вершанский, CORS запрещает ибо идет в через getImageData

[melishev]

Павел Корнилов, Re{Actor} Дмитрий Вершанский, вот ответ сервера HTTP/1.1 200 OK
Server: nginx-reuseport/1.13.4
Date: Mon, 28 Sep 2020 17:18:24 GMT
Content-Type: video/mp4
Content-Length: 22369440
Last-Modified: Mon, 28 Sep 2020 14:47:54 GMT
Connection: keep-alive
Keep-Alive: timeout=30
ETag: "5f71f79a-15554a0"
Expires: Wed, 28 Oct 2020 17:18:24 GMT
Cache-Control: max-age=2592000
Accept-Ranges: bytes

[melishev]

Павел Корнилов, писал

[Павел Корнилов]

picka, для видео crossorigin="anonymous" указывали?

[melishev]

Павел Корнилов, теперь видео просто не загружается

[Павел Корнилов]

picka, тогда не знаю. Возможно, это связано с тем, что в кодпене все в айфрейме работает.

[Ragtime Kitty]

Павел Корнилов, на кодпене все ок, если есть заголовок Access-Control-Allow-Origin и атрибут - пример.
Скорее всего что-то не так указано в .htaccess

[Павел Корнилов]

Ragtime Kitty, для чистоты эксперимента видео поставьте. А так да, вроде все ок.

[melishev]

Павел Корнилов, Ragtime Kitty, крч, переформатировал в webm и все ок, но сам webm не особо радует

[melishev]

Павел Корнилов, Ragtime Kitty, HTTP/1.1 200 OK
Server: nginx-reuseport/1.13.4
Date: Mon, 28 Sep 2020 18:11:59 GMT
Content-Type: video/webm
Content-Length: 7281833
Connection: keep-alive
Keep-Alive: timeout=30
Last-Modified: Mon, 28 Sep 2020 18:08:06 GMT
ETag: "6f1ca9-5b0638c597e77"
Access-Control-Allow-Origin: *
Accept-Ranges: bytes

Это ответ webm

[melishev]

Павел Корнилов, Ragtime Kitty, HTTP/1.1 200 OK
Server: nginx-reuseport/1.13.4
Date: Mon, 28 Sep 2020 19:12:55 GMT
Content-Type: video/mp4
Content-Length: 22369440
Last-Modified: Mon, 28 Sep 2020 14:47:54 GMT
Connection: keep-alive
Keep-Alive: timeout=30
ETag: "5f71f79a-15554a0"
Expires: Wed, 28 Oct 2020 19:12:55 GMT
Cache-Control: max-age=2592000
Accept-Ranges: bytes

Это ответ mp4

[Павел Корнилов]

picka, что за мистика? Почему mp4 не хочет Access-Control-Allow-Origin: * отдавать? Думаю, что что-то в серверных настройках не так. Другой причины не вижу.

[Ragtime Kitty]

Павел Корнилов, c mp4 тоже все ок - https://codepen.io/Ragtime-Kitty/pen/ZEWZMpd

[melishev]

Ragtime Kitty, у вас что за хостинг?

[Павел Корнилов]

Ragtime Kitty, да, все без проблем.

[melishev]

Павел Корнилов, не совсем, в google chrome все хорошо у нее, а в safari пустое окно

[Ragtime Kitty]

picka, просто iOS очень привередлива и не хочет открывать видосики без controls и тега source. Исправила, поробуйте еще раз: все ок с CORS - https://codepen.io/Ragtime-Kitty/pen/ZEWZMpd

[Павел Корнилов]

Ragtime Kitty, offtop: Мне тоже рэгтайм понравился. Прямо заслушался.

Answer 2

[bqio]

CORS предупреждения появляются только при кросс-доменных запросах. Так что прекращайте парсить чужой API. Ну, можете попробовать расширение для Хрома х)

Comments

[melishev]

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

[zkrvndm]

picka, у вас сервер на php?

[bqio]

picka, Access-Control-Allow-Origin *