Субтитры не отображаются на странице html-видео

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

<!DOCTYPE html>
<html>
    <head>
        <meta charset = "UTF-8" />
        <title>RHoodHp</title>
        <meta name = "desription" content = "this is a movies streaming site">
        <h1>Movies streaming site</h1>
    </head>
    <body>
        <video controls autoplay muted width = "800" height = "400">
            <source src = "matrix cc.mp4" type = "video/mp4">
            <track src = "matrix.vtt" kind = "subtitles" srclang = "en" label = "English">
            <track src = "The Matrix-English.srt" kind = "subtitles" srclang = "en" label = "English 2">
        </video>
    </body>  
</html>

]1 ] 1

Кажется, треки .srt не поддерживаются. См.: stackoverflow.com/questions/26968759/… Вопрос старый, поэтому я не уверен. Что произойдет, если вы удалите его? Другой работает?

— 30.08.2024 20:20

нет, это не так, я пробовал оба по отдельности

— 30.08.2024 20:42

<track> поддерживает только WebVTT. Каково содержание вашего matrix.vtt файла? Что происходит на панели «Сеть» в инструментах разработчика? Правильно ли получен файл .vtt?

— 01.09.2024 13:26

@htor содержимое файла .vtt — это субтитры к фильму, на панели сети, когда я включаю субтитры в формате .vtt, появляется сообщение «Блокировано: источник с ошибкой», и да, я думаю, что он получен правильно, я взял его из хороший источник

— 03.09.2024 13:14

@Wisam Пожалуйста, обновите вопрос, указав полное сообщение об ошибке, которое вы получаете на панели «Сеть». Это может быть проблема CORS.

— 03.09.2024 13:45

@htor готово, пожалуйста, зацени

— 03.09.2024 21:06

html video tracking subtitle

30.08.2024 19:42

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

Toor - Ангулярный шаблон для бронирования путешествий

Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

В заголовках запросов на предоставленном снимке экрана вы можете видеть, что URL-адрес запроса начинается с file:///F:/Movie/.... <track> не работает с file:, но работает с http: URL-адресами. Это просто означает, что вам нужно запустить HTTP-сервер для обслуживания ваших файлов на http://localhost:8080 (или другом порту) и вместо этого получить доступ к веб-странице через http://localhost:8080/index.html. Только для местного развития, конечно.

При использовании URL-адресов localhost все они имеют одно и то же происхождение (localhost), и политика рефереров strict-origin-when-cross-origin не вступает в силу.

спасибо за помощь, брат, все сработало

— 04.09.2024 11:07

03.09.2024 23:14