HTML5 ile Webcam den fotograf çekmek.

barutali@hotmail.com · June 22, 2013

Merhabalar;

UniGui ile testler almaktayım. HTML5 de bildiğiniz gibi Webcam e erişim sağlanabiliyor.

UniGui ile bu işlemi nasıl yapabilirim. PHP Dosyası olarak hazırladım bunu uniHTML frame ile çağırıyorum fakat foto çektirdikten sonra nasıl kaydettireceğimi bulamadım..

PHP Dosyası aşağıdaki gibidir. Query String ile gönderdiğim parametrenin adında kaydetmem gerekiyor..

Teşekkürler.

Hi,

I'm developing test projects with unigui, as you know it's possible to take picture and save to database via webcam with HTML5. So i was wondering is this possible with UniGUI as well ?

If it's possible then how i can do it ? I prepared my project as PHP and calling with uniHTMLFrame but i couldn't find how to save database taken photo after capture via webcam.

My PHP file as below, i have to save to database with Query String's parameter which i send to query.

Thanks in advance.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB" lang="en-GB">
<head>
<meta charset="UTF-8" />
</head>

<body>
<p><video id="video" autoplay width="200px"/></p>
<p><input type="button" id="buttonSnap" value="Take screenshot" disabled="disabled" onclick="snapshot()" /></p>
<p>
<input type="button" id="buttonStart" value="Start" disabled="disabled" onclick="start()" />
<input type="button" id="buttonStop" value="Stop" disabled="disabled" onclick="stop()" />
</p>
<p><canvas id="canvas" /></p>
<form name="form1" method="post" action="">
  <input type="hidden" name="hiddenField" id="hiddenField">
  <?php
    
   echo $_GET["GuID"];
   
  ?>
</form>
<script type="text/javascript">//<![CDATA[
"use strict";
var video = document.getElementById('video');
var canvas = document.getElementById('canvas');
var videoStream = null;



function snapshot()
{
	canvas.width = video.videoWidth;
	canvas.height = video.videoHeight;
	canvas.getContext('2d').drawImage(video, 0, 0);
}

function noStream()
{
	log('Access to camera was denied!');
}

function stop()
{
	var myButton = document.getElementById('buttonStop');
	if (myButton) myButton.disabled = true;
	myButton = document.getElementById('buttonSnap');
	if (myButton) myButton.disabled = true;
	if (videoStream)
	{
		if (videoStream.stop) videoStream.stop();
		else if (videoStream.msStop) videoStream.msStop();
		videoStream.onended = null;
		videoStream = null;
	}
	if (video)
	{
		video.onerror = null;
		video.pause();
		if (video.mozSrcObject)
			video.mozSrcObject = null;
		video.src = "";
	}
	myButton = document.getElementById('buttonStart');
	if (myButton) myButton.disabled = false;
}

function gotStream(stream)
{
	var myButton = document.getElementById('buttonStart');
	if (myButton) myButton.disabled = true;
	videoStream = stream;
	video.onerror = function ()
	{
		if (video) stop();
	};
	stream.onended = noStream;
	if (window.webkitURL) video.src = window.webkitURL.createObjectURL(stream);
	else if (video.mozSrcObject !== undefined)
	{//FF18a
		video.mozSrcObject = stream;
		video.play();
	}
	else if (navigator.mozGetUserMedia)
	{//FF16a, 17a
		video.src = stream;
		video.play();
	}
	else if (window.URL) video.src = window.URL.createObjectURL(stream);
	else video.src = stream;
	myButton = document.getElementById('buttonSnap');
	if (myButton) myButton.disabled = false;
	myButton = document.getElementById('buttonStop');
	if (myButton) myButton.disabled = false;
}

function start()
{
	if ((typeof window === 'undefined') || (typeof navigator === 'undefined')) log('This page needs a Web browser with the objects window.* and navigator.*!');
	else if (!(video && canvas)) log('HTML context error!');
	else
	{
		if (navigator.getUserMedia) navigator.getUserMedia({video:true}, gotStream, noStream);
		else if (navigator.oGetUserMedia) navigator.oGetUserMedia({video:true}, gotStream, noStream);
		else if (navigator.mozGetUserMedia) navigator.mozGetUserMedia({video:true}, gotStream, noStream);
		else if (navigator.webkitGetUserMedia) navigator.webkitGetUserMedia({video:true}, gotStream, noStream);
		else if (navigator.msGetUserMedia) navigator.msGetUserMedia({video:true, audio:false}, gotStream, noStream);
		else log('getUserMedia() not available from your Web browser!');
	}
}

start();
//]]></script>
</body>
</html>

rencarnacion · June 22, 2013

English Please, the Most of member can understand English.

I Don't understand what you wrote in your message

Ronny Encarnacion

hendrang · June 23, 2013

English Please, the Most of member can understand English.

I Don't understand what you wrote in your message

Ronny Encarnacion

this forum is dedicated to posts in languages other than English.

mehmet07 · July 11, 2014

Merhaba Abi Bey,

Kaydetme işlemini yapabildiniz mi? Aynı sorun bende de mevcut.

Sign In

HTML5 ile Webcam den fotograf çekmek.

Recommended Posts

barutali@hotmail.com

Link to comment

Share on other sites

rencarnacion

Link to comment

Share on other sites

hendrang

Link to comment

Share on other sites

mehmet07

Link to comment

Share on other sites

Join the conversation

Browse

Activity