使用HTML5的拍照API可以实现网页拍照功能，具体步骤如下：
<input type="file" accept="image/*" id="cameraInput">let cameraInput = document.querySelector('#cameraInput');
cameraInput.addEventListener('change', function() {
let file = cameraInput.files[0];
let reader = new FileReader();
reader.onload = function(e) {
let img = document.createElement('img');
img.src = e.target.result;
document.body.appendChild(img);
};
reader.readAsDataURL(file);
});<button id="cameraBtn">拍照</button>
let cameraBtn = document.querySelector('#cameraBtn');
cameraBtn.addEventListener('click', function() {
navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
let video = document.createElement('video');
video.srcObject = stream;
video.play();
document.body.appendChild(video);
});
});<button id="cameraBtn">拍照</button>
let cameraBtn = document.querySelector('#cameraBtn');
cameraBtn.addEventListener('click', function() {
navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
let video = document.createElement('video');
video.srcObject = stream;
video.play();
document.body.appendChild(video);
let canvas = document.createElement('canvas');
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
let ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
let a = document.createElement('a');
a.download = 'photo.png';
a.href = canvas.toDataURL();
a.click();
video.pause();
stream.getTracks()[0].stop();
});
});上述代码实现了HTML5拍照API的基本功能，但是需要注意的是，getUserMedia方法需要在HTTPS协议下才能正常使用，否则会报错。