No video display when watching HLS streams in browsers

[Chien-Ming Cheng]

Hello

I simply converted a media file (container: Quicktime, audio: MPEG-4
AAC, video: H.264) to HLS stream as follows.

gst-launch-1.0 filesrc location=media.mp4 ! qtdemux name=demux !
queue2 ! h264parse disable-passthrough=true ! mpegtsmux name=mux !
hlssink max-files=0 playlist-length=0 demux. ! queue2 ! aacparse !
mux.

I can watch the HLS stream via the playlist.m3u8 by using media
players such as ffplay and vlc.

Then I created a web page which includes videojs-contrib-hls to play
the playlist.m3u8. However, only audio can be played (no video
display) when watching the HLS stream via http://address/index.html in
browsers such as Chrome and Safari. On the other hand, both audio and
video are fine via the same web page when replacing the HLS playlist
and segment files with that generated by ffplay program.

I have tested GStreamer 1.6.x, 1.9.x, and the latest 1.10.3. All have
the same result.

Does anyone know how to watch HLS streams generated by GStreamer in
browsers? Did I make any mistakes (for example, the wrong GStreamer
pipeline)?

Thanks