0

The Recorder.js library works well on iOS, but when I add the following function to add effect to the voice, the recorder does not work. How to solve the following problem?

async function loadTransform(e, transformName, ...transformArgs) {
    
        let outputSection = document.getElementById("output");
        outputSection.style.display = "flex";
        document.getElementById("body").style.overflow = "hidden";
    
        if(!globalAudioBuffer) {
            let ctx = new AudioContext();
            globalAudioBuffer = await ctx.decodeAudioData(arrayBuffer);
        } 
        
        let outputAudioBuffer = await window[transformName+"Transform"](globalAudioBuffer, ...transformArgs);
        let outputWavBlob = await audioBufferToWaveBlob(outputAudioBuffer);
        let audioUrl = window.URL.createObjectURL(outputWavBlob); 
        let audioTag = document.getElementById("audioTag");
        audioTag.src = audioUrl;
        audioTag.play();
        audioTag.addEventListener('click', audioTag.play());
        blob = outputWavBlob;
    
    }
georgeawg
  • 48,608
  • 13
  • 72
  • 95
Abdulrahman Fawzy
  • 149
  • 3
  • 11
  • "the following problem"...but what _is_ the problem? Explain the issue, please. "Does not work" is not useful information. If it worked, you wouldn't be asking. We need meaningful data about the problem. Tell us any error messages, unexpected behaviour and any debugging data which might be relevant (we'll assume you've tried to debug this before asking, yes?). Don't expect we've all got iOS devices to hand where we can run your code. – ADyson Oct 23 '18 at 13:58
  • @ADyson, I'm very sorry Adyson because I'm a new user on StackOverFlow and I will learn how to write the post in a good way. `if(!globalAudioBuffer) { let ctx = new AudioContext(); globalAudioBuffer = await ctx.decodeAudioData(arrayBuffer); } ` This line globalAudioBuffer = await ctx.decodeAudioData(arrayBuffer); does not work well on iOS. – Abdulrahman Fawzy Oct 23 '18 at 14:02
  • Again "does not work" is not useful information. We already know that, or else you wouldn't be asking the question. It doesn't matter if you're new to this website or not, if you were explaining it to a developer sat next to you, they would inevitably start to ask the same kind of questions. Think about if someone was explaining it to you, what would you need to know in order to try and solve the problem? We can't see your environment, or your data, or your mind (!), so we need you to explain it fully to us. – ADyson Oct 23 '18 at 14:04
  • When someone opens my website from Safari on iOS, the recorder works well, but when I add this function, the recorder does not work well because iOS doesn't support decodeAudioData. – Abdulrahman Fawzy Oct 23 '18 at 14:05
  • @ADyson, If you understand Arabic, I will write the problem in a good way – Abdulrahman Fawzy Oct 23 '18 at 14:08
  • This site is for English speaking only, sorry. Even if I personally spoke Arabic, you have to make it readable for others too. Anyway if you already know it's not supported, then what are you asking about? You simply can't use that method in that environment. I don't know if you can take the source code implementation from elsewhere any make a polyfill, it depends if it requires some native function of the O/S or browser which Apple doesn't support. You'd have to investigate, it's too big a job for a question on StackOverflow, sadly. – ADyson Oct 23 '18 at 14:09
  • Actually a quick bit of googling (which you might have done for yourself, to be honest) reveals that there is _some_ support. See https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/decodeAudioData in the compatibility table, but it's only basic support, there's no support for the promise-based syntax, so you would have to use callbacks. There's already a StackOverflow question about it here: https://stackoverflow.com/questions/48597747/how-to-play-a-sound-file-safari-with-web-audio-api – ADyson Oct 23 '18 at 14:14
  • Do you know function its role is to add effect to the voice instead of this?! because my website does not work on iOS and in this way, I've lost all users on iOS. @ADyson – Abdulrahman Fawzy Oct 23 '18 at 14:14
  • And another one here: https://stackoverflow.com/questions/52489787/audiocontext-decodeaudiodata-not-working-on-iphone-but-working-everywhere-e . And other sites have mentions of it too. – ADyson Oct 23 '18 at 14:14
  • Both of those could probably be nominated as duplicates of this question. Did you not search anything like this previously? I found it in a few seconds once I started googling. All I searched was "AudioContext.decodeAudioData iOS"...nothing clever. – ADyson Oct 23 '18 at 14:15
  • I'm really sorry because I'm tired and I didn't clear anything. I'm very sorry. @ADyson. I'll clear my question next time Inshaa Allah. – Abdulrahman Fawzy Oct 23 '18 at 14:34
  • No need to apologise, I'm just curious as to how you didn't find this information already, if you say you've been suffering this problem for some time. – ADyson Oct 23 '18 at 14:54
  • @ADyson. Thanks a lot for helping me <3 – Abdulrahman Fawzy Oct 23 '18 at 14:57
  • `context.decodeAudioData(arrayBuffer, (buffer) => { resolve(buffer); }, (e) => { reject(e); });`...I've used the previous code, but it the console says 'resolve is not identified'. What's the solution? @ADyson – Abdulrahman Fawzy Oct 23 '18 at 19:40
  • what version of Safari for iOS are you testing with? Or have you tried the version shown [here](https://stackoverflow.com/a/48597898/5947043) instead? – ADyson Oct 23 '18 at 19:45
  • I tried it and the error is as the following on Safari: **Unhandled Promise Rejection: TypeError: Argument('audioData') to webkitAudioContext.decodeAudioData must be an instance of ArrayBuffer** @ADyson – Abdulrahman Fawzy Oct 23 '18 at 21:54
  • This problem has annoyed me because I had been trying to solve it @ADyson – Abdulrahman Fawzy Oct 23 '18 at 22:02
  • obviously I don't know _exactly_ how you integrated it into your own code, so perhaps there's some subtle problem. Perhaps you could edit the question with a new snippet showing your latest attempt and the error. – ADyson Oct 24 '18 at 08:19
  • I've solved the problem, but there is another problem and it's ** let outputAudioBuffer = await window[transformName+"Transform"](globalAudioBuffer, ...transformArgs); alert("Working"); ** The alert is not appeared after this line of code, but when we remove the word_await_ from this line of code, the alert is appeared** How to solve the problem with saving the word _await_ @ADyson – Abdulrahman Fawzy Oct 24 '18 at 21:46
  • بببببببببببببببببببببببببببببببببببببببببببببببببببب – Abdulrahman Fawzy Oct 24 '18 at 22:07
  • presumably it's not happening because either the transform operation is taking a very long time or it's failing. Without knowing or seeing any error messages it would be hard to say what action to take. – ADyson Oct 25 '18 at 08:01

0 Answers0