# Image not loading

**URL:** <https://discourse.processing.org/t/image-not-loading/11892>\
**Category:** Coding Questions\
**Created:** [June 7, 2019, 6:51am UTC](https://discourse.processing.org/t/image-not-loading/11892 "2019-06-07T06:51:24Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![CodingIsLife](https://avatars.discourse-cdn.com/v4/letter/c/6de8d8/32.png) [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Post date:** [June 7, 2019, 6:51am UTC](https://discourse.processing.org/t/image-not-loading/11892/1 "2019-06-07T06:51:24Z")

</div>

I loaded a local image in the preload() function. When I opened the sketch in chrome it says Loading… and in the console it says some weird message - access to image at is from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

But when I opened the sketch in firefox, it worked just fine… I don’t know how to solve it…  
Please help me out…  
Thanks in advance!!  
[Here goes the image of my problem](https://discourse.processing.org/uploads/short-url/zxyTdGVp8JXwsHaKCO9ECwzw0pk.png)

---

<div class="post-metadata">

**Author:** ![LittleBoxes](https://avatars.discourse-cdn.com/v4/letter/l/ee59a6/32.png) [@LittleBoxes](https://discourse.processing.org/u/LittleBoxes)\
**Post date:** [June 7, 2019, 7:30am UTC](https://discourse.processing.org/t/image-not-loading/11892/2 "2019-06-07T07:30:33Z")

</div>

Hello,

Have you try with a local server ?

---

<div class="post-metadata">

**Author:** ![CodingIsLife](https://avatars.discourse-cdn.com/v4/letter/c/6de8d8/32.png) [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Post date:** [June 7, 2019, 8:28am UTC](https://discourse.processing.org/t/image-not-loading/11892/3 "2019-06-07T08:28:29Z")

</div>

Frankly speaking, I am a complete beginner. I don’t know what you are talking about. Would you please explain?

---

<div class="post-metadata">

**Author:** ![Tiemen](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tiemen/32/5477_2.png) [@Tiemen](https://discourse.processing.org/u/Tiemen)\
**Post date:** [June 7, 2019, 8:54am UTC](https://discourse.processing.org/t/image-not-loading/11892/4 "2019-06-07T08:54:26Z")

</div>

Good morning CodingIsLife,

I guess what LittleBoxes wonders is whether the issue might be resolved if you upload the sketch and/or image to an online server rather than running things from your local device (we can tell since it says _D://_ in the address bar). I think the best course of action for now is to try and pinpoint the problem, such as:

- Try replacing your local image link with any online image. Does Chrome still give the exact same error?
- Seeing it works in Firefox but not in Chrome, it could be a browser setting. Have you tested in other browsers as well? Do they give the same error?

---

<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:** [June 7, 2019, 4:31pm UTC](https://discourse.processing.org/t/image-not-loading/11892/5 "2019-06-07T16:31:31Z")

</div>

> [@CodingIsLife](#):
>
> When I opened the sketch in Chrome…

Read: [Chrome-allow-file-access-from-file.com](http://Chrome-allow-file-access-from-file.com)  
Or keep using Firefox or use Vivaldi, which is based on Chrome btW:

> **[Vivaldi Browser | Powerful, Personal and Private web browser](https://vivaldi.com)**
>
> It’s a web browser. But fun. It comes with a bunch of clever features built-in. It’s super flexible and does not track you. Get the Vivaldi browser for desktop, mobile, and your car!

Further reading about CORS and the `file:://` URL scheme:

> [@Cannot Create Classes](https://discourse.processing.org/t/cannot-create-classes/8756/17):
>
> AFAIK, Firefox-based browsers treat the file:// URL scheme the same way as the http:// URL scheme. fox_face Thus far I haven’t found any issues at all when running Processing sketches on Firefox under its file:// URL scheme. partying_face Firefox-based browsers use the Gecko Spidermonkey JS engine. spider But if we prefer/need to test JS on the Chrome’s Blink V8 engine instead, we can use the Vivaldi browser: musical_score Similarly to Firefox, Vivaldi doesn’t restrict the file:// …

---

<div class="post-metadata">

**Author:** ![LittleBoxes](https://avatars.discourse-cdn.com/v4/letter/l/ee59a6/32.png) [@LittleBoxes](https://discourse.processing.org/u/LittleBoxes)\
**Post date:** [June 7, 2019, 5:58pm UTC](https://discourse.processing.org/t/image-not-loading/11892/6 "2019-06-07T17:58:21Z")

</div>

A local server is server on your own machine.  
There is a lot of ready-made software solution or even as a plugin for some IDE (like VSCode or other…)

You can also easily create one with a little python script or with node.js.

it can avoid having CORS problems

---

<div class="post-metadata">

**Author:** ![CodingIsLife](https://avatars.discourse-cdn.com/v4/letter/c/6de8d8/32.png) [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Post date:** [June 8, 2019, 3:08am UTC](https://discourse.processing.org/t/image-not-loading/11892/7 "2019-06-08T03:08:25Z")

</div>

Is there no other way that would enable me run my simple little sketch in chrome from my own device? I mean it would be much more easy for a beginner level one like me.

---

<div class="post-metadata">

**Author:** ![ZachMcMkay](https://avatars.discourse-cdn.com/v4/letter/z/8e7dd6/32.png) [@ZachMcMkay](https://discourse.processing.org/u/ZachMcMkay)\
**Post date:** [June 8, 2019, 7:19am UTC](https://discourse.processing.org/t/image-not-loading/11892/8 "2019-06-08T07:19:31Z")

</div>

Using the atom text editor can help because there are plenty of packages that you can add to your editor that allows you to run a live server at the click of a button and i’ve yet to run into any issues. I suggest downloading atom for coding, then under packages-\>Settings view -\> install packages search “server”. It will pull up atom-live-server by jas-chen. Very handy

---

<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:** [June 8, 2019, 7:54am UTC](https://discourse.processing.org/t/image-not-loading/11892/9 "2019-06-08T07:54:31Z")

</div>

> [@ZachMcMkay](#):
>
> … that allows you to run a live server at the click of a button…

In my own Atom, I use packages “atom-live-server-plus” + “tool-bar” for such functionality: 📦

> **[Sunsetting Atom](https://github.blog/2022-06-08-sunsetting-atom/)**
>
> We are archiving Atom and all projects under the Atom organization for an official sunset on December 15, 2022.

> **[Sunsetting Atom](https://github.blog/2022-06-08-sunsetting-atom/)**
>
> We are archiving Atom and all projects under the Atom organization for an official sunset on December 15, 2022.

Package “atom-html-preview” is also nice for a quick preview inside Atom: ⚛

> **[Sunsetting Atom](https://github.blog/2022-06-08-sunsetting-atom/)**
>
> We are archiving Atom and all projects under the Atom organization for an official sunset on December 15, 2022.
