Noise when recording voice from safari browser

Description

I have implemented audio record feature in my website.But audio record result me recorded audio with noise.

Steps to reproduce

go to https://qa.myu.co on safari browser. then login using username and password use username:gituser use password:123456

then u will find the audio icon click on that than use it to record audio.

Results

After that when you replay the audio you recorded than you will find the issue with the recorded audio.

Expected

Need recorded voice to be clear

Actual

The recoded audio on safari have noise so i can’t understand the audio.

Additional Information

Please include any additional information necessary here. Including the following:

versions

VIDEOJS: Using video.js 6.9.0 with videojs-record 2.1.2 + videojs-wavesurfer 2.2.2 and recordrtc 5.4.6

videojs

browsers

safari

platform

what platforms (operating systems and devices) are affected? mac

Code used by me is

 var obj = document.createElement('audio');
      $(obj).attr('id', 'myAudio');
      $(obj).attr('class', 'video-js vjs-default-skin');
      $(obj).attr('style', 'width:80%; margin:auto;');
      $("#rec_audio_div").append(obj);
      playerAudio = videojs("myAudio", {
        controls: true,
        width: 400,
        height: 200,
        controlBar: {
          fullscreenToggle: false,
          volumePanel: false
        },
        plugins: {
          wavesurfer: {
            src: "live",
            waveColor: "#36393b",
            progressColor: "black",
            debug: true,
            cursorWidth: 1,
            msDisplayMax: 20,
            hideScrollbar: true
          },
          record: {
            audio: true,
            video: false,
            maxLength: that.audioVideoLimit
          }
        }
      },  function() {
    // print version information at startup
    videojs.log('Using video.js', videojs.VERSION,
        'with videojs-record', videojs.getPluginVersion('record'),
        '+ videojs-wavesurfer', videojs.getPluginVersion('wavesurfer'),
        'and recordrtc', RecordRTC.version);
  });
  playerAudio.on('deviceError', function() {
    that.alertOnDeviceError(playerAudio.deviceErrorCode);
    console.log('device error:', playerAudio.deviceErrorCode);
  });
  playerAudio.on('error', function(error) {
    that.alertOnDeviceError(error);
    console.log('error:', error);
  });
  // user clicked the record button and started recording
  playerAudio.on('startRecord', function() {
    console.log('started recording!');
    that.state = 1;
    progress=0;
    startAudioTime();
  
  });
  // user completed recording and stream is available
  playerAudio.on('finishRecord', function() {
    that.state = 2;
    clearInterval(recordTimer);
  });

[dirkk0]

@thijstriemstra yes, it works: Safari 12 Mac OSX, and Safari 11 ( I think, I am still on iOS 11.3.) (whoever tries this, remember to use https)

[dirkk0]

Actually it doesn’t work at all in Safari11/MacOSX. You can only chose ‘Microphone’ and only ‘ogg’ and after recording, nothing happens (i.e. I don’t hear anything). The error on the console is: “Unhandled Promise Rejection: AbortError: The operation was aborted.” RecordRTC: 1550

On Chrome, it works fine.