Fix CORS errors in Getting Started with Phaser 3

Phaser 3
1

hello world cors error
hello world cors error800×600 6.12 KB

If you’re doing Getting Started with Phaser 3: Part5 – Hello World! and getting errors similar to

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://cdn.phaserfiles.com/v385/assets/skies/space3.png. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

download the images in your browser, move them into your project folder (next to index.html), change the preload code to

preload ()
{
  this.load.image('sky', 'space3.png');
  this.load.image('logo', 'phaser3-logo.png');
  this.load.image('red', 'red.png');
}

and reload.

(You can also try the new Getting Started with Phaser Launcher instead. Phaser Launcher has a built-in media library.)

2

Getting this error as well on my project. The image is stored on google bucket storage. Load the image as url give me cors. Set the cors configuration to the bucket solved the issue.