# Cannot load image locally

**URL:** <https://discourse.processing.org/t/cannot-load-image-locally/23213>\
**Category:** Beginners\
**Created:** [August 12, 2020, 4:29pm UTC](https://discourse.processing.org/t/cannot-load-image-locally/23213 "2020-08-12T16:29:09Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![carterjohnson](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/carterjohnson/32/8790_2.png) [@carterjohnson](https://discourse.processing.org/u/carterjohnson)\
**Post date:** [August 12, 2020, 4:29pm UTC](https://discourse.processing.org/t/cannot-load-image-locally/23213/1 "2020-08-12T16:29:09Z")

</div>

This is very basic, I understand.

My code below functions in the online editor, but it does not function locally in my own computer. I’ve tried downloading the p5.js file, as well as linking to it online, but to no avail. I’ve even tried various versions of the p5.js file.

I have also run it on various browsers (Firefox, Chrome, Safari, Brave), all with the same results: I get the canvas, but no image. If I try to use a preload function, I don’t even get the canvas, just an interminable “loading…”

```auto
let img;

function setup() {
  createCanvas(423, 600);
  background(220);
  img = loadImage("images/uccello.jpg");
}

function draw() {
  image(img, 0, 0, width, height);
}

```

Here is a link to the functioning code in the online editor: [https://editor.p5js.org/carterjohnson.sbu/sketches/M5nNcg7zo](https://editor.p5js.org/carterjohnson.sbu/sketches/M5nNcg7zo)

I’ve uploaded images of my local HTML file and folder structure.

 ![Screen Shot 2020-08-12 at 12.23.42 PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/d/d8be3f6147d5b6cd057d5d3d270e01f4f6f5295b.png)

I do get an error in Firefox that reads: **Uncaught (in promise) TypeError: NetworkError when attempting to fetch resource.**

I’d really appreciate any help. Thanks!

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [August 12, 2020, 6:31pm UTC](https://discourse.processing.org/t/cannot-load-image-locally/23213/2 "2020-08-12T18:31:53Z")

</div>

> [@Maximum size of a method in Processing](https://discourse.processing.org/t/maximum-size-of-a-method-in-processing/17136/29):
>
> Another workaround: [Chrome-allow-file-access-from-file.com](http://Chrome-allow-file-access-from-file.com) A more complete solution: More solutions: [GitHub.com/processing/p5.js/wiki/Local-server](http://GitHub.com/processing/p5.js/wiki/Local-server)

---

<div class="post-metadata">

**Author:** ![tabreturn](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tabreturn/32/3697_2.png) [@tabreturn](https://discourse.processing.org/u/tabreturn)\
**Post date:** [August 12, 2020, 6:49pm UTC](https://discourse.processing.org/t/cannot-load-image-locally/23213/3 "2020-08-12T18:49:22Z")

</div>

To add to @GoToLoop’s comment –

If you open your browser developer console, you’ll see that it lists a CORS error. You need to run this from a local webserver. It looks like you’re on a Mac? Which means you have Python pre-installed.

1. Open your _Terminal_ application
2. Type `cd ` (followed by a space), then drag your website folder onto the Terminal – the line look something like this: `cd /Users/username/Desktop/website`; hit the enter key
3. Then type: `python -m SimpleHTTPServer`, then enter
4. Open your web browser and enter [http://localhost:8000](http://localhost:8000) in the address bar.

The _index.html_ file should load automatically. It should load images fine now.

\* If you’ve installed Python 3, replace step 3 with `python3 -m http.server`