HTML5: Take photo with webcam

Robert AndresenUncategorized Leave a Comment

I needed a simple way to take product images on a local webpage.

Instead of taking a picture with you phone, send image to your computer and upload it – why not use a simple webcam?

I followed this tutorial: So look at the tutorial if you need more info.



Take a photo with your webcam


You have to accept that your browser can access the webcam, if you haven't already!




"; // Show photo

		list($type, $rawData) = explode(';', $rawData);
		list(, $rawData)      = explode(',', $rawData);
		$unencoded = base64_decode($rawData);
		$filename = $getMercID.'_'.date('dmYHi').'_'.rand(1111,9999).'.jpg'; // Set a filename
		file_put_contents("images/products/$filename", base64_decode($rawData)); // Save photo to folder

		// Update product database with the new filename
		$query = "UPDATE products SET 
					WHERE id='".$getMercID."'";
		$result = $mysqli->query($query);

	// Stop if product id is missing
	else {
		die('Product ID is missing...');