WEBVTT 0 00:00.270 --> 00:07.860 Now in the last lesson, we saw how we could work with the kanye.rest API and the joke API to start querying 1 00:07.920 --> 00:12.330 these external web sites for pieces of data that they may have. 2 00:12.330 --> 00:18.810 We saw how we could use paths as well as parameters to narrow down on the exact type of data that we 3 00:18.810 --> 00:19.600 want. 4 00:19.740 --> 00:28.070 And we saw how we can make these requests using a formatted URL and putting it through our browser. 5 00:28.170 --> 00:36.000 Now both of those web sites had very simple pieces of data, either a database of jokes or a database of 6 00:36.000 --> 00:37.950 Kanye West quotes. 7 00:37.950 --> 00:45.990 Now when we come to data that's more monetizable, or allows developers to build more complex applications 8 00:46.290 --> 00:49.990 that might be used by hundreds or thousands of users, 9 00:50.230 --> 00:58.050 then these web sites have to start thinking very carefully about how to either monetize your use of 10 00:58.050 --> 01:03.780 their data or how to limit your use to a threshold. 11 01:04.080 --> 01:08.700 And the way that they would do that is through authentication. 12 01:08.700 --> 01:16.530 So every time you make a request through the API, they have to be able to identify you as the developer, 13 01:17.100 --> 01:24.630 and they have to keep track of how often you're using their server to get data, and then charge you, or 14 01:24.630 --> 01:30.290 limit you, accordingly. In order to illustrate this concept of authentication, 15 01:30.300 --> 01:32.490 we’re going to use the openweathermap. 16 01:32.550 --> 01:34.860 org’s API. 17 01:34.860 --> 01:42.000 And if you take a look in their pricing, they tell you that it's free to use their API as long as you 18 01:42.000 --> 01:50.670 don't make more than sixty requests per minute. So every single time we typed in this particular request 19 01:51.000 --> 01:53.970 to an API and we hit enter, 20 01:53.970 --> 02:00.420 that’s a single request. And if you make more than 60 a minute, so more than one a second, then they're 21 02:00.420 --> 02:04.100 going to limit any further requests. 22 02:04.140 --> 02:10.940 So for most developers to get started building your app or your web site, this is more than enough. 23 02:11.370 --> 02:17.130 But as you start getting more users, you have more traffic, and you're probably likely to have more revenue, 24 02:17.550 --> 02:23.540 then these data providers will also start charging you to use their data. 25 02:23.880 --> 02:30.440 But the way that we would implement authentication in any of these categories is exactly the same. 26 02:30.480 --> 02:35.160 So let's see how we can use an authenticated API like this one. 27 02:35.160 --> 02:39.630 So the first thing to do is to go ahead and sign up to the OpenWeatherMap, 28 02:39.630 --> 02:41.070 if you haven't already. 29 02:41.070 --> 02:42.890 So you're going to create a new account. 30 02:42.960 --> 02:49.690 And don't worry it doesn't require any credit card details or anything other than a user name and email. 31 02:49.690 --> 02:54.300 Now once you've signed up then go ahead and sign into your account. 32 02:54.720 --> 02:58.730 And once you're signed in you should see a page that looks like this. 33 02:58.830 --> 03:05.040 And up here there are a whole bunch of tabs and you want to tab over to the API key section. 34 03:05.130 --> 03:08.410 Now here you can create a new key 35 03:08.580 --> 03:15.570 if you don't see a default one here. Once you've created a key, then you're just simply going to copy 36 03:15.930 --> 03:22.930 this entire string, and you're going to be using it when you make any requests to the API. 37 03:23.040 --> 03:27.220 So let's see how we can make a request to this weather API. 38 03:27.360 --> 03:32.160 Let's take a look at the API docs for getting the current weather data. 39 03:32.160 --> 03:36.840 Now if you read through this documentation, you'll see that there's a whole bunch of ways that you can 40 03:36.840 --> 03:45.630 get weather data, either querying by city name, or by a city ID, or by the geographic latitude and longitude 41 03:45.630 --> 03:47.790 values, and a whole lot more. 42 03:48.390 --> 03:53.570 Now let's say that I want to use the simplest, which is to query by a city name. 43 03:53.760 --> 04:01.590 Then you can see, if we click on the example API call, that they've got some sort of end point that ends 44 04:01.590 --> 04:05.310 here, and then begin the parameters, 45 04:05.310 --> 04:05.800 right, 46 04:05.850 --> 04:09.010 because we said the parameters start with a question mark. 47 04:09.050 --> 04:14.490 So the first parameter has a key of q, which probably stands for query, I would guess, 48 04:14.490 --> 04:22.110 and then the name of the city, and then the next parameter is the app ID, which corresponds to the API 49 04:22.110 --> 04:23.580 key that we've got just now 50 04:23.580 --> 04:24.850 when we signed up. 51 04:24.960 --> 04:30.950 So this, overall, is the structure of this sample API call. 52 04:30.960 --> 04:37.190 Now the reason why it’s a sample is because here they provided you a demo API key. 53 04:37.290 --> 04:44.730 Now in order to make an actual API call, we have to look at that actual endpoint, and it actually looks 54 04:44.850 --> 04:49.440 more like this. Instead of samples.openweathermap, 55 04:49.530 --> 04:52.040 it’s actually api.openweathermap. 56 04:52.620 --> 04:59.830 So if I change this from samples to api, then you'll see that this won't work 57 05:00.160 --> 05:07.390 with the app ID that they provided by default, and we get the error message “Invalid API Key”. 58 05:08.140 --> 05:14.440 Now remember that earlier on we already signed up and we actually got our very own app ID, and you 59 05:14.440 --> 05:15.470 should have done this as well. 60 05:15.860 --> 05:20.950 Well in that case, if you simply paste that app ID here, after the equals sign, 61 05:20.950 --> 05:24.190 so this is the key value pair here, 62 05:24.220 --> 05:28.150 then we go ahead and make our request by hitting enter, 63 05:28.210 --> 05:35.480 you can see we get our data back. And this is the actual data for the current weather in London. 64 05:35.740 --> 05:40.380 And as you can see, as usual, there's a few clouds in the sky. 65 05:40.420 --> 05:47.020 This is the default weather for London pretty much, but it's not too bad. 66 05:47.020 --> 05:52.090 You can try changing this q to a different city. 67 05:52.090 --> 05:59.380 Let's check what the weather is like in Paris. And we get some temperatures back, and we get some wind 68 05:59.380 --> 06:00.370 speeds. 69 06:00.550 --> 06:07.530 We get humidity and atmospheric pressure. But you might notice that the temperature is kind of weird, right? 70 06:07.540 --> 06:09.610 It seems like Paris is burning. 71 06:09.610 --> 06:12.130 283 degrees. 72 06:12.130 --> 06:15.640 Even if that's Fahrenheit, that's still too high. 73 06:15.640 --> 06:23.130 What's going on here? Their default unit for temperature for OpenWeatherMap is actually Kelvins. 74 06:23.410 --> 06:32.560 And in order to get either imperial, so Fahrenheit, or metric, Celsius, we have to add another parameter. 75 06:33.320 --> 06:37.090 So depending on whether if your brain works in metric or imperial, 76 06:37.270 --> 06:45.070 go ahead and try to add these parameters to our API request, so that you get back the temperature in 77 06:45.070 --> 06:49.120 a format that you understand. Pause the video, and give that a go. 78 06:52.380 --> 07:00.480 All right. So we know that the first parameter gets added after a question mark, and it has to be added 79 07:00.540 --> 07:10.410 in a key value pair separated by an equals sign, but every subsequent parameter gets added after an ampersand. 80 07:10.410 --> 07:15.300 So if we want to add another parameter here, we're also going to add an ampersand, 81 07:15.300 --> 07:22.050 and then the name or the key of the parameter is called units, and then the value could be imperial or 82 07:22.050 --> 07:23.160 metric. 83 07:23.160 --> 07:29.890 So I'm going to add ‘units=metric’ because I want the results back in Celsius. 84 07:30.000 --> 07:33.850 And you can see that Paris is currently 10.3 degrees. 85 07:33.870 --> 07:37.170 That sounds a lot more reasonable. 86 07:37.260 --> 07:41.670 Now remember that the order at which you put these parameters doesn't matter. 87 07:41.700 --> 07:52.320 So, for example, I could have the query first, which is Paris, and then have my units, which is metric, and 88 07:52.320 --> 07:54.950 finally have my app ID like this, and 89 07:55.080 --> 07:56.890 I still get the same results. 90 07:56.910 --> 07:59.010 The order doesn't matter at all, 91 07:59.130 --> 08:04.410 as long as they're separated by these ampersands, or, if it's right at the beginning, the question mark. 92 08:05.390 --> 08:12.860 Now notice how, as we start using more parameters, and especially when we have parameters with very long 93 08:12.860 --> 08:21.490 values like this, it gets very difficult to test our APIs using a browser, and editing these 94 08:21.490 --> 08:21.950 URLs. 95 08:21.980 --> 08:28.520 It's very very fiddly, and you can often make very simple typos, because it's hard to see where each parameter 96 08:28.550 --> 08:31.210 ends and the next one begins. 97 08:31.250 --> 08:37.520 So very often, when we're testing APIs, we'll use a tool called Postman. 98 08:37.550 --> 08:43.340 It's completely free to download, and it's available for Mac, Windows and Linux. 99 08:43.340 --> 08:48.980 So I recommend heading over to postman.com/downloads, and download the version that's right 100 08:48.980 --> 08:50.690 for your computer. 101 08:50.990 --> 08:56.090 Now once you've done that, you'll end up with an application that looks something like this. 102 08:56.210 --> 09:00.230 So let's see how we can make that same request using Postman. 103 09:00.650 --> 09:06.650 So I'm going to click on this plus sign to make a new request, and it's going to be a get request. 104 09:06.650 --> 09:12.200 I'm going to try and get some data from our OpenWeatherMap. And I'm basically going to try and do the 105 09:12.200 --> 09:13.610 same thing as before, 106 09:13.700 --> 09:21.080 so I'm going to use the API end point, which goes up to the first question mark, and I'm going to paste 107 09:21.080 --> 09:25.970 that in the URL, and then I get to add all my parameters. 108 09:25.970 --> 09:33.050 So the first parameter is q, because that's the parameter to query by city name. 109 09:33.050 --> 09:42.260 Now if you wanted to query by latitude, longitude, or by a zip code, then you can use these different parameters. 110 09:42.380 --> 09:45.600 But in my case I'm just going to stick with the simplest. 111 09:45.710 --> 09:51.040 So I'm going to put the key as q and the value as London. 112 09:51.050 --> 09:57.740 Notice how at the top here, it's starting to structure my URL for me, while I get to work with this much 113 09:57.770 --> 10:05.720 clearer user interface, which has a table, and has like a checkbox for me to add or remove, and it saves 114 10:05.720 --> 10:08.830 this data if I want to use it later on, etc.. 115 10:08.900 --> 10:16.250 So let's add the next piece of data, which is our API key. And remember that the API key’s parameter 116 10:16.370 --> 10:18.010 is called appid. 117 10:18.230 --> 10:24.470 So let's add the app ID and paste in the API key, and it's going to again add that to my parameter 118 10:24.470 --> 10:25.370 list. 119 10:25.370 --> 10:29.750 And the final thing I'm going to do is I'm going to change the units to metric. 120 10:29.750 --> 10:37.700 Now I'm going to click ‘Send’ to send this request to OpenWeatherMap, and I get back my data. 121 10:37.700 --> 10:44.080 Now notice how this data here is structured in a much better way, 122 10:44.210 --> 10:52.100 and the reason is because we are pretty printing the results, instead of, well, ugly printing the results. 123 10:52.470 --> 11:00.110 What's happening here is, when we make our request to the OpenWeatherMap servers, the data that we get 124 11:00.110 --> 11:04.760 back is in something called a JSON format. 125 11:04.760 --> 11:07.820 And what exactly is a JSON format? 126 11:08.240 --> 11:11.240 Well, you get to find that out in the next lesson. 127 11:11.360 --> 11:18.290 So make sure that you've signed up for a account on OpenWeatherMap, and you've had practice using Postman 128 11:18.380 --> 11:23.930 as well as using your browser to authenticate yourself with the OpenWeatherMap API, and you’re getting 129 11:23.930 --> 11:26.270 the data back in a JSON format. 130 11:26.420 --> 11:32.480 Once you've done that, head over to the next lesson, and we'll find out more about the format of the data 131 11:32.510 --> 11:33.320 that we get back.