Недавно яМы пытались создать фотобудку, опираясь на Webrtc, и почти завершили весь код, кроме меня.Мы не смогли найти способ сохранить изображение после того, как оно было снято.

Это самый близкий ямы дошли до достижения моей цели:

 
    
    fotogoof
    
    
    
            window.onload = function () {
                var img = document.getElementById('screenshot');
                var button = document.getElementById('saveImage');
                img.src = '';
                img.onload = function () {
                    button.removeAttribute('disabled');
                };
                button.onclick = function () {
                    window.location.href = img.src.replace('image/png', 'image/octet-stream');
                };
            };
    
    
    
    
      
        Html5 Photobooth
      
    
    
    
    
      
        
        
          
          
          
        <br><img id="screenshot"><br>
        
      
    
      
    

Код по существу берет поток веб-камеры и передает его в элемент canvas. Нажатие кнопки пробела запускает снимок экрана, который затем появляется в виде изображения. Потому что я'При невозможности указать точный источник загружаемого файла кнопка только открывает изображение на другой вкладке в браузере, а не работает должным образом. Я был бы очень признателен за то, как я могу решить эту проблему. Спасибо заранее. Я

Мы уже успели сделать захват потока с холста в изображении с помощью этого кода:

document.addEventListener ('keydown', function (event) {
        if(event.keyCode == 32) {
         document.querySelector('#screenshot').src = canvas.toDataURL('image/webp')
        }
})

Что я хочу знать, так это как дать пользователю возможность сохранить изображение на свой компьютер оттуда.