无法在 AWS EC2 中读取未定义的属性（正在读取 'getusermedia' ）

Question

我在 AWS EC2 中部署了一个 django 应用程序，以便从扬声器录制音频。 这是我录制音频流的代码；

let log = console.log.bind(console),
id = val => document.getElementById(val),
ul = id('ul'),
gUMbtn = id('gUMbtn'),
start = id('start'),
stop = id('stop'),
stream,
recorder,
counter=1,
chunks,
media;


gUMbtn.onclick = e => {
    let mv = id('mediaVideo'),
        mediaOptions = {            
            audio: {
            tag: 'audio',
            type: 'audio/wav',
            ext: '.wav',
            gUM: {audio: true}
            }
        };
    media = mediaOptions.audio;
    navigator.mediaDevices.getUserMedia(media.gUM).then(_stream => {
        stream = _stream;
        id('gUMArea').style.display = 'none';
        id('btns').style.display = 'inherit';
        start.removeAttribute('disabled');
        recorder = new MediaRecorder(stream);
        recorder.ondataavailable = e => {
            chunks.push(e.data);
            if(recorder.state == 'inactive'){
                
                makeLink();
            }  
        };
        log('got media successfully');
    }).catch(log);
}

start.onclick = e => {
  start.disabled = true;
  stop.removeAttribute('disabled');
  chunks=[];
  recorder.start();
}

stop.onclick = e => {
  stop.disabled = true;
  recorder.stop();
  start.removeAttribute('disabled');
}

function makeLink(){
  let blob = new Blob(chunks, {type: media.type })
    , url = URL.createObjectURL(blob)
    , li = document.createElement('li')
    , mt = document.createElement(media.tag)
    , hf = document.createElement('a')
  ;
  
  mt.controls = true;
  mt.src = url;
  hf.href = url;
  hf.download = `${counter}${media.ext}`;
  hf.innerHTML = `donwload ${hf.download}`;
  li.appendChild(mt);
  li.appendChild(hf);
  ul.innerHTML = ""; 
  ul.appendChild(li); 
  
}

当我在服务器中运行该代码时，它显示“未捕获的类型错误：无法读取未定义的属性（读取 'getUserMedia'）”

如果有人以前有过这种情况，请帮我一把！

Answer 1

当我在 https 上托管应用程序时，它运行良好。 实际上 mediaDevice 在 http 是未定义的。