P5.js: loadImage() won't load image

[rchen8]

var image = loadImage("portrait.jpg");
image = loadImage("/Users/richard/Documents/Code/portrait.jpg");
image = loadImage("http://stanford.edu/about/images/intro_about.jpg");

I checked to make sure the image and the .js file are in the same directory. All three methods return the same Javascript error to the console:

p5.js says: It looks like there was a problem loading your image. Try checking if the file path [...insert file path here...] is correct, hosting the image online, or running a local server.[https://github.com/processing/p5.js/wiki/Local-server]

[lmccart]

hi @rchen8 only the first one will work, the path needs to be relative to the HTML file. loading from any other location doesn't work as the browser may prevent it due to security issues. I just tested line one and it seems to work for me.

[rchen8]

Fixed the issue. Browser security blocked the file path, so I needed to run a local server.