2

I want to use the google images api. In the past when I worked with json I simply used the ajax function to get the json from my own server. But now I will be getting it from an external domain:

https://ajax.googleapis.com/ajax/services/search/images?q=fuzzy monkey&v=1.0 

Obviously I can't load this using js since its not from an internal url. So in these cases how does one work with json data. Are you supposed to load it via CURL using a server side script or is there another way?

1
  • I'm certain this is a duplicate... Commented Sep 4, 2011 at 4:34

2 Answers 2

3

You can make use of JSONP by adding a callback GET param.

https://ajax.googleapis.com/ajax/services/search/images?q=fuzzy%20monkey&v=1.0&callback=hello

Then you can request it with jQuery's $.getJSON().

$.getJSON('https://ajax.googleapis.com/ajax/services/search/images?q=fuzzy%20monkey&v=1.0&callback=?', function(response) { console.log(response.responseData); }); 

jsFiddle.

Sign up to request clarification or add additional context in comments.

Comments

1

You must use Cross Origin Resource Sharing (CORS http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing)

It's not as complicated as it sounds...simply set your request headers appropriately...in Python it would look like:

 self.response.headers.add_header('Access-Control-Allow-Origin', '*'); self.response.headers.add_header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS'); self.response.headers.add_header('Access-Control-Allow-Headers', 'X-Requested-With'); self.response.headers.add_header('Access-Control-Max-Age', '86400'); 

1 Comment

You should mention that these headers must be set on the server side

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.