Best Approach for Loading User Audio?

I am in the process of adapting a music visualizer prototype from vanilla Processing to p5.js, and assets clearly work differently in a browser app than in a desktop app. Basically, I need to determine the best way to allow a user to use their own audio selections with my visualizer, and I'd rather ask some knowledgeable individuals before I waste a lot of time trying to get the p5.sound/Web Audio API to do something it's not meant to do.

I need an audio source that I can plug into an FFT object. As far as I see it, there are three approaches available:

(1) Acquire a reference to the output of the client's soundcard (audio monitor), akin to an AudioOutput object in Minim, and analyze that, allowing the user to play music in their preferred way and simply pull up the visualizer in a new window. If possible, this would be preferable;

(2) Load an audio asset from the user's hard disk into the browser environment;

(3) Accept a URL to a web-based audio asset.

I know that, for security reasons, JavaScript cannot simply dig files up from a user's hard disk, and I imagine there might not be a straight-forward way to capture an audio monitor, either. The URL approach, while not my ideal outcome, sounds like the most feasible, but I'm not sure how to load an external resource like that into the p5.sound environment, which as far as I can tell only accepts a local file accessible from the sketch folder.

I'm not asking for a complete solution or anything, but if someone could point me in the right direction, perhaps towards some relevant reference docs, I'd be very grateful.

Sign In or Register to comment.