Image not loading

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

1 Like

Hello,

Have you try with a local server ?

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

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?
1 Like

Read: Chrome-allow-file-access-from-file.com
Or keep using Firefox or use Vivaldi, which is based on Chrome btW:

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

1 Like

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

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.

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

1 Like

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


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

1 Like