0

This is my first project using javascript (basically forked code from here: https://www.kkhaydarov.com/audio-visualizer/)

I'm trying to build a visualizer that responds to the audio I am hosting.

Problems: - Getting thrown a CORS 400 error (i'm using https://cors-anywhere.herokuapp.com/http:// in my source url) - Audio is not getting recognized

Here is a link to my project on codepen: https://codepen.io/beewash92/project/editor/ZGWOQr Code is also stored on my github: https://github.com/beewash/js-audio-visualizer

enter code here

I've scoured other posts on stackoverflow and across the web, but still running into issues. You're help is appreciated !

1 Answers1

-1

If you try to browse the link in chrome you will get the message as below

Missing required request header. Must specify one of: origin,x-requested-with

You will need to define the custom request header as stated above in order for it to work. Refer the api here as it clearly stated what you should do beforehand.

You should create a request with the header as follows

fetch('https://cors-anywhere.herokuapp.com/http://soundcloud.com/gentttry/10999-1', {
    'headers': {
        'Origin': 'soundcloud.com'
    }
})
.then(res=>res.blob())
.then(blob=>URL.createObjectURL(blob))
.then(audio_src=>{
    // Then init your audio here and assign the url
})
xxMrPHDxx
  • 657
  • 5
  • 11