rogiivs

У вас прямо в сообщении английским по белому написано: HTTP wrapper does not support writeable connections

Через file_put_contents нельзя сохранить файл по http. Используйте curl или что-то подобное.

Так вам же английским по белому пишет: обёртка HTTP (которую file_put_content использует для работы) не поддерживает запись файлов.

У вас в системе корневые сертификаты для curl не залиты, самое простое решение - принимать все сертификаты без валидаци...

curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);

function Constr() {
    let self= this; // <<<<<<<<<<<<
    this.onStart = function () {
        console.log('start');
    };
    this.func = function () {
        navigator.getUserMedia({audio: true}, function (stream) {
            self.onStart()  // <<<<<<<<<<<
            },
            function (error) {

            });
    }
}

для таких вот случаев и были сделаны arrow function. и не нужно заниматься ерундистикой с сохранением контекста, там где это не требуется:

function Constr() {
  this.onStart = function() {
    console.log('start')
  }
  
  this.func = function() {
    navigator.getUserMedia({ audio: true }, stream => {
      this.onStart()
    }, function(error) {
      
    })
  }
}

Селектор li:hover ~ .active::after можно прочитать так:
выбрать псевдоэлементы after элементов с классом active, которые идут после элемента li, на который навели указатель. Почитать про селектор можно здесь.