Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Invalid or illegal string exception when Web Audio API audio context is created #171

Open
wavesinaroom opened this issue Oct 26, 2023 · 0 comments
Open

Invalid or illegal string exception when Web Audio API audio context is created #171

wavesinaroom opened this issue Oct 26, 2023 · 0 comments

Comments

@wavesinaroom
Copy link

I'm working on my personal website with vanilla javascript HTML and CSS to fill some holes I've got regarding tags and styling to name a few. Right now I'm trying to add some cool sound design to it with the Web Audio API but I'm not able to create an audio context. On Firefox my console reports the following:

Uncaught DOMException: An invalid or illegal string was specified

I've run the website on Edge as well, it doesn't throw the same exception though but same luck, I can't create an audio context. I've also removed defer from my <script> tag to check if my issue comes down to execution order but again I'm no able to create the audio context.

My last try was to simulate the issue with another project that scoped the problem and I couldn't get any better result or a clue that pointed me what I did wrong.

There's not much code to share because this is step one for my sound design implementation stage. I've got this so far:

index.html


<!DOCTYPE html>        
  <html lang="en-US">                                                                                
    <head>                                                                                          
      <meta charset="utf-8"/>
      <meta name="viewport" content="width=device-width, initial-scale=1"/>       
      <link rel="stylesheet" href="styles.css"/>                                              
      <title>Waves in a room portfolio</title>                                                      
      <script src="interaction.js" type="text/javascript" defer></script>                     
     </head>
  </html>

interaction.js

const audioCtxt = new AudioContext();

dnRaq

What baffles me is a previous project I worked on with React.js didn't have the same problem. Is there anything with vanilla Javascript/HTML/CSS that I should be aware of? Could you point out what I'm missing please?

BTW CSS works perfectly and some non audio related interaction inside the interaction file runs smoothly. Adding the line that creates the AudioContext is causing the issue. Also, adding const audioCtxt = new AudioContext(); inside <script> tag in index.html doesn't throw the exception.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@wavesinaroom