HTML5实现IP Camera网页输出

最新推荐文章于 2024-04-05 13:37:37 发布

原创

最新推荐文章于 2024-04-05 13:37:37 发布 · 3.8k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#html5 #camera

该博客介绍了如何利用HTML5的navigator.getUserMedia对象实现本机摄像头的调用，并探讨了支持情况，特别是对IE浏览器的不兼容问题。此外，还提到了IP Camera的命令行模式实现。

HTML5实现IP Camera网页输出

这两天做OA项目，有一个要通过IP Camera将视频流输出到浏览器端的模块。虽然现在买到的摄像头都会提供浏览器和客户端的实现，但是一般来说都是只支持IE浏览器，通过安装ActiveX控件的方式来实现的。IE实在太烂，并且只能用IE还得安装控件，对用户体验非常不好，并且最新的Windows也抛弃了现有的IE浏览器，叫做Edge，取消了对ActiveX的支持，于是考虑到HTML5新支持的video标签来实现这项功能。

一、本机摄像头案例

首先上一个用笔记本电脑的摄像头输出的案例，代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <button id="run">开启网络摄像头</button><Br/>