实现效果：

代码如下：

<!DOCTYPE html>

<html lang="zh">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<meta http-equiv="X-UA-Compatible" content="ie=edge" />

<title>Document</title>

</head>

<body>

<video src=""></video>

<script type="text/javascript">

var opt = {

audio: true,

video: {

width: 375,

height: 603

}

};

navigator.mediaDevices.getUserMedia(opt)

.then(function(mediaStream) {

var video = document.querySelector('video');

video.srcObject = mediaStream;

video.onloadedmetadata = function(e) {

video.play();

};

})

.catch(function(err) {

console.log(err.name + ": " + err.message);

}); // always check for errors at the end.

</script>

</body>

</html>

web网页利用JavaScript实现对摄像头的调用的更多相关文章

  1. 利用 JavaScript SDK 部署网页版“Facebook 登录”

    facebook开发者平台https://developers.facebook.com/ 利用 JavaScript SDK 部署网页版“Facebook 登录” 通过采用 Javascript 版 ...

  2. 利用javascript调用摄像头，可以配合socket开发监控系统

    <html> <head> <meta http-equiv="content-type" content="text/html; char ...

  3. 15款加速 Web 开发的 JavaScript 框架

    JavaScript 可以通过多种方式来创建交互式的网站和 Web 应用程序.利用 JavaScript,可以让你移动 HTML 元素,创建各种各样的自定义动画,给你的访问者更好的终端用户体验. 对于 ...

  4. web网页练习

    一. HTML部分 1. XHTML和HTML有什么区别 HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言最主要的不同: XHTML 元素必须被正确地嵌套. XHTML 元 ...

  5. 微信开发之移动手机WEB页面(HTML5)Javascript实现一键拨号及短信发送功能

    在做一个微信的微网站中的一个便民服务电话功能的应用,用到移动web页面中列出的电话号码,点击需要实现调用通讯录,网页一键拨号的拨打电话功能. 如果需要在移动浏览器中实现拨打电话,发送email,美国服 ...

  6. 利用JavaScript函数对字符串进行加密

    加密.解密问题对我来说一直是很神秘的,感到神奇无比. 理论了解 前段时间看到关于利用JavaScript函数unescape()和escape()对字符串进行替换处理.通过查资料得知, escape( ...

  7. 15款增强web体验的Javascript库

    1. Pikaday: Standalone JavaScript Datepicker 这是一个令人耳目一新的JavaScript日期选择器 轻量轻(压缩和gzip后小于5KB) 没有依赖其它JS框 ...

  8. [Java Web] 4、JavaScript 简单例子(高手略过)

    内容概览: JavaScript简介 JavaScript的基本语法 JavaScript的基本应用 JavaScript的事件处理 window对象的使用 JavaScript简介: JavaScr ...

  9. WEB网页插件 如何实现 选择上传图片路径 【高级问题】

    发表于 2010-10-22 12:11 | |只看楼主       按键精灵程序里面的WEB网页插件 如何实现 选择上传图片路径 我想在上传图片的选框设置图片路径为 C:\fakepath\001. ...

随机推荐

  1. s3c2440裸机-内存控制器(二、不同位宽外设与CPU地址总线的连接)

    不同位宽设备的连接 black 我们先看一下2440芯片手册上外设rom是如何与CPU地址总线连接的. 8bit rom与CPU地址线的连接 8bit*2 rom与CPU地址线的连接 8bit*4 r ...

  2. Best Cow Line <挑战程序设计竞赛> 习题 poj 3617

    P2870 [USACO07DEC]最佳牛线,黄金Best Cow Line, Goldpoj 3617 http://poj.org/problem?id=3617 题目描述FJ is about ...

  3. 浅谈C++ STL list 容器

    浅谈C++ STL list 容器 本篇随笔简单讲解一下\(C++STL\)中\(list\)容器的使用方法和使用技巧. list容器的概念 学习过\(C++STL\)的很多同学都知道,\(STL\) ...

  4. HDU2899Strange fuction（二分/三分）

    传送门 题目大意:求 F(x) = 6 * x^7+8*x^6+7*x^3+5*x^2-y*x (0 <= x <=100):的最小值 题解:求个导,二分导函数零点,就是原函数最小值所在的 ...

  5. 推荐一款好用到爆的开源 Java 诊断工具

    Arthas是什么鬼?Arthas是一款阿里巴巴开源的 Java 线上诊断工具,功能非常强大,可以解决很多线上不方便解决的问题. Arthas诊断使用的是命令行交互模式,支持JDK6+,Linux.M ...

  6. Ubuntu Idea 快捷键 Ctrl+Alt+S 无法使用解决

    Idea 里习惯了用 Ctrl+Alt+S 打开设置界面,在 Ubuntu 下会因为快捷键冲突无法使用 系统快捷键 打开系统设置中的快捷键设置,按 Backspace 键禁用 Fcitx 如果你的输入 ...

  7. linux下通过命令行把文件拷贝到U盘上

    常用linux,往U盘拷贝文件是常用的一种方法.下面这个方法是笔者亲测有效,暂时记录下来. 1.插入U盘,fdisk -l查看U盘是哪个设备(比如/dev/sdb1)然后mount  /dev/sdb ...

  8. IT兄弟连 HTML5教程 HTML5和HTML的关系

    HTML5开发现在很火爆,是一门技术,更是一个概念.可以让我们的工作模式.交互模式以及对应用和游戏的体验有了翻天覆地的变化,很多人都知道HTML5这门技术,也常把HTML5读作H5(简称).其实一些外 ...

  9. Spring Boot2 系列教程(二十二)整合 MyBatis 多数据源

    关于多数据源的配置,前面和大伙介绍过 JdbcTemplate 多数据源配置,那个比较简单,本文来和大伙说说 MyBatis 多数据源的配置. 其实关于多数据源,我的态度还是和之前一样,复杂的就直接上 ...

  10. Java SPI机制实战详解及源码分析

    背景介绍 提起SPI机制,可能很多人不太熟悉,它是由JDK直接提供的,全称为:Service Provider Interface.而在平时的使用过程中也很少遇到,但如果你阅读一些框架的源码时,会发现 ...