javascript - Is there any way to load json from a subdomain? - Stack Overflow

admin管理员组

文章数量:1421256

I'd love to stash some .json files on a CDN a la static.mydomain. Truth be told, static.mydomain is a CNAME in front of an Amazon S3 bucket.

I understand this violates the JavaScript security model. Is there an advised workaround or design? I've seen server-side stuff suggested like a PHP script to suck down data via cURL or file_gets_contents(), but that's a pretty lame approach. Is there any way to load JSON from a foreign server without getting too hacky?

===

UPDATE: Here's the line of thought that led me to believe it's a crossdomain issue for subdomains.

When I visit a page (e.g. static.mydomain/json/file.json) in Chrome, it displays as it would plaintext. When I visit the page in Firefox, it tries to get me to save the .json as a download.

I see a peculiar result in Firebug: A 200 response with no response body.

I can't log the direct headers via browser; my Firefox HTTP header plugin doesn't log anything before the download is forced. However here are the headers when loaded via this jQuery snippit (worth noting, the alert below doesn't fire):

jQuery.get(".json",
   function(data){
     alert("Data: " + data);
   }
);

Response Headers

x-amz-id-2 wSVtjlvFj5ffOtg7ZbKqKw8PexqlzJic7+PxSk975/FcDUnshSV2CiUP2oPWR8yK
x-amz-request-id 8AD81565A783988D
Date Tue, 19 Oct 2010 00:07:22 GMT
Expires Sat, 17 Oct 2015 22:25:37 GMT
Last-Modified Mon, 18 Oct 2010 01:08:13 GMT
Etag "2f1c7adcc1a7b0fd8fc8ce1478e0bf81"
Content-Type application/json
Content-Length 85966
Server AmazonS3

Request Headers

Host static.mydomain
User-Agent Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
Accept application/json, text/javascript, */*; q=0.01
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive 115
Connection keep-alive
Referer .html
Origin 

Though the headers seem to me to be fine, there is no response body to either a get, post, or anything else I can throw at this via jQuery. I see the same result when setting the content type to application/json, text/javascript and text/plain.

Can anyone explain this behavior? I figure I must be doing something wrong on the S3 side, but could it be crossdomain issues in JavaScript or can I rule out cross-subdomain issues?

I'd love to stash some .json files on a CDN a la static.mydomain.. Truth be told, static.mydomain. is a CNAME in front of an Amazon S3 bucket.

I understand this violates the JavaScript security model. Is there an advised workaround or design? I've seen server-side stuff suggested like a PHP script to suck down data via cURL or file_gets_contents(), but that's a pretty lame approach. Is there any way to load JSON from a foreign server without getting too hacky?

===

UPDATE: Here's the line of thought that led me to believe it's a crossdomain issue for subdomains.

When I visit a page (e.g. static.mydomain./json/file.json) in Chrome, it displays as it would plaintext. When I visit the page in Firefox, it tries to get me to save the .json as a download.

I see a peculiar result in Firebug: A 200 response with no response body.

I can't log the direct headers via browser; my Firefox HTTP header plugin doesn't log anything before the download is forced. However here are the headers when loaded via this jQuery snippit (worth noting, the alert below doesn't fire):

jQuery.get("https://static.mydomain./json/file.json",
   function(data){
     alert("Data: " + data);
   }
);

Response Headers

x-amz-id-2 wSVtjlvFj5ffOtg7ZbKqKw8PexqlzJic7+PxSk975/FcDUnshSV2CiUP2oPWR8yK
x-amz-request-id 8AD81565A783988D
Date Tue, 19 Oct 2010 00:07:22 GMT
Expires Sat, 17 Oct 2015 22:25:37 GMT
Last-Modified Mon, 18 Oct 2010 01:08:13 GMT
Etag "2f1c7adcc1a7b0fd8fc8ce1478e0bf81"
Content-Type application/json
Content-Length 85966
Server AmazonS3

Request Headers

Host static.mydomain.
User-Agent Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
Accept application/json, text/javascript, */*; q=0.01
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive 115
Connection keep-alive
Referer http://mydomain./directory/referrer.html
Origin http://mydomain.

Though the headers seem to me to be fine, there is no response body to either a get, post, or anything else I can throw at this via jQuery. I see the same result when setting the content type to application/json, text/javascript and text/plain.

Can anyone explain this behavior? I figure I must be doing something wrong on the S3 side, but could it be crossdomain issues in JavaScript or can I rule out cross-subdomain issues?

• javascript
• jquery
• json

Share Improve this question Follow edited Oct 19, 2010 at 2:07 buley asked Oct 19, 2010 at 1:58 buleybuley 29.4k1818 gold badges8989 silver badges108108 bronze badges 6

• What domain does is your application served from? – Adam Byrtek Commented Oct 19, 2010 at 2:01
• I always thought subdomains were ok. The only thing that really matters is whatever.. Have you even tried it? – Gregg Commented Oct 19, 2010 at 2:06
• Ideally it would be served from either www.mydomain. or mydomain., and be able to pull static .json data from static.mydomain.. – buley Commented Oct 19, 2010 at 2:06
• Added more details as to the issue I've been seeing. – buley Commented Oct 19, 2010 at 2:08
• 1 JSONP could be a solution, basically you just include the script dynamically in a script tag, and the JSONP then calls a method with the JSON object as a argument. Usually however, this goes with dynamic calls and an argument in the URI (e.g. /myfile.json?callback=?). jQuery supports JSONP natively, maybe you can try to put the callback inside your JSON statically. – CharlesLeaf Commented Oct 19, 2010 at 2:13

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 3

Use jQuery.getJSON instead of .get. .get uses an XHR, which is not friendly across domains (even subdomains). getJSON uses a JSONP request which will work.

http://api.jquery./jQuery.getJSON/

You'll need to modify the JSON data for a JSONP response though. It takes a parameter that defines a callback. jQuery creates a random function to serve as the callback, so if your whole point is to use this as a CDN, you don't be able to dynamically change the callback name in the response.

You can use a static callback by passing the right parameters to jQuery.ajax: http://api.jquery./jQuery.ajax/

dataType: 'json' //(.getJSON is just a shorthand for .ajax with this paraeter set)
jsonpCallback: 'myStaticCallbackName' // Lets the client know what callback to expect from the server.

Then your response should look like:

myStaticCallbackName({"foo": "bar"});

You can either use JSONP or use an absolute path to the subdomain (this assumes the subdomain is on the same server, which it must be). That is, instead of https: blah blah, you would use /home/path_to_subdomain/ etc. and it should work.

JSONP is a good solution too, but it may be overkill if you can just provide an absolute path the subdomain.

本文标签： javascriptIs there any way to load json from a subdomainStack Overflow