I normally use Chrome for browsing and the threejs.org site runs fine there. I’ve been experimenting with three.js for the past few weeks, using various examples from the master.zip and tinkering with them, but when I ran all my tests they opened in Microsoft Edge by default. I didn’t question it; I have tons of tabs open in Chrome as it is, so it was nice to have a separate browser for viewing my progress. I got to a point where I was ready to show things to my coworkers and they couldn’t view it. That’s when I noticed it doesn’t work in Chrome.
Further tests showed that none of the example html files from the master.zip appeared to work in Chrome. They run perfectly on threejs.org, but not when the downloaded copies are run locally. Does anyone have any advice on how to fix this?
I’m running Windows 10
Microsoft Edge is v 44.18362.449.0
Chrome is v 80.0.3987.106
When you say “running locally” what do you mean? Are you clicking the HTML files and opening them in the browser? Or using a local server? What errors do you see in Chrome’s JS console?
Resources like images cannot be opened by browsers from
file:// URLs. This is a browser security security requirement, not a library limitation. It’s necessary to run a local server of some kind, with several options listed at https://threejs.org/docs/#manual/en/introduction/How-to-run-things-locally.
i needle to create a localhost server
you can use the following
or any other
Thank you both for the responses. I did not realize a server was necessary. Not sure why it worked in Edge without any issues. I’d never used the browser before.
RyanBuck wrote: I did not realize a server was necessary.
Not necessary. but it is the best choice.
RyanBuck wrote: Not sure why it worked in Edge.
It shouldn’t, most likely will be removed in future releases.
RyanBuck wrote: Further tests showed that none of the example html files from the master.zip appeared to work in Chrome. They run perfectly on threejs.org, but not when the downloaded copies are run locally. Does anyone have any advice on how to fix this?
You need an older version of 3JS before she went modular ( 103 ).
For Chrome 80:
Create a shortcut to chrome.exe and rename it.
Right click shortcut, click on “Properties”, select “Target” ( highlighted ).
Append " --allow-file-access-from-files" without quotes to “Target”,
Click on “Apply” then “OK”.
The “Target” on my machine is:
“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” --allow-file-access-from-files
Close all instances of Chrome or this will fail.
Double check with taskmgr.exe, “Applications” & “Processes” tab MUST BE chrome free.
Now click on the modified shortcut and load your file.
As long as that window of chrome.exe is not closed, JS has access to ALL files accessible to Chrome.
For FireFox 72:
Goto about:config ( addressbar ) and click on “Accept the Risk and Continue” ( if is visible )
Enter “privacy.file_unique_origin” without quotes in search text box.
Change “privacy.file_unique_origin” from true to false.
Now JS has access to the working directory and sub.
PLEASE note, these methods may result in security vulnerability, depending on your discipline and browser habits.
Another words DO NOT open local html files downloaded from untrusted source with these settings.
In the run command,
C:\Program Files (x86)\Google\Chrome\Application\chrome.exe --allow-file-access-from-files
Is how I developed my project, but the module examples don’t run. for example:
///import * as THREE from ‘…/build/three.module.js’;
But other imports I cannot correct.
Why is it doing this, can anyone fix this?
Regardless any “Security” setting chosen.