It's nice when things go right when someone searches for a location and we're able to find a match or
when someone asks for the weather very set of coordinates and we're able to get and display the forecast
now.
We always hope that things go right but that's not always the case.
There are plenty of things that could go wrong with our HDTV requests and in this video we're going
to focus on handling those potential errors giving the user a better experience when things don't go
as expected.
Together we'll set up error handling for the weather API request.
Then as your challenge for the video you'll be setting up error handling for our geo coding request.
For the moment I'm going to comment out all of the geo coding related information down below.
By using Command Forward slash which would be control forward slash on windows.
When I have all of those lines selected and we're going to focus on what we have up above just the weather
request now.
One really obvious way things can go wrong when making an HDTV network request is if there is no network
available.
If you're not connected to the Internet.
This is indeed going to fail.
Let's go ahead and see this in action up above.
I'm going to temporarily turn off my Wi-Fi and we're going to do is run our script.
So from the terminal node space app dot J s when I do this what do I get.
I get a really long error message and the actual error says cannot read property body of undefined.
So in this case when things go wrong and there is no network request the error argument contains a value
and response does not.
So we have to go ahead and add a little bit of conditional logic making sure we're checking that there
is no error before we try to interact with the response.
Right now it's trying to read body of undefined right here.
Response is indeed undefined and that's what's causing the problem.
Now once again we can't fix the lack of network connectivity.
That's not the job of error handling in our case.
The goal is to do something a bit better than this.
Tell them in a regular human readable way that they currently don't have access to the weather API so
to get that done we're going to add an if statement right inside of our function before we do.
Let's go ahead and just console dialogue.
The error argument to the console so we can see exactly what we're dealing with and I'm going to comment
out the line down below which is currently causing the program to crash.
Now I will clear the terminal out but rerun the command and what do we end up getting.
We end up getting an error message now.
What's inside of here is not as bad as what we had before but it still doesn't contain information that
would be useful to someone unless they really knew a good deal about programming.
So what we're going to do is just check for the existence of that error object right here.
The if statement if there is an error we're gonna do one thing.
Otherwise inside of the else statement we'll do something else.
Now if there is an error we're going to go ahead and print a statement using console dot log something
that a person would actually understand.
Let's try unable to connect to whether service.
Excellent.
Now that we have that message showing up we can fill out the else part of the if statement in this case.
We want to print our forecast exactly like we were already doing so on comment out that line down below.
And then going to take the entire thing cut it out of its current location remove the extra lines and
paste it right here inside of.
Else so if error print an error message.
Otherwise print that forecast.
Now let's go ahead and try things out again from the terminal down below.
I'm going to rerun the program and what do I get.
Unable to connect to weather service showing up which is a great step in the right direction.
Now that we have this in place let's go ahead and make sure that our app still works when the network
request.
Excuse me when the network connectivity is re enabled.
So right here I am going to re enable Wi-Fi once again.
I'll wait just a couple of seconds then we'll rerun the script down below.
And this time there should not be an error and response should indeed show up.
So right here I am going to fire that often what do I get I get my forecast clear throughout the day.
It is currently fifty seven point seven five degrees with a zero percent chance of rain.
And there we go.
Now we have a little bit of error handling in our program making sure that when things don't go well
we at least give the user information that's useful.
And so in summary we have these two arguments error and response only one is ever going to be populated.
The other is going to be undefined.
So if we have a value for error there's not gonna be a value for response.
If I have a value for response we're not going to have a value for error.
So that's why our condition works so well.
If there is an error then we know we have one and we'll print the message if there's no error then we
know by definition we have a response and we can go ahead and use it.
Now this isn't the only type of error we want to guard against.
The other relates to user input.
What if we get a bad set of coordinates.
That's not going to be handled given our current setup.
Let's go ahead and explore that by cracking open the you RL in the browser.
So what I'm going to do is take this you El copy it to the clipboard and for the moment we're going
to take it over to Chrome so I'm going to open it up in a new tab like we did a few videos ago.
And what do I get back.
I get back the weather forecast as expected.
Now let's go ahead and mess up the input in the U.R.L. up above.
We could go ahead and demonstrate this by removing the longitude from the you are well up above.
I'm going to fire off their request and what do we get back.
We do not get back a forecast because we haven't provided enough information for a dark sky to know
where we want to get the forecast for.
This is Andrew with a quick update for the weather stack API.
We can also break this API though to get that done.
We have to make a slightly different change.
So right here we have our U.R.L. on the far right and we have our query in order to break the weather
stack API.
We'll just remove both the latitude and longitude.
So right here we set query equal to nothing.
And if I hit enter and fire off this request we can see that we don't get back a forecast.
Instead we're getting back an error right here please specify a valid location identifier using of each
query parameter.
So this is the approach we can take to generate an error when working with the weather stack API so
in this case we do indeed get a response with two properties we have the code property end the error
or property on the response body.
And in this case we need to add a little bit of defensive programming to make sure we print a useful
error message to the user in this situation.
So it's important to note that when we have invalid input the server the server in this case for Dark
Sky might respond and it's gonna respond with data that might be considered an error but it's not going
to populate this error object.
This is used for lower level OS things like the complete lack of a network connection if the specific
server you're contacting can't find the exact data you need that's typically going to come back on the
response body.
So right here we want to add an else if clause to our if statement to look at response and see if there
is an error code set up if there is we'll print a different error message saying something like unable
to find location otherwise once again we'll continue to print the forecast if we actually have the data
we need right here before the else.
I'm going to hit enter a couple of times adding some new lines we'll bring that back into the picture
in just a moment.
And on to the end of the current if statement we're going to add on and else if clause so we'll have
our condition and the code to run if that condition is true.
Now I can back the else clause up to the end of else if so if there is a low level OS error we're gonna
print this message if this thing happens we'll do something else in a second otherwise we'll print the
forecast.
Now in this case we are going to look at response
dat body and we're going to see if that error property exists.
If it does we know that something has gone wrong.
So right here we can use console dialog to print a message.
And in this case let's do something like unable to find location unable to find location.
Now we have some pretty decent error handling set up.
If things fail at a low level we're gonna make sure we get that message.
If things go wrong with the input we'll get another message.
And finally if everything goes right we will indeed get our forecast showing up.
Let's go ahead and test things out.
So over here what I'm going to do is break you are L exactly like we broke it over there.
I'm going to remove the comma and the long dude leaving just the latitude in place.
This is Andrew with a reminder that for the weather stack API to break things we had to remove both
the latitude and longitude.
So right here I can remove both of those.
So I have query equals nothing.
Then I set up my other query parameter for units.
This is what we'll need to do to break things using weather stack.
Now let's go ahead and save the script and down below we're going to rerun the program so node apt J.
S.
Now I do have a network connection so there should not be a low level error but in this case I do have
invalid input so I would expect this condition to run.
I'm going to fire off the command and what do I get down below.
Unable to find location.
So now we have some pretty decent error handling set up allowing us to catch a lot of these edge cases.
Now if we go ahead and fix things I'll add a comma on and I believe it was something like minus 1 1
2 or 1 2 2.
We can go ahead and save the program rerun things for a final time and ensure we are still getting the
weather.
Clearly I was off I got a lot colder and a short period of time but we do indeed have a valid coordinate
pair and we are indeed getting to the end no low level errors no problems with the input which means
we print the forecast now it's challenge time where you're going to do the same thing for our Geo coding
request.
So to kick things off I am going to comment out all of the code related to our weather request will
obviously come back to that soon.
I'm just commenting out so we don't have a bunch of different things printing to the terminal and down
below we are going to uncommon the code for the geo coding API request.
Now right here I had a couple comments to illustrate exactly how geo coding was going to fit into the
big picture.
I'm going to remove those and this is where I will paste in the challenge comments.
Now in this case it's gonna be your job to setup error handling for the geo coding request and there
are four steps for getting this done.
Step one you want to set up an error handler for low level errors so that's when the error argument
exists.
And the response does not.
In that case you can print a message like unable to connect to location services.
Now once you have that in place I'd like you to test your work by disabling your network request and
making sure that when you run the app you see that error message print.
Instead of seeing a really long cryptic stack trace now inside of the else clause you're going to continue
to do whatever you're currently doing so that handles the first type of error.
The other one is to set up an error handler when there's no matching results and we're going to explore
that right now by taking our you are from the browser and messing it up.
So over here in my other tab I had that you RL we explored when we initially set up geo coding and if
you remember the search term sits right here so it is forward slash geo coding forward slash v five
forward slash map box dot places forward slash your search term dot Jason.
So in our case we're searching for Los Angeles.
If I search for something like twelve what what am I going to get back.
I get back the following.
We still have those same four root properties type query features and attribution.
Then you'll notice that this time around features is an empty array.
So if we are getting an empty array obviously we're not gonna be able to look in that array like we're
doing right here to pull out the latitude and longitude.
So you want to set up an else if like we did above.
But you want to check if the features array has a length of zero.
If it does you want to go ahead and print a message saying something like unable to find location.
Try again with different search term then you want to go ahead and actually test that out by messing
up the you are well over here to generate zero search results running the program and making sure you
see that message print.
So just to demonstrate if I do swap out Los Angeles in the you are well right here with something like
12.
What and save the file.
I can indeed rerun the script down below.
And what do I get.
We're back to a big ugly stack trace.
The problem being that there is no center property on undefined undefined being the object we're trying
to access which does not exist in the features array because in this case the features array has zero
items inside.
I'm going to undo that change bringing the search term back to a valid one.
Now it's time for you to knock this one out.
Take a moment to pause the video test your work and when you're done come back and click play and we'll
work through the solution together
how'd that go.
I'm going to start with step 1 and ensure that we're handling those low level errors.
So right here what am I going to do.
I am going to start by disabling my network connection.
I'm gonna turn off Wi-Fi then if we were to rerun the program obviously things would indeed fail.
Let's take a quick moment to do just that.
I'll use the up arrow key and enter.
And what do I get.
I get the very long cryptic message saying that there is no response so we can't access the body property
on it.
We can address this by adding the if statement in if there is an error.
Then we know we want to print a message.
Otherwise inside of else we know there's a response and we can go ahead and do what we were doing before.
So I'm going to take these three lines.
You might have had just one if you chose to solve that challenge in a different way.
I'm going to cut them out and bring them up inside of else.
Once we have that in place we can go ahead and pick an error message for when there is no network connection.
Right here a console that log call to print something and I'll use something like unable to connect
to location services.
Excellent.
Now that we have this in place we've finished Step 1 at least hopefully and we can test things out down
below.
Once again I'll use the up arrow key and enter to run the script.
And right here we get unable to connect to location services.
Now if I was to read enable my network connection I would expect that we do indeed get a latitude and
longitude printing.
I'm going to rerun the program with the network enabled and what do I get right here.
I do indeed get my coordinates which is awesome.
Next up we want to make sure that when the search term returns no results.
We do indeed print a message letting them know we can't find that location.
First up let's recreate this error by messing up that search term.
I'm going to remove Los Angeles I'll replace it with some mumbo jumbo.
Like 12 followed by the word what.
And now if we were to rerun the program once again we would be back into a failing state.
And that's okay because we're gonna address that in just a moment right here.
Cannot read property center of undefined so the undefined thing is the object we're trying to access
from the features array the features array is empty in this case as we saw.
So there is not going to be an object and that object doesn't exist.
So it definitely won't have a center property to address this.
All we're going to do is add.
Else if like we did before.
I'll move else down below for just a moment.
Add.
Else if with a condition and some code to run when that condition passes then I'll bring the else clause
back into the mix.
Tacking it on to the end.
Excellent.
Now what's the condition in this case.
We want to run this code printing another error message.
If the array is empty so if response dot body dot features has a length equal to zero.
If it does that's a problem and we're going to print a message console dot log.
I'll print something like unable to find location.
Try another search perfect.
Now that we have this in place we can move on to the final step which is to make sure we actually see
this message.
When that array is empty I'm gonna go ahead and rerun the program once again and what do I get.
Unable to find location try another search.
Now let's wrap things up by bringing it back to a working state.
I'm going to remove 12 and what it'll be forward slash Philadelphia Dot.
Jason I'm gonna save the program.
That should indeed return a result.
And if I rerun the program I would expect to see the coordinates for Philadelphia and that is exactly
what I'm getting.
So error handling isn't the most fun thing to add to your application but it goes a long way towards
making sure you have a professional setup where users actually understand what's happening.
If things fail for the moment I am going to remove those challenge comments and save the file.
That's where we're going to stop for this one.
We now have a pretty good setup printing the nicer results when we get them but obviously sometimes
we don't go down that happy path.
And in this case we are indeed also handling those errors.
That's it for this one.
I'll see you in the next one.