时间戳

首页 > 解决方案 > 无法将 rtmp 流式传输到网页

javascript - 无法将 rtmp 流式传输到网页

问题描述

我正在尝试使用 RTMP 将本地驱动器中的视频流式传输到浏览器。我正在关注本教程。

这是cpp代码的一部分：

std::string video_fname;
video_fname = std::string(argv[1]);
cv::VideoCapture video_capture;
bool from_camera = false;
if(video_fname == "0") {
    video_capture = cv::VideoCapture(0);
    from_camera = true;
} else {
    video_capture=  cv::VideoCapture(video_fname);
}

if(!video_capture.isOpened()) {
    fprintf(stderr, "could not open video %s\n", video_fname.c_str());
    video_capture.release();
    return 1;
}

int cap_frame_width = video_capture.get(CV_CAP_PROP_FRAME_WIDTH);
int cap_frame_height = video_capture.get(CV_CAP_PROP_FRAME_HEIGHT);

int cap_fps = video_capture.get(CV_CAP_PROP_FPS);
printf("video info w = %d, h = %d, fps = %d\n", cap_frame_width, cap_frame_height, cap_fps);

int stream_fps = cap_fps;

int bitrate = 500000;
Streamer streamer;
StreamerConfig streamer_config(cap_frame_width, cap_frame_height,
                               1920, 1080,
                               stream_fps, bitrate, "high444", "rtmp://127.0.0.1/live/mystream");

streamer.enable_av_debug_log();
streamer.init(streamer_config);

size_t streamed_frames = 0;

如您所见，RTMP 链接是rtmp://127.0.0.1/live/mystream，启动我的 Nginx 后，我可以简单地将这个链接插入浏览器中的 URL 字段并播放它，没有任何问题。但是，现在我需要在 HTML 网页上流式传输它，但我不能这样做。

html代码：

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>videojs-contrib-hls embed</title>

  <!--

  Uses the latest versions of video.js and videojs-http-streaming.

  To use specific versions, please change the URLs to the form:

  <link href="https://unpkg.com/video.js@6.7.1/dist/video-js.css" rel="stylesheet">
  <script src="https://unpkg.com/video.js@6.7.1/dist/video.js"></script>
  <script src="https://unpkg.com/@videojs/http-streaming@0.9.0/dist/videojs-http-streaming.js"></script>

  -->

  <link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
</head>
<body>
  <h1>Video.js Example Embed</h1>

  <video-js id="my_video_1" class="vjs-default-skin" controls preload="auto" width="640" height="268">
    <source src="rtmp://127.0.0.1/live/mystream" type="rtmp/flv">
  </video-js>

  <script src="https://unpkg.com/video.js/dist/video.js"></script>
  <script src="https://unpkg.com/@videojs/http-streaming/dist/videojs-http-streaming.js"></script>

  <script>
    var player = videojs('my_video_1');
  </script>

</body>
</html>

我不断收到错误消息，说不支持视频格式。请展示如何做到这一点。我已经浏览了所有在线指南（实际上它们都是一样的），但它们都不起作用。谢谢

标签： javascripthtmlvideo.jsrtmp

解决方案

我不断收到错误消息，说不支持视频格式

这是因为不支持 rtmp。没有浏览器支持rtmp。您必须将服务器端转换为受支持的东西，例如 HLS 或 DASH。

推荐阅读