实现效果：

代码如下：

<!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. ES6-字符串模板

    es6字符串模板 // es5 let ananiah = "大诶呀"; let blog = "我要忘了你的样子"+ ananiah; console.log ...

  2. Linux 释放cache

    sysc 将所有未写的系统缓冲区写到磁盘中,包含已修改的 i-node.已延迟的块 I/O 和读写映射文件 echo 3 > /proc/sys/vm/drop_caches To free p ...

  3. 通过 RxSwift 优雅使用 NotificationCenter

    原文 纯粹的官方代码使用NotificationCenter真的很难用,但是有了RxSwift,就变得方便了很多. 修改 Podfile,通过pod引入RxSwift pod 'RxSwift' po ...

  4. elasticsearch failed to obtain node locks

    0x00 事件 重启服务器后,启动 elasticsearch 失败,在日志中观察到以下错误: [2019-10-25T17:29:54,639][WARN ][o.e.b.Elasticsearch ...

  5. ORM优化查询、choices参数

    目录 ORM查询优化 only与defer select_related和prefetch_related MTV与MVC模型 choices参数 ORM查询优化 only与defer res = m ...

  6. 201871010116-祁英红《面向对象程序设计（java）》第一周学习总结

    项目 内容 <面向对象程序设计(java)> https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/ ...

  7. 用vbs和ADSI管理Windows账户

    ADSI (Active Directory Services Interface)是Microsoft新推出的一项技术,它统一了许多底层服务的编程接口,程序员可以使用一致的对象技术来访问这些底层服务 ...

  8. Java开发笔记汇总

    Java语法与.Net对比 Java规范与约定 Kotlin Maven笔记 SpringBoot笔记2 SpringCloud笔记 MyBatis笔记 发布Jar包到中央仓库

  9. Java连载48-final关键字

    一.final关键字 1.注意点: (1)final是一个关键字,表示最终的,不可变的. (2)final修饰的类无法被继承 (3)final修饰的方法无法被覆盖 (4)final修饰的变量一旦被赋值 ...

  10. LeetCode 217：存在重复元素 Contains Duplicate

    题目: 给定一个整数数组,判断是否存在重复元素. Given an array of integers, find if the array contains any duplicates. 如果任何 ...