← Форум / Рецепты / Не работает HLS в HTML5
Файлы m3u8 (HLS) давно работают на мобильных платформах и на десктопах с версии HTML5 плеера 0.8. Если плеер сообщает, что файл не найден, нужно выяснить причину такого поведения. Сперва можно проверить ошибки в браузере - откройте Хром > Инструменты разработчика > вкладка Console. Если там есть сообщение:
Значит на сервере с манифестом не настроен CORS (он нужен для загрузки файлов с разных доменов).
XMLHttpRequest cannot load http://...m3u8 No 'Access-Control-Allow-Origin' header...
Если такого сообщения нет, попробуйте включить в плеере режим отладки - нужно добавить параметр hls_debug:true, например:
Uppod({file:"http://...m3u8", uid:"player", hls_debug:true});
Режим отладки выводит в консоль браузера (вкладку Console) служебные сообщения, которые позволяют понять причины проблем с воспроизведением.
| uppod | Ссылка на пост (Смотрели 21486) | 14.07.16 11:50 Ответить |
Плейлисты в формате m3u8 готовит nginx.
Но, он совсем не JSON, как ожидает Ваш плеер.
Отсюда ошибку получаем:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
И как же все таки заставить играть m3u8 (HLS) ?
в плеере пишет Файл не найден, в Console … 925/index.m3u8 net::ERR_UNSAFE_PORT
В чем может быть причина?
Добавил --explicitly-allowed-ports=xxx к ярлыку вызова Chrome начало показывать видео!
Только звука нет…
Вот такой код:
<html>
<head>
<title>Uppod HTML5</title>
<script src=’uppod.js’ type=’text/javascript’></script>
<script src=’swfobject.js’ type=’text/javascript’></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<center><div id="myplayer" style="width:500px;height:381px"></div>
<SCRIPT type=text/javascript>this.videoplayer = new Uppod({m:"video",comment:"",uid:"myplayer","poster":"video-thumb.png","file":",hls_debug:true});</script>
</center></body></html>
Так вот в чём вопрос!
В мозилле всё прекрасно работает, стрим идёт, звук есть!
Но в других браузерах выдаёт ошибку, что файл не найден.
В консоле хрома пишет: Not allowed to load local resource: blob:null/a9dbd4ec-d81c-4e13–832e-20764639cb0a …
Подскажите в чем может быть проблема.
Я в этом деле только начинаю, часов 6 или 7 :)
<object id="videoplayer598" type="application/x-shockwave-flash" data=" width="500" height="375">
<param name="bgcolor" value="#ffffff" /><param name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="always" /><param name="movie" value=" />
<param name="flashvars" value="uid=videoplayer598&m=video&file=81AEZBRUcLCOLex5BW7Jw692MWsRFGJ6dwLFzdwbRf0cYsDMX6sNXHm5ri" /></object>