webrtc浏览器端直播推流示例代码-html代码-BFW代码库

webrtc浏览器端直播推流示例代码

代码语言：html

所属分类：多媒体

代码描述：webrtc浏览器端直播推流示例代码,直播服务器可以安装mediamtx，地址https://github.com/bluenviron/mediamtx

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<style>
html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	overflow: hidden;
}
body {
    display: flex;
    flex-direction: column;
}
#video {
	height: 100%;
	background: black;
    flex-grow: 1;
    min-height: 0;
}
#controls {
    height: 200px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
#device {
    flex-direction: column;
}
#device > div {
    margin: 10px 0;
    display: flex;
    gap: 20px;
    justify-content: center;
}
select {
    width: 200px;
}
</style>
</head>
<body>

<video id="video" muted controls autoplay playsinline></video>
<div id="controls">
    <div id="initializing" style="display: block;">
        initializing
    </div>
    <div id="device" style="display: none;">
        <div id="device_line">
            video device:
            <select id="video_device">
                <option value="none">none</option>
            </select>

            audio device:
            <select id="audio_device">
                <option value="none">none</option>
            </select>
        </div>
        <div id="codec_line">
            video codec:
            <select id="video_codec">
            </select>

            audio codec:
            <select id="audio_codec">
            </select>
        </div>
        <div id="bitrate_line">
            video bitrate (kbps):
            <input id="video_bitrate" type="text" value="10000" />

            audio bitrate (kbps):
.........完整代码请登录后点击上方下载按钮下载查看