- Making a Remote Request to the Google API
- Creating a Google API JavaScript Object
- Searching the Google News Search Service Using Ajax
- Parsing the JSON News Result Set
- Rendering the Results as HTML
- Additional Resources
Searching the Google News Search Service Using Ajax
We first need to ensure that the web page has fully loaded so that all the HTML elements and assets are also fully loaded before trying to access them programmatically. In order to do this, we can simply use the window.onload function to activate the news search when the page has fully loaded. The function that initializes the search will be called GoogleAPI.SearchNews. This function also sets a callback method to retrieve the JSON result set and makes the search request to the Google News Search API through our gateway.php file. In this example, the callback for the search is GoogleAPI.onNewsSearched. The gateway path will be the path of the gateway.php file with a feed argument that points to the Google News Search.
The Google search service has a number of arguments from which you can choose; the required arguments are listed in Table 1, while Table 2 lists the optional arguments.
Table 1Required Arguments for the Google Ajax Search API
Argument |
Definition |
Description |
---|---|---|
v |
Version |
The only value available at this point is 1.0 |
q |
Query |
The search term you’re performing on the API |
Table 2Optional Arguments for the Google Ajax Search API
Argument |
Definition |
Description |
---|---|---|
userip |
User IP |
Optional, but recommended by Google |
rsz |
Number of results |
Can have a value of small or large. small retrieves four results, and large retrieves eight results. |
hl |
Host language |
Corresponds to the host language. |
key |
Application key |
If this argument is supplied, it must match the passed referrer header in order to be validated. The referrer header is what we are passing in gateway.php. |
start |
|
A powerful argument that allows you to retrieve pages of resultsfor example, the default is 0; therefore, if you request a small result set, you’ll receive news results 0-4. However, if you want to retrieve additional news results, you can change the start to 4, which will retrieve news results 4-8. This allows us to gather random news results, create controls to navigate through pages of news results, and so on. |
callback |
|
Allows you to alter the response format and trigger a function call. |
context |
|
When supplied with the callback argument, the context alters the response format normally associated with the callback. |
The optional news search specific arguments that can be used to filter results (Table 3).
Table 3Google News Search Specific Arguments
Argument |
Description |
---|---|
scoring |
Order search results by relevance or date. |
geo |
An optional argument that can be used to get news results from a specific location. |
qsid |
An optional argument that can be used to filter results to quote type results, instead of typical news type results. |
topic |
An optional argument that can be used to filter results to a particular topic. The value can be any of the following options: h - Top headlines w - World news b - Business news n - Nation news t - Science and technology news el - Elections news p - Politics news e - Entertainment news s - Sports news m - Health news |
ned |
An optional argument that can be used to pull results from a specific edition. Editions are related to countries and can be defined as us, uk, fr_ca, etc. |
In this example, we are using rsz=small to retrieve four results, and as the start argument we’re also using the GoogleAPI.Index property to determine from what record to receive the search results. The GoogleAPI.Index property will later be used to increase the starting point for the search in order to page through results. The required argumentsv=1.0 and q, which is currently set to “Peachpit”are also included. The search query or q property can be changed to any value using the GoogleAPI.Query variable in the window.onload event where we are initiating all of the object properties.
With the gateway URL constructed, we can make our Ajax request to the Google Search API through a reusable method called GoogleAPI.makeRequest. This method creates the request object as a property of GoogleAPI, sets the onreadystatechange callback method, opens the request to the gateway URL we are passing as the argument, and finally sends the request. Once the request has been made, the onreadystatechange callback method is triggered through each stage of the readyState. Once it reaches 4, the response is fully loaded and the callback method we set in GoogleAPI.onNewsSearched is triggered.