I was wondering if its possible to serve a video and its subtitle from a CDN such as AWS Cloudfront with HTML5 VIDEO?
This is my html5 video code : jsfiddle
<video controls preload="auto" width="640" height="264" poster="https://s3.amazonaws.com/testpipeoutput/myjunittesting/vlcsnap-2015-07-02-13h39m38s227.png"
>
<source src="https://s3.amazonaws.com/testpipeoutput/myjunittesting/oceans-clip.mp4" type="video/mp4">
<track kind="captions" src="https://s3.amazonaws.com/testpipeoutput/myjunittesting/captions.vtt" srclang="en" label="English">
</video>
In this case I am attempting to serve both the video and it captions file from my AWS Bucket and I get this exception
(index):1 Text track from origin 'https://s3.amazonaws.com' has been blocked from loading: Not at same origin as the document, and parent of track element does not have a 'crossorigin' attribute. Origin 'https://fiddle.jshell.net' is therefore not allowed access.
Please note that I have CORS enabled for my S3 bucket.
What am I doing wrong ?
EDIT: fixed typo and add cors tag
Add crossorigin="anonymous" to your video tag: