Dropbox, D3.js, File, Folder, Public, Load, JSON, JSONP, CORS, Access-Control-Allow-Origin, Error
If you try to load a public JSON-file from Dropbox, you will probably get this error message:
XMLHttpRequest cannot load https://www.dropbox.com/s/123456789/data.json?dl=0. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access.
To load the file successfully, you have to change the end dl=0
to dl=1
and replace www.dropbox.com
with dl.dropboxusercontent.com
, so the URL should look like this: https://dl.dropboxusercontent.com/s/123456789/data.json?dl=1
.
Now you can call:
var dropbox_url = "https://dl.dropboxusercontent.com/s/123456789/data.json?dl=1";
d3.json(dropbox_url, function(error, data){
console.log("Successfully loaded file from Dropbox!");
console.log(data);
});
````
I didn't actually need this for D3.js, but it was really helpful, thanks a lot!