HTML不是编程语言,但这并不妨碍前端工程师发挥出来。
例如,有人使用HTML访问用户的摄像头—
在网页上,点击按钮直接打开手机前置镜头拍照。
也可以调用手机后置镜头开启拍照模式。
值得注意的是,在这里,小哥哥只用HTML语言实现了上述功能。
利用HTML的capture属性,他只需要设置几个输入参数和几行代码。
与其他实现相比,获取用户的相机权限更加方便而且不存在安全问题
不出所料,一大波程序员前来围观。有人说:
用HTML capture属性直接访问摄像头确实比JavaScript方便。
这位小哥的网名是奥斯汀·吉尔他是一名从事网页开发的工程师
下面就跟着小哥哥分享的内容来看看具体的实施步骤吧。
如何在HTML中打开摄像头。
首先,当然是那一代人。
兄弟创建了一个index.html文档,它与HTML的accpet属性相匹配,以指定不同标签要捕获的文件的具体属性。
在这里,他设置了两个标签环境和用户。
当用户点击环境时,可以调用设备的后置镜头,具有录像功能,当用户点击用户时,可以打开设备的前置镜头进行拍照。
具体代码如下:
lt,!DOCTYPEhtmlgtlt,htmllang="en"gtlt,headgtlt,元字符集="UTF—8"/gtlt,meta name = " viewport " content = " width = device—width,initial—scale = 1 "/gt,lt,stylegt*字体大小:1.5雷姆,lt,/stylegtlt,/headgtlt,bodygtlt,labelfor="environment"gt捕获环境:lt,/label gt,lt,brgtlt,input type = " file " id = " environment " capture = " environment " accept = " video/* " gt,lt,brgtlt,brgtlt,labelfor="user"gtcaptureuser:lt,/label gt,lt,brgtlt,input type = " file " id = " user " capture = " user " accept = " image/* " gt,lt,/bodygtlt,/htmlgt
此时,眼尖的人可能已经发现,网页没有提示用户是否打开访问摄像头的权限,直接调用摄像头。
这种操作是否存在安全风险。
对此,小哥给出的答案是:无附加险。
因为浏览器并不能真正控制用户的摄像头,但却可以轻松上传摄像头生成的新文件。
说话——对于用户来说,浏览器只能通过HTML打开摄像头,如果需要向网站展示照片或视频或者保存,还是需要使用JavaScript的MediaDevices API。
有网友补充道,这种操作方式比纯JavaScript更安全。
通过JS,允许用户访问后,浏览器可以直接控制摄像头。
但是Web 3.0标准之后,规定网页不能直接访问用户的镜头。
不过小哥也指出,这种直接通过HTML命令打开用户摄像头的方式还是有一些不足,比如兼容性差。
量子比特pro测试了我小哥哥的这段代码,结果显示:
在iPhone上,使用百度等浏览器,真的可以直接打开前后摄像头。
有兴趣的小伙伴可以用下面链接里的代码试试~
门户网站:
参考链接
郑重声明:此文内容为本网站转载企业宣传资讯,目的在于传播更多信息,与本站立场无关。仅供读者参考,并请自行核实相关内容。