javascript - Issues with HTML5 Audio Visualiser -
i experimenting code found on website. source of here:
http://themaninblue.com/experiment/webaudioapi/source.zip
now thing is: local file works fine, when attempt connect file on internet (basically changing src
attribute audio), plays, can't hear anything. further, visualizer not doing anything.
edit: thing changed in html code is:
<audio id="music" src="http://www.mfiles.co.uk/mp3-downloads/edvard-grieg-peer-gynt1-morning-mood.mp3" autoplay controls preload="auto" ></audio>
i used <body onload="init()">
instead of event listener. haven't changed else
what may done such visualizer work online files (or streams)?
anything allows read , analyze bits , bytes such byte arrays (xmlhttprequest), audio data (web audio api) or image data (via canvas 2d context) restricted cross-origin resource sharing, or cors short.
it related security , browsers prevent cors usage if source server doesn't allow such usage, , source server (origin) not same page itself.
the way around either:
- copy file same server (or origin) page loading from
- configure remote server allow cors usage - if don't have access not option
- set proxy page on own server (the same page playing audio) on server side loads audio file , hand through server page.
if server allow cors usage can try add crossorigin attribute tag:
<audio id="music" crossorigin = "anonymous" src="http://www.mfiles.co.uk/mp3-downloads/edvard-grieg-peer-gynt1-morning-mood.mp3" autoplay controls preload="auto" > </audio>
see this link further details.
Comments
Post a Comment