Can't play mp4 from web-server, plays fine from file:// - google-chrome

I've tried this running a few simple servers, beefy.js and static-server, both simple node servers.
My problem is that when I load my video via an http:// in a video element, or via a relative path on the local web-server, it doesn't play. I get no errors.
I've checked the address is correct by providing an incorrect address which gives me an error in the console.
If I give chrome a file://LOCATION_OF_MP4, chrome will play the video no problem.
If I go to http://localhost:9080/relative-location.MP4, I get a black screen with player controls and a muted sound.
I can't figure out why the local version should be fine, but the server-based can't be found.
I'm creating the video tag via
var vid = document.createElement('video');
console.log('src', state.demoVideo.store.src());
vid.setAttribute('src', state.demoVideo.store.src());
document.body.appendChild(vid);

Related

Opening local HTML file with local video and local subtitles

When opening a local HTML file in Safari with the following contents
<video controls autoplay src="video.mov">
<track default src="subtitles.vtt" />
</video>
where video.mov and subtitles.vtt are in the same directory as the HTML file, the video is correctly loaded and can be played, but the subtitles are not shown and the following error is logged in the console:
Unsafe attempt to load URL file:///subtitles.vtt from origin null. Domains, protocols and ports must match.
Is it possible to show a local video with local subtitles? Why does the video load correctly but the subtitles do not?
EDIT:
I don't intend to install or use a web server for this. I was just wondering why the video loads and the subtitles do not, but using a web server to work around this issue is too cumbersome for my simple needs.

Cache video on Samsung SmartTV

I'm have a webpage that is just a fullscreen video that I want to display on a Samsung PM32F SmartTv using the built in browser. If I have a internet connection this works fine but when I try to cache the video using a cache manifest to be able to show it offline the video will not play.
I have tried the same kind of caching with images and that works fine.
The video I'm trying to display is a mp4 file and is smaller then one of the images I have tried with so I don't think it's a size isue.
I do not have access to any kind of developer tools for the TV's browser so I can't check for any error messages.
The video is in a <video> tag.
Any kind of help would be much appriciated.
You could try the following script (I could not test it on real tv).
function handleVideo(stream) {
video.src = window.URL.createObjectURL(stream);
document.getElementById("videoElement").pause();
}
After some time I found out it was just a simple server issue with a file that had been moved.

HTML video returns MEDIA_ERR_SRC_NOT_SUPPORTED error after playing for a while

I am trying to play a video streamed by a third party using the HTML5 video player in Chrome Mobile, the problem I am facing is that the video can play for some time while it's minimized and after a while it decides to quit and return a MEDIA_ERR_SRC_NOT_SUPPORTED - audio/video not supported error; the problem happens much faster when I switch from minimised to maximised then back to minimised over and over again. It also seems to happen faster if I continuously tap on the video itself, I have also hidden the default controls and use my own custom ones.
What could be causing this issue ? I try the same thing in Safari with the QuickTime player and the video feed does no die
EDIT: Did some more digging around and found this:
Android HLS video mime type
I receive a playlist m3u8 file but my request link does not have m3u8 in it whatsoever but should the video even be playing if the m3u8 keyword isn't there ? I am also testing this on an android 4.4.4
Specifying the correct MIME type is worth a try. However, there's one other thing that caught me out (with iOS anyway): check that the server hosting the video supports 206 Partial Content requests correctly. I posted about debugging this issue here.
If your using FireFox and getting the SRC not supported, I went threw the codes on some of the players at sites I like to view, I found that the Adobe Flash Player will solve the Problem, FF uses the VLC plugins, but with the current updates on FF with the VLC on HTLM5 players you might get a SRC error code, you need the Adobe Flash Player.
I have searched your error code on internet and i have found this:
MEDIA_ERR_SRC_NOT_SUPPORTED (4) The media resource specified by src
was not usable. MEDIA_ERR_SRC_NOT_SUPPORTED
(5) The encrypted media
stream could not be played. This is because of one of the following
conditions: A key was not provided and a onmsneedkey handler was not
provided The provided key could not be applied. Decryption is not
supported for this media data.
Source
So I would say you initialize src wrong.

Web Audio API no sound playing

I'm trying to get into the Web Audio API as I'm looking to make some visualizations based on the music that's playing. However all examples I have found, it's like the audio is muted. It plays the file but there's no sound.
For example: codepen.io/noeldelgado/pen/jqibm
Even following this - https://www.youtube.com/watch?v=IBHpSkGZtNM yields same result.
I'm on mac, using the latest version of Chrome (42.0.2311.90), have also tried on latest Firefox and it's the same problem.
It's a cross-origin access issue in createMediaElementSource that landed in Chrome 42. You need to setup the appropriate headers for the ogg files and set the crossOrigin attribute. Otherwise you get no audio output at all.

Can't play video streamed with VLC using html5 video tag and Apache server

I have an Apache server with a webpage written in HTML5 that has a video tag to play video from a webcam. I use VLC to stream the video over HTTP in OGG. My problem is that I can play the video in a browser from the computer where the server is allocated, but from another computer the video window is blank.
I have done some tests to try to solve my problem:
if I put a video file in htdocs and the corresponding line in the html file, the video is played.
If the stream is a video file instead of video from the webcam, there is the same problem.
With VLC option Open Network Stream the video is played successfully from another computer.
When I have the blank window problem, with wireshark I don't see the stream being downloaded.
This is how I use the video tag:
<video id = "myVideo" src="http://localhost:8081/stream.ogg" type="video/ogg; codecs=theora" autoplay="autoplay"></video>
I would appreciate any suggestion, thank you in advance!
Kiko
http://localhost
Localhost will always point to your local computer. So if you run the application on the server the video file will actually resides on, it will find the file.
But if you are running the script on another computer, this computer will actually look locally, where the video file does not resides.
Try replacing http://localhost with the external IP-adres of your server.