Pada tutorial kali ini kita akan mencoba memanfaatkan kamera handphone untuk menangkap gambar, rekam suara dan video lalu langsung menguploadnya dengan menggunakan PHP.

Biasaya kita ambil gambar dulu disimpan di memori baru lalu di browse, baru di upload. Kali ini kita coba ganti browse dengan langsung ambil gambar melalui kamera Handphone.

HTML Media Capture

Emang bisa ya halaman web kita langsung konek dengan kamera atau speaker di handphone? Jawabannya bisa, dengan HTML kita bisa memanfaatkan fitur HTML Media Capture dengan menambahkan sedikit script pada form input.

Oke langsung saja, kita buat form seperti ini, dengan nama file capture.html

<form action="proses.php" enctype="multipart/form-data" method="post">  
	<input name="MAX_FILE_SIZE" type="hidden" value="3000000" />  
	File Name : <input name="userfile" type="file" accept="image/*" capture />








<hr>








	<input type="submit" value="Upload Now" />
</form>



 
File Name: capture.html

Bisa dilihat pada script diatas kita menambahkan accept="image/*" capture pada input file.

Untuk bisa merekam suara atau video tambahkan kode seperti ini

<input type="file" accept="image/*" capture="camera">
<input type="file" accept="video/*" capture="camcorder">
<input type="file" accept="audio/*" capture="microphone">

Cek mobilehtml5.org untuk melihat kompatibilatas saat ini.

Agar file bisa diupload kita menggunakan PHP untuk menangani upload file ke server, beri nama file tersebut proses.php

<?php 
$sumber = $_FILES['userfile']['tmp_name'];
$target = 'upload/'.$_FILES['userfile']['name'];

if(move_uploaded_file($sumber, $target))
{
 echo "File Uploaded Successfully";
 echo "Uploaded File : 
 ";
 echo "<img src='$target'>";
}
else 
	echo"Can't Upload Selected File ";
?>
File Name: proses.php

Silahkan akses file capture.html melalui handphone dan browse file, maka yang akan terbuka adalah aplikasi kamera di handphone anda, ambil foto dan langsung tekan tombol submit untuk mengupload foto.

HTML Media Capture

Jika ingin lebih keren lagi anda bisa memanfaatkan ajax, agar seketika setelah anda mengambil foto dengan kamera handphone maka langsung akan terupload ke server.

Demo | Downlaod Source Code

Sekian tutorial singkat kali ini, tentunya ini hanya contoh dan semoga bisa menginspirasi anda untuk membuat aplikasi yang lebih berguna dengan memanfaatkan kamera atau perekam suara / video yang ada di handphone, semisal untuk aplikasi parkir, data pegawai, aplikasi web seperti instagram, dll.

Terima kasih, nantikan artikel menarik berikutnya hanya di JurnalWeb.COM