You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.2 KiB
HTML
47 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Title</title>
|
|
</head>
|
|
<body>
|
|
<video id="video" autoplay></video>
|
|
<canvas id="canvas" style="display:none;"></canvas>
|
|
<button onclick="takePhoto()">Take Photo</button>
|
|
|
|
<script>
|
|
const video = document.getElementById('video');
|
|
|
|
// Request camera access
|
|
navigator.mediaDevices.getUserMedia({ video: true })
|
|
.then(stream => video.srcObject = stream)
|
|
.catch(err => console.error("Camera access denied", err));
|
|
|
|
function takePhoto() {
|
|
const canvas = document.getElementById('canvas');
|
|
canvas.width = video.videoWidth;
|
|
canvas.height = video.videoHeight;
|
|
|
|
// Draw current frame
|
|
const context = canvas.getContext('2d');
|
|
context.drawImage(video, 0, 0);
|
|
|
|
// Convert to base64 or Blob
|
|
canvas.toBlob(blob => {
|
|
// Upload blob to server
|
|
const formData = new FormData();
|
|
formData.append("photo", blob, "photo.jpg");
|
|
|
|
fetch("https://your-upload-url.com/upload", {
|
|
method: "POST",
|
|
body: formData
|
|
}).then(res => console.log("Uploaded"))
|
|
.catch(err => console.error("Upload failed", err));
|
|
}, "image/jpeg");
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|
|
|
|
|