php在线拍照代码,PHP+Javascript实现在线拍照功能实例

2024-05-11 14:17:38

本文实例讲述了PHP+Javascript实现在线拍照功能。。具体如下：

我们在一些WEB应用中可能会遇到这样的情况，用户需要自己现场拍照并上传到会员系统。比如驾校采集指纹拍照流程、考试现场采集照片等。我们今天要讲的是如何使用javascript和PHP实现一个简单的在线拍照并上传的功能。

实现这个功能的前提是你的电脑设备上需要安装有摄像头设备，以及你的浏览器需要支持flash

Javascript+PHP实现在线拍照功能

http://siteweb.com/sitemaps.xml

在body中加入一个用于调用摄像组件的容器id#cam和一个显示上传信息的容器id#results。

Javascript

接下来调用摄像组件，我们先载入webcam.js，用于拍照和上传的js库。

代码如下:

然后在容器id#cam中，加入以下代码：

webcam.set_api_url( 'action.php' );

webcam.set_quality( 90 ); // 图像质量(1 - 100)

webcam.set_shutter_sound( true ); // 拍照时播放声音

document.write( webcam.get_html(320, 240, 160,120) );

我们调用了webcam，其中webcam.set_api_url用来设置图像上传交互的php路径，set_quality可设置图像质量，set_shutter_sound设置声音，get_html输出摄像组件，参数即宽度、高度、上传后宽度、上传后高度。

当点击按钮拍照时，需要执行以下代码：

webcam.set_hook( 'onComplete', 'my_completion_handler' );

function take_snapshot() {

document.getElementById('results').innerHTML = '

Uploading...

';

webcam.snap();

}

function my_completion_handler(msg) {

if (msg.match(/(http://S+)/)) {

var image_url = RegExp.$1;

document.getElementById('results').innerHTML =

'

Upload Successful!

' +

'';

webcam.reset();

}

else alert("PHP Error: " + msg);

}

当执行拍照动作时，代码与后台php交互，如果上传图片完成后，则返回相应的信息。

PHP

action.php所做的就是将本地拍照的图像上传到服务器，并将图片路径返回给前端。注意存放图片的路径要给写权限。

$filename = date('YmdHis') . '.jpg';

$result = file_put_contents( 'pics/'.$filename, file_get_contents('php://input') );

if (!$result) {

print "ERROR: Failed to write data to $filename, check permissionsn";

exit();

}

$url = 'http://' . $_SERVER['HTTP_HOST'] . dirname($_SERVER['REQUEST_URI']) . '/pics/' . $filename;

print "$urln";

php在线拍照代码,PHP+Javascript实现在线拍照功能实例相关推荐

java wed登录面代码_JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)...
下面通过通过图文并茂的方式给大家介绍JavaWeb实现用户登录注册功能实例代码,一起看看吧. 一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBea ...
android控制手机拍照代码,Android开发之手机拍照功能的实现（源代码分享）
Android系统里调用手机拍照的功能有两种方法一种直接调用手机自带的相机另一种就是使用自己做的拍照应用.比如Camera360 一款于各操作系统都有的的功能强大的手机摄影软件:能拍摄出不同风格,不同 ...
python车牌识别系统开源代码_python+opencv实现车牌定位功能(实例代码)
写在前面 HIT大三上学期视听觉信号处理课程中视觉部分的实验三,经过和学长们实验的对比发现每一级实验要求都不一样,因此这里标明了是2019年秋季学期的视觉实验三. 由于时间紧张,代码没有进行任何优化, ...
Python 技术篇-20行代码实现微信机器人斗图功能实例演示！斗图啦官网API调用方法
话不多说,看效果图: 先说下原理: 微信接收到你说的话,发给机器人来回复,用回复的话传参给斗图网,然后获得斗图网返回的图片,保存后把图片再发给跟你斗图的人. 斗图啦官网API调用文档斗图啦官网菜单 ...
python灰度图生成g代码_Python打造一个在线G代码生成器
用tornado框架做后端--,用bootstrap做前端先上效果图: 生成出来的G代码: g.py源码: #coding=utf-8 # -*- coding: UTF-8 -*- #!/usr/ ...
在线CSS代码压缩美化工具
在线CSS代码压缩美化工具在线CSS代码压缩美化工具在线CSS代码压缩.格式化工具.可以删除注释在线CSS代码压缩.格式化工具.可以删除注释 https://tooltt.com/css/
shell执行perl_TOOLFK工具-在线Perl代码执行工具
本文要推荐的[TOOLFK]在线Perl代码执行工具 ,提供在线Perl代码执行功能. 網站名稱:ToolFk 網站鏈結:https://www.toolfk.com/ 工具链接:https://ww ...
python代码行数统计工具_Python实现代码行数统计工具的功能（实例）
本篇文章给大家带来的内容是关于Python实现代码行数统计工具的功能(实例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 我们经常想要统计项目的代码行数,但是如果想统计功能比较完善 ...
【前端实例代码】Html5+css3+JavaScript创建在线播放架子鼓电子鼓演奏网页效果！前端开发网页设计基础入门教程！超简单~
b站视频演示效果: [前端实例代码]Html5+css3+JavaScript创建在线播放架子鼓电子鼓演奏网页效果!前端开发网页设计基础入门教程!超简单~ 效果图: 完整代码: <!DOCTYP ...
JavaScript实现在线MD5、SHA、AES、Rabit 、RC4、TripleDES Ripemd160 加密解密工具-toolfk程序员在线工具网...
2019独角兽企业重金招聘Python工程师标准>>> 本文要推荐的[ToolFk]是一款程序员经常使用的线上免费测试工具箱,ToolFk 特色是专注于程序员日常的开发工具,不用安装 ...

最新文章

热门文章