Video.js plugin not working when using OpenCV write the video stream to NGINX media server

[Bahramudin]

Steps to reproduce

The HTML video tag when I try to open live stream from NGINX media server, it not working, what can be the problem with the stream. I am using OpenCV with GStreamer, which reading the video stream from IP camera, and then after processing the image, write it back to the output stream (to the NGINX server). So then if I use the VLC media player open the stream from the NGINX server, it working well, but in the HTML page, it is not working. But if I using GStreamer command line for pushing the stream to the NGINX media server, then everything goes well in both of VLC and HTML. The below is the code that I am implemented:

Open stream for read:

String url = "rtspsrc location=rtsp://admin:admin@xxx.xxx.xxx.xxx:554/Streaming/Channels/102" +
        " latency=0 ! decodebin ! videoconvert ! appsink";
VideoCapture capture = new VideoCapture();
if (!capture.open(url, Videoio.CAP_GSTREAMER)) {
    System.out.println("error opening capture");
    return;
}

Open stream for write:

String urlWriter = "appsrc ! videoconvert ! x264enc speed-preset=ultrafast tune=zerolatency threads=2 byte-stream=true ! flvmux ! rtmpsink location=rtmp://xxxxx:5000/live/test"
VideoWriter writer = new VideoWriter();
writer.open(urlWriter, Videoio.CAP_GSTREAMER, 0, 15, new Size(640, 480), true);
if (!writer.isOpened()) {
    System.out.println("error open writer");
    return;
}

Read/Process/Write:

Mat frame = new Mat();
while (capture.read(frame)) {
    .... // process
    writer.write(frame);
}

Results

Everything goes well when I open the stream URLrtmp://xxxxx:5000/live/test in VLC, but when I try to open it in the HTML video tag, then it is not working.

But if I used the command line, then everything works well, something like this command: gst-launch-1.0 rtspsrc location=rtsp://admin:admin@xxx.xxx.xxx.xxx:554/Streaming/Channels/102 latency=0 ! parsebin : flvmux ! rtmpsink location=rtmp://xxxxx:5000/live/test

Expected

We want that the stream can be opened in the HTML as is it can be opened in the VLC.

Error output

Do have any error message, but when trying to open the stream, the time is showing, namely, the seek bar jumps to the end of the video, but it does not show the video.

versions

videojs

5.x

browsers

Google Chrome

OSes

Windows

plugins

NULL

[gkatsev]

One thing to be aware of is that our RTMP support requires the stream using an & as the separator for the url and stream name. See http://docs.videojs.com/tutorial-faq.html#q-how-can-i-play-rtmp-video-in-videojs It's weird that if you change commands video.js does work.

[Bahramudin]

@gkatsev Thanks for the reply! The problem has been solved, and it was because of missing video/x-h264,profile=highof stream URL.

[gkatsev]

Ah weird. Well, glad you were able to get it figured out!