Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
We need to define a strategy for how we're going to access the data - what kind of networking code are we going to write and how are we going to interact with the Giphy API. In this video, let's lay out those steps.
-
0:00
[MUSIC]
-
0:04
We've got our collection view looking like, well, a collection view.
-
0:08
But right now, it's only displaying that one photo loaded right into the bundle.
-
0:13
Now this isn't gonna impress anyone, and technically speaking, it's kinda lame.
-
0:18
Why don't we connect our lonely little app to the Internet?
-
0:21
I hear it's all the rage.
-
0:23
So to get our hands on the GIFs from the GIPHY API,
-
0:27
we're going to employ a few tools, NSURLSession, and the GIPHY API.
-
0:33
That might seem intimidating, but we'll go step by step.
-
0:37
We'll use NSURLSession for the network request and
-
0:41
GIPHY's API to retrieve our GIFs, and Meta Data.
-
0:45
Let's start with the first step where we'll make an asynchronous
-
0:49
network request using NSURLSession.
-
0:53
Now, it's important to highlight that this will be asynchronous request.
-
0:58
Since we wouldn't want our app just sitting around there and
-
1:01
waiting because the GIPHY's API decided to check out instead of check in.
-
1:05
Imagine, if you will, that our app is a long multi-lane highway.
-
1:10
Yes, just like that.
-
1:12
Well, our app is capable of executing many tasks at once.
-
1:16
And these tasks are organized into queues each represented by a lane of traffic.
-
1:23
Our main queue, right here in the middle,
-
1:25
is the only place where we can update the user interface.
-
1:30
You can do other things there as well, but you need to be mindful of the risks.
-
1:35
Let's say our app is humming along and a user taps a button to refresh the data.
-
1:40
That kicks off a Network Request and our faithful friend the UIActivityIndicator.
-
1:46
So if our Network Request decides to respond slowly or
-
1:50
stop all together, everything behind it will start to backup.
-
1:55
The spinning gear will keep spinning.
-
1:57
The other buttons in the app won't be responsive.
-
2:00
And all the other drivers stuck behind the truck will start to get road rage-y.
-
2:06
Luckily, there's a very simple solution to all of this.
-
2:09
We instead, place our Network Request on a different queue,
-
2:14
where it can handle its business asynchronously.
-
2:17
That way, if it is slow, it won't gum up the works.
-
2:21
When it's done, which could be just a fraction of a second if we're lucky,
-
2:26
we get our data and we can then display it using the main queue.
-
2:32
So that's the theory behind why asynchronized network calls are so useful.
-
2:37
But how does NSURLSession in particular helps us get the job done?
-
2:42
Well, first of all NSURLSession is a class.
-
2:46
But when developers say NSURLSession,
-
2:49
they are often referring to a whole group of related classes.
-
2:53
You'll use NSURLSession, the class, to create an NSURLSession task.
-
2:59
You can actually choose from three types of tasks,
-
3:02
all subclasses of NSURLSession task.
-
3:05
And those choices are NSURLSession data task,
-
3:09
NSURLSession download task, and NSURLSession stream task.
-
3:14
We'll use a download task in our app.
-
3:18
A task will make an NSURL request,
-
3:20
which will contain all the information we need to make a request.
-
3:24
When the request completes, we'll get NSURL response.
-
3:29
So let's take the theory and jargon that we just rattled off and
-
3:32
see how it looks in our app.
-
3:34
Now, we could put all our networking code in viewDidLoad, even just temporarily.
-
3:41
But I know we're going to want to move it into it's own method eventually.
-
3:46
So let's do just that right now.
-
3:49
And how do I know we'll want it in its own methods?
-
3:53
Well, for two reasons.
-
3:54
You don't want to clutter up viewDidLoads with unrelated code.
-
3:58
And the act of downloading our data isn't just going to happen when we load the app,
-
4:03
right?
-
4:03
It will happen whenever we refresh the GIFs or the images.
-
4:08
Now with that in mind, we'll create a method called refreshImages.
-
4:20
And we will call that method from our viewDidLoad.
-
4:28
Okay, let's add some meat to our method here.
-
4:33
First, we'll create a session which we'll call, well, session.
-
4:39
So we'll do NSURLSession,
-
4:44
Session is equal to [NSURL Session sharedSession].
-
4:51
Next, we'll create our download task.
-
4:55
So let's go over to our documentation.
-
4:59
So we'll option click on NSURLSession.
-
5:04
And as you can see here, that it talks about the class and
-
5:09
how it provides an API for downloading content.
-
5:13
And if we scroll down,
-
5:14
you will see that it talks about there are different types of tasks.
-
5:19
There are data tasks, upload tasks, download tasks.
-
5:23
So what we want to do is use our download task.
-
5:28
So we'll use NSURLSessionDownloadTask.
-
5:34
And we'll create this task.
-
5:39
I'll say session downloadTaskWithURL,
-
5:44
and a completion handler.
-
5:47
So we need to provide it with a URL, which we will in a second, and
-
5:51
that's our completion handler.
-
5:56
So within our completion handler, we'll add an NSLog.
-
6:02
And we'll come back to the NSLog and we can just print out the response.
-
6:06
We'll say response.
-
6:14
All right, so we have an error that we haven't specified a URL, so
-
6:19
let's go ahead and do just that.
-
6:21
So we'll create and NSURL,
-
6:26
URL= [NSURL URLWithString.
-
6:35
So, of course, we need to provide a URL which we don't have yet.
-
6:39
So let's look at the GIPHY API.
-
6:43
You can go to api.giphy.com, and it has this great
-
6:48
landing page with this beautiful GIF right here.
-
6:52
And there's Search, there's Trending, which is exactly what we're going to use.
-
6:58
Apparently, they have GIPHY Translate, Roulette, Stickers and so
-
7:03
many other things.
-
7:04
So it says down here with this blue button, get started with the GIPHY API.
-
7:09
And if you click on it, it takes you to their GitHub page.
-
7:15
Once, again, they have that beautiful GIF and some documentation.
-
7:19
The first thing you'll notice that they talk about is their Public Beta API Key.
-
7:24
They say that the Giphy API is open to the public, and we have instituted a simple,
-
7:29
single public beta key system to let anyone try it out.
-
7:33
So this is great.
-
7:34
So you don't have to register, and get a API key for your specific app,
-
7:39
only if you're using it for commercial purposes.
-
7:43
So if you do build an app that uses a Giphy API and it's a commercial app,
-
7:48
then you should apply for a production key, using this URL right here.
-
7:55
All right, so overview, these are the end points that it provides.
-
7:59
We're going to use the trending endpoint.
-
8:01
So I'm going to click on that.
-
8:04
And simply, we have to copy and paste this URL.
-
8:08
Now, one thing that you want to make sure,
-
8:11
at least in my case, I wanna make sure that the results are pg.
-
8:17
You have these different ratings.
-
8:19
This is young, we have pg, pg-13, r.
-
8:24
I don't want any rated r images because this is a family friendly course.
-
8:29
So I'm going to add a rating parameter to my URL.
-
8:35
We'll say rating = pg,
-
8:39
pg stands for parental guidance.
-
8:44
All right, so now we have a URL.
-
8:49
All right, so now Xcode has stopped complaining about compiler errors.
-
8:55
But we still have this unused variable.
-
8:58
You can see that there's a compiler warning that says, unused variable task.
-
9:04
So why have we gone to all this trouble and not even used this task object?
-
9:10
Well, we can do that with one simple line.
-
9:13
We'll do [task resume], and
-
9:16
that basically executes this task.
-
9:21
So now we can go ahead and run our app, Uh-oh,
-
9:25
looks like we've got an ATS, an app transport security issue.
-
9:31
If you don't know what an ATS is, you should probably spend at least a couple of
-
9:34
minutes perusing the links below in the teacher's notes.
-
9:38
So according to this message,
-
9:42
what says HTTP resource load is insecure.
-
9:47
So we can add an exception or we can change our URL.
-
9:53
So we're not using a secure URL.
-
9:57
You'll notice that this is simply HTTP and not HTTPS.
-
10:01
HTTPS uses SSL, which provides encryption when you're sending and receiving data.
-
10:10
So all we need to do is add an s here.
-
10:13
Of course,
-
10:14
you need to make sure that the API that you're accessing has a secure access.
-
10:19
Most websites and APIs do have https protocol for communicating with them.
-
10:27
But you should probably just check with the vendor of API.
-
10:31
All right, so let's go to run our app once again.
-
10:34
And hopefully, this time it works and we don't get an ATS error.
-
10:39
All right, there you go.
-
10:41
We got an output, so this is our response.
-
10:46
It isn't exactly Greek, but it's not exactly a summer beach read.
-
10:50
So what does this say?
-
10:55
Well, this is the response that's talking about, you get http status code.
-
11:00
So it's saying this response was successful.
-
11:03
And it's just giving us some more meta data about our request that we
-
11:08
sent to the server.
-
11:09
So our response does contain content.
-
11:13
So let's try to print out that string.
-
11:22
So what we'll do is, we'll do an NSString responseText,
-
11:30
= [NSString
-
11:32
alloc] initWithContentsOfURL:Location,
-
11:42
encoding:NSUTF8StringEncoding, and
-
11:50
error will be nil.
-
11:55
So where did I get this location from?
-
11:57
Well, our completion handler contains this parameter called location
-
12:04
which is where the file is stored or the response is being stored.
-
12:09
And the encoding, it's pretty much a standard encoding option and
-
12:15
the error will be nil.
-
12:17
So let's go and print out this response text.
-
12:21
Testing this response, I'll say responseText.
-
12:25
And so now, we see a JSON response.
-
12:28
This isn't exactly Greek, but we see a bunch of URLs.
-
12:34
And these are probably URLs for all the trending GIFs on the GIPHY website.
-
12:41
So next, we will see how we can make sense of this response text and
-
12:45
create structured data from it.
You need to sign up for Treehouse in order to download course files.
Sign up