Search code examples
html5-videowebvtt

WEBVTT subtitles not showing if code produced with PHP


I want to show HTML5 videos with subtitles. If i have a html file (for Chrome, with Playr), with this for example

...
<video class="playr_video" preload="metadata" width="1000" height="700" poster="poster1.jpg" style="border:1px solid gray;padding: 0% 0;" controls>
    <source src="trailer.webm" type="video/webm" />
    <track src="trailer-en.vtt" label="English subtitles" kind="subtitles" srclang="en">
    <track src="trailer-el.vtt" label="Greek subtitles" kind="subtitles" srclang="el">
Your browser does not support the video tag, please update mime type.
</video>
...

it works.

But i have many videos to show, so i want one PHP file to control consistently as video showing page. So in Joomla articles i do this (example, to illustrate)

<form action="video.php" method="post" target="_blank">
    <input style="display: none;" id="video" name="video" value="trailer.webm" type="text" />
    <input style="display: none;" id="poster" name="poster" value="video1poster.jpg" type="text" />
    <input style="display: none;" id="subsen" name="subsen" value="video1subsen.jpg" type="text" />
    <input style="display: none;" id="subsel" name="subsel" value="video1subsel.jpg" type="text" />
    <input src="showvideo.jpg" type="image" />
</form>

and a php file just receives POST variables (like $video, $suben, $subel) and gives the same html like the code written in the beginning.

So in the page's source in Chrome, everything comes as intended, all code is correct, all files are properly refered. But subtitles do not show up.

Please note that in the Playr packet, there is a json file which i do not use because i cound not find instructions, i just use the two files playr.css and playr.js, but i don't think this hurts, i really have no idea why. Any help appreciated, thanks.


Solution

  • Solved: ALL files MUST reside in the same domain.-