Graphics Reference
In-Depth Information
Solving
cross-origin-domain
error
messages in Chrome
When you are developing Three.js applications, the simplest way of testing your ap-
plication is to just open the file in your browser. For a lot of scenarios, this will work,
until you start loading textures and models. If you try to do this, you'll be presented
with an error that looks something like this:
This error, which you can easily reproduce yourself by just dragging
01.09-solve-
cross-origin-issues.html
to your browser, will have the terms
cross-origin
or
SecurityError
in its message. What this error means is that the browsers prevents
the current page loading a resource from a different domain. This is a necessary
feature to avoid maleficent websites access to personal information. During develop-
ment, however, this can be a bit incovenient. In this recipe, we'll show you how you
can circumvent these kinds of errors by tweaking the security settings of your browser.
We'll take a look at how to disable the security checks for the two browsers that have
the best support for WebGL: Chrome and Firefox. In this recipe, we'll look at how to
do this in Chrome, and in the next recipe, we'll show you how to do this in Firefox.
An important note, though, before we go on with the recipe. If you can, run a local
web server. It's much more secure and doesn't result in low security settings in your
browser.
How to do it...
1. After the installation of Chrome is complete, we will then need to disable the
security settings in Chrome, for which we have to pass a command line para-
meter. Each operating system, however, does this slightly differently:
• For Windows, you call the following (from the command line):
