A lot of APIs will give you responses in JSON format. Here we'll review JSON parsing in JavaScript so that you can get to the interesting data faster.
This tutorial assumes that you've already gone through our JavaScript getting started tutorial and are familiar with how our JavaScript SDK works. Although we use the output from our YouTube ListSearchResults Choreo in this tutorial, the same steps we outline here will work for parsing any JSON in JavaScript.
1Log in to Temboo and go to the YouTube > Search > ListSearchResults Choreo in our Library. Select JavaScript from the drop down menu at the top of the page.
2Enter any search term you want for the Query input and click click Generate Code to test the Choreo from our website.
3You get a whole bunch of JSON in the Response output. These are the results of the search. Next we'll see how to parse through this response in JavaScript and pick out only the pieces we're interested in.
4Create a new .html file and copy in the generated JavaScript Code.
5Next, create a new file in your chosen server language and copy in the generated Proxy Code Save this file as proxy-server or proxy-server.php if you're using PHP.
6Back in your .html file, replace the showResult function with the version below. Steps 7 and 8 walk you through what happens in the code.
// Success callback
var showResult = function(outputs, outputFilters) {
// Parse JSON response
var results = JSON.parse(outputs.Response);
// Get items array
var items = results.items;
// Get first item
var item = items[0];
// Get the snippet object within the first item
var snippet = item.snippet;
// Get the title and description fields
var title = snippet.title;
var description = snippet.description;
// Print title and description
console.log(title);
console.log(description);
};
7First, we convert the JSON text from the response to a JavaScript object using JSON.parse().
8Next, we parse out the piece of data we want from the JSON. It helps to look at the JSON file's structure to get an idea of how it is organized. The two main elements you should look for are:
| PHP type | How it appears in the JSON file |
|---|---|
| Array | "name": [ |
| Object | "name": { |
For these results, we want the title of the first video in the search results. We get the items array, then the first item in that array (at index 0). Then we want the snippet object within the first item in the array. To finish up, we get the title property from the snippet object.
We could also traverse the parsed JSON structure more compactly with:
var snippet = results.items[0].snippet;
9Now, place your files on your web server and make sure that it's running.
10Open your .html file in your browser. You should see the title of your first YouTube Search result in the console.
Now you should be to able to parse all sorts of JSON responses with our JavaScript SDK. Check out the 2000+ Choreos in our Library and find some exciting data to parse.
Once you've got your code up and running, you're ready to move on and do more. From monitoring your running applications, to moving your generated Temboo code to your preferred development environment and sharing it with colleagues, collaborators and friends - we've got you covered.
We're always happy to help. Just email us at support@temboo.com, and we'll answer your questions.
Like what we do? Take a look at our open positions.