1

I have 2 HTML5 widgets, both made with Phaser.js and having images and audio, which are loaded on the fly by phaser library.

One of the widget(HTML5 file) works on local file system without XAMPP, while another only work when serve through XAMPP server.

I want to know why some HTML5 canvas files works without server while most of the time we require some server for canvas files.

Its a great confusion for me. Plz help.

2
  • CORS issues arise when a Resource is loaded Cross Origin and the server does not allow it's Resources to be Shared - if a page is loaded from the local filesystem, local filesystem Resources are considered same Origin - though, I think Chrome may have different ideas about this. It comes down to this ... how is the main page loaded, how is the Resource loaded - if they are the same, then it should be fine, if they are different, then you need CORS headers to proceed Commented Sep 19, 2016 at 4:38
  • Related: github.com/photonstorm/phaser/issues/3464 | web.archive.org/web/20230323212818/https://phaser.io/tutorials/… Commented May 29, 2023 at 13:46

2 Answers 2

3

There's a very good explanation of why you need a web server on the getting started page for Phaser.

What it boils down to is you need to use a web server because:

It's to do with the protocol used to access the files. When you request anything over the web you're using http, and the server level security is enough to ensure you can only access files you're meant to. But when you drag a file in it's loaded via the local file system (technically file://) and that is massively restricted, for obvious reasons. Under file:// there's no concept of domains, no server level security, just a raw file system.

...

Your game is going to need to load resources: images, audio files, JSON data, maybe other JavaScript files. And in order to do this it needs to run unhindered by the browser security shackles. It needs http:// access to the game files. And for that we need a web server.

Technically, none of your Phaser applications should run without a web server, it's quite odd that you got one of them to.

Sign up to request clarification or add additional context in comments.

1 Comment

That is the amazing part, that ONE phaser application run locally without any problem, while another dont. both have almost same asset (audio/img). No idea how that happen. :)
-1

Set game.load.crossOrigin = true in your preload code and it should work.

1 Comment

Brother... This is not working..

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.