Game dev with phaser, CORS issue, help needed badly

Hi, I need some help. I am working on Learning Game Development with Phaser. Everything was going fine until I started getting random CORS errors. I dont know what happened. I opened into the middle of a project and the sprites would no longer correctly load but as just black squares instead of the image. The console log shows this error:

Access to XMLHttpRequest at ‘https://content.codecademy.com/courses/learn-phaser/physics/codey.png’ from origin ‘https://93f7fb5ca1a44eff864de9f38bd64116.cc-propeller.cloud’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
phaser.min.js:1
GET https://content.codecademy.com/courses/learn-phaser/physics/codey.png net::ERR_FAILED

But, I do not know what changed. I am using Microsoft Edge but have tried in Chrome as well with the same result. All extensions have been disabled and still the same error. Does anyone have any idea what I might have done or how to fix?

Hello, I completed this course a few weeks ago and had to use Firefox to get around the CORS issues due to the way their embedded browser pane works. In one of the lessons, it mentioned this possibility but they may have moved things around.

Don’t worry though, whatever code you develop will work on Chrome, Edge, etc. when you go to publish. It’s just how the embedded browser pane is for the integrated lessons.

Its broken in Firefox as well. :frowning:

Can you link to a specific lesson that you’re seeing the issue on?

I am using the ‘https://cors-anywhere.herokuapp.com/’ CORS work around but its a pain in the @$$ to have to implement it in every screen to work through the lessons and projects as it doesn’t save my code changes for their sprites and images between steps. Everything was working fine and then it just stopped working. Something must be able to be changed to allow it to work properly again.

https://www.codecademy.com/courses/learn-phaser/projects/bug-invaders
is the current project I am in.

You’re right, it no longer works on Firefox either. Something changed between September 26th and now causing this, since that was the date of the projects I saved to my computer for that course.

image

yeah that seems like when mine broke as well. mid lesson. everything was working fine, went to the next part of the same lesson and bam, broken. thank you for the replies, if you append https://cors-anywhere.herokuapp.com/ to the beginning of their image links it will work around the CORS. ie.

this.load.image(‘bug1’, ‘**https://cors-anywhere.herokuapp.com/**https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_1.png’); but without the asteriks

1 Like

Once you’re past any of the steps that check for specific URLs being loaded, then that’s a good workaround for now.

Hopefully this is something they solve soon. A month ago I was able to finish the whole course without issues like this on Firefox, so I wonder if that browser updated and is now just as strict as the others or if something was changed on the server side.