# Difficulties in starting out with p5.sound.js

**URL:** <https://discourse.processing.org/t/difficulties-in-starting-out-with-p5-sound-js/16637>\
**Category:** Libraries\
**Created:** [December 26, 2019, 7:16am UTC](https://discourse.processing.org/t/difficulties-in-starting-out-with-p5-sound-js/16637 "2019-12-26T07:16:58Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![roy05](https://avatars.discourse-cdn.com/v4/letter/r/a587f6/32.png) [@roy05](https://discourse.processing.org/u/roy05)\
**Post date:** [December 26, 2019, 7:16am UTC](https://discourse.processing.org/t/difficulties-in-starting-out-with-p5-sound-js/16637/1 "2019-12-26T07:16:58Z")

</div>

So I’m recently starting out with p5.sound.js to make an audio visualizer. However, I find myself stuck at the very first step and I would really appreciate any help.

Errors:

_The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page._

_Access to XMLHttpRequest at ‘file:///Users/theonlyroy/Desktop/Repositories/audio-visualizer/tb.mp3’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https._

Here’s the code snippet:

```auto

var song;
var fft;

function preload() {
  song = loadSound('tb.mp3');
}

function touchStarted() {
    getAudioContext().resume()
}

function setup() {
  createCanvas(256, 256);
  colorMode(HSB);
  angleMode(DEGREES);
  song.play();
  fft = new p5.FFT(0.9, 128);
}

```

I still don’t understand why the errors persist.

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [December 26, 2019, 7:26am UTC](https://discourse.processing.org/t/difficulties-in-starting-out-with-p5-sound-js/16637/2 "2019-12-26T07:26:56Z")

</div>

do you run that under a server environment?

because just as a index.html in a pc directory and a double click not work for loading files…  
( just some simple drawings… possible )

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [December 26, 2019, 7:28am UTC](https://discourse.processing.org/t/difficulties-in-starting-out-with-p5-sound-js/16637/3 "2019-12-26T07:28:31Z")

</div>

for Chrome could try

> **[Web Server for Chrome](https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb?hl=en)**
>
> A Web Server for Chrome, serves web pages from a local folder over the network, using HTTP. Runs offline.

add CORS

> **[Chrome Web Store](https://chrome.google.com/webstore/search/Cors%20?hl=en-US)**
>
> Discover great apps, games, extensions and themes for Google Chrome.

* * *

firefox use “CORS Everywhere”

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [January 8, 2020, 8:38am UTC](https://discourse.processing.org/t/difficulties-in-starting-out-with-p5-sound-js/16637/4 "2020-01-08T08:38:43Z")

</div>

By default, most browsers will not permit most Cross-Origin Resource Sharing (CORS) – like running a p5.js sketch from your desktop. Many past discussions:

[https://discourse.processing.org/search?q=CORS%20policy](https://discourse.processing.org/search?q=CORS%20policy)

If you use PDE in p5.js mode, this will run your sketches through a local webserver, solving that problem.

Or you can use a Chrome plugin, or Firefox. Or the p5.js web editor, if that meets your needs.