web浏览器通过videojs对接实时视频流rtsp、rtmp格式

王海虎

于 2020-07-21 22:35:19 发布

阅读量1.3w

点赞数 3

分类专栏： JavaScript videojs flash 文章标签： js 浏览器 videojs 视频流 rtmp视频流

本文链接：https://blog.youkuaiyun.com/xiaohu12685/article/details/107500582

版权

本文介绍了如何在web浏览器中通过videojs库对接实时视频流，特别是rtsp和rtmp格式。由于rtsp不被直接支持，需要将流转换为flv或rtmp。在实现过程中，可能遇到'No compatible source was found for this media.'的错误，解决办法包括启动web服务如nginx或Apache，并启用Flash支持。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

注意：rtsp没法直接用，需要做格式转换，转成flv，或者rtmp

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>VideoDome</title>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/5.18.4/video-js.min.css" rel="stylesheet">
</head>

<body>
    <video id="video-dome" class="video-js vjs-default-skin videoStyle" controls autoplay preload="auto" height="230px"
        poster="http://vjs.zencdn.net/v/oceans.png" data-setup="{}">
        <source src="rtmp://10.10.1.53:9099/mylive/" type="rtmp/flv">
    </video>

    <script src="https://cdnjs.cloudflare.com/ajax/libs

最低0.47元/天解锁文章