I'm having a problem loading MTL files on Chrome with Three.js. It works fine on Safari but I'm getting a cross origin request error in Chrome. I don't know how to fix this issue for local files. It does work fine if I publish this to an http website on Chrome.
var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath('assets/');
mtlLoader.setBaseUrl('assets/');
mtlLoader.load('file.mtl', function(materials) {
...
});
three.js:18280 XMLHttpRequest cannot load file:///.../assets/file.mtl. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
This isn't really a THREEjs question but i'll answer it here anyway:
This isn't really safe or permissible to allow a website to request files from the local file system.
What if the website requested an index of file:///C:/Users/Installation/Pictures/ on a windows system and then just started loading all of the contents to the server.
This is really unsafe because it could allow malicious agents to strip files from your computer just by you visiting. As a result, websites are only allowed to request files from outside the local file system.
You should use Mamp or the built in server emulation in Brackets. I use Mamp because it also makes it easy to test on mobile quickly and it is much faster than working with an FTP.
Related
How do you allow Google Chrome on a Chromebook to access a local file?
For eg: $.get('filename') fails when executing a local file.
I'm getting this error message in my console.
XMLHttpRequest cannot load file:///. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
Updated:
I want to develop a website using my Chromebook which will read files stored with in the project. The file that it reads from is stored locally only for testing purposes only.
When the website is hosted online (for eg using github pages), both the code for the website and the data that it reads from will be hosted online(for eg on github). I hope that helps you understand my question.
My site is running on SSL. On one of the pages I am calling an external javascript required for integration of Birt iHub into our application. The iHub application is running separately on of o our servers and javascript also resided in same application. Now when I try to acces the javascript without SSL it is blocked as my site is running on SSL. So I also put the iHub app on SSL so tha my website communcate with javascript over SSL. Now it works fine for both Chrome, Firefox and IE but in case of Safari it worked for few days then suddely an SSL error shows up. I have delete the SSL certificates from cache and the access the site again and IT worked again but afeter some days same issue occurs. AndI have to delte it again to make it work.
Can anyone tell me whay this is happening and what could be done to avoid this
Team,
I am working on Angular JS application. When I want to test the app, I used to just launch the application directly into the browser from file system. The url would be like
file:///Users/easwar/AngularApp/index.html
When I need to launch the app in Chrome, I need to open the browser from terminal using the below command
open -a Google\ Chrome --args --disable-web-security -–allow-file-access-from-files
to avoid the below error.
"XMLHttpRequest cannot load , Cross origin requests are
only supported for protocol schemes: http, data, chrome,
chrome-extension, https, chrome-extension-resource."
But surprisingly in Safari the app works fine without doing anything like this.
I would like to find what is the difference between these browser behaviors? Why its working in Safari and its not working in Chrome without a tweak?
In short: google chrome doesn't like local cross calls.
More found here: Cross origin requests are only supported for HTTP but it's not cross-domain .
It's Googles privacy and security policy: they try to avoid as much risks as possible, and local file calling seems to be one of them.
Read more on cross origin requests and how they're handled in Google Chrome here: https://developer.chrome.com/extensions/xhr
If you don't want to use those console commands, you might want to look for a webserver to host it (or a local webserver).
I'm having a really weird bug in my HTML5 script. I wrote a sharepoint app completely in OData which uses a few HTML 5 webworker to do the number crunching in the background. This works perfect on all major browsers (FF, IE10+ Chrome, ...). However, when I perform a refresh or browse to the page again. The script still works as intended on FF and Chrome, but hangs on IE.
In my network view I see a request for the Worker.js file, but with a 304 NOT MODIFIED response. IE then just hangs there on that request with a status of (Pending). This issue only gets resolved when I clear my browser cache.
I correctly close all my threads with self.close().
Any idea what the issue could be? I'm not sure if it's a code issue, a browser issue or a server side issue but I can replicate the bug on Sharepoint online as well as on a local server. The whole project is JS only, so I can't modify headers as a workaround either.
UPDATE: I ran exactly the same code outside of a sharepoint environment, and it worked perfectly. Issue is Sharepoint related.
using a time based querystring parameter prevents caching showing http status 200 on each refresh. tested on latest chrome, ie, ff;
var opus = new Worker("worker.js?q=" + new Date().getTime().toString() );
to be honest this a long shot as i do not have sharepoint right now
SharePoint sends the header:
Content-Disposition: attachment; filename="xyz.js"
X-Download-Options: noopen
and the IE Web Worker Implantation then does not run this web worker. (Tested in IE11) In the IE Network Monitor the request still on pending, even the Response text is visible.
I know so fare two workarounds:
Place the web worker js in the layouts folder (needs a Farm Solution, with the downside of this)
Set the Browser File Handling for the Web application to Permissive (maybe your security is not amused)
I'm using THREE.js and I get this error in the developer console:
Cross-origin image load denied by Cross-Origin Resource Sharing policy.
when I open my script with Chrome.
The code looks like this:
var particle_system_material = new THREE.ParticleSystemMaterial({
color: 0xffffff,
map: THREE.ImageUtils.loadTexture("images/circle.png"),
});
So as you can guess, the:
map: THREE.ImageUtils.loadTexture("images/circle.png");
is the problem.
With Firefox it works very well.
I've read the tips in the following links :
Chrome, three.js: Cross-origin image load denied,
https://github.com/mrdoob/three.js/wiki/How-to-run-things-locally,
https://www.google.fr/search?q=Access-Control-Allow-Origin
I also realized the commands given:
Start Chrome executable with a command line flag:
chrome --allow-file-access-from-files
nothing works and I'm going crazy. It is just an image on my hard drive with HTML and JS files, no server, no "origin".
Are you running a local server, or are you just opening the html file?
Most likely, running a localhost server will fix this issue. Mamp / Wamp are super easy to use.
If that doesn't work, you can do something drastic like chrome --disable-web-security
Keep in mind that if you start chrome with the disable web security flag, you must first shut down all other instances of chrome in order for it to work as you expect.