In this video you're going to learn how to customize the errors that get sent back when the file upload
fails.
Whether it's because the file is not of the right type or whether it's because it's too large and doesn't
meet the file size limitation we've set.
Either way we can go ahead and send back a Jason error message instead of trying to render this HDL
document which is what we're seeing right now.
The first thing we're gonna do is take the multi-year middleware out of the situation altogether.
It'll be easier to explore this without figuring out what's Malta and what's Express.
So all I'm going to do is remove it.
No longer will we use that middleware that will add it back in shortly.
Next up we're going to create some middleware like we did earlier in the class.
I'm just going to define a function right here error middleware will be a function we'll get request
response and next which we know we get with our middleware functions.
And all I'm going to do every single time is throw a new error.
So right here throw new error with the following message from my middleware and this is what we're going
to register as the middleware to use for post upload.
So right here I will reference that function perfect.
Now with this in place we can go ahead and run this route from postmen and see what we get back I'm
gonna head over to post man switch over to post forward slash upload I'll fire that off and what do
I get down below I get some HDMI out.
It looks exactly like what I had before.
The only difference is that the error is now the one that we've provided.
So here we've completely taken Mulder out of the equation but we're still seeing a very similar response
where we're getting an HD AML document back.
We can go ahead and address that using our own little middleware example and the same solution will
work once we bring Mulder into the mix.
Now the problem here is that the middleware is throwing an error and we haven't registered any code
to run.
When that happens we can go ahead and do that by providing a another callback function down below.
So after the root handler which only runs when things go well we'll provide a another function with
the following arguments.
The first is the error that we're catching.
Then we have the request and response arguments and then we have next which we could optionally use
but which we won't.
It's important that we provide all four of these so express knows that this function is designed to
handle errors now down below we can actually choose what we want to send back and we can go ahead and
customize it to fit our need.
So for example I could use the following response dot status to set up a four hundred.
And then I could use send to send that back.
Let's go ahead and save the program with our one function added onto the end of the post call and we're
gonna run at the exact same request from postmen.
I'll send that off.
And what do I get down below.
I have a four hundred status code we set up with an empty body which is exactly what I specified.
Now from here we can take things even further and actually send the correct error message back.
So I could send back some Jason with the error property where the value comes from the message property
on the error itself.
This would allow the client to know why things failed and if I go ahead and rerun the request with this
code saved I would expect to see my message showing up.
So right here I have from my middleware showing up which is great.
Now the client is getting a useful error message back in Jason as opposed to that H2 UML page with this
in place.
All we need to do is swap out the error middleware with the middleware we were using before so right
here.
I'm gonna remove the function and I will use upload dot single once again right here I am uploading
what I believe I called upload.
Let's go ahead and double check that over in the request.
Yes that is correct.
And with that in place we no longer have a need for that middleware function.
We define now what we have is an upload endpoint that accepts images but also correctly handles errors
when things go wrong.
So let's go ahead and make something go wrong over here.
We are currently uploading sample dark file.
This should work since it is a document.
I send it off and like we had before I get my two hundred.
Now let's go ahead and swap that out for something else.
I'll try to upload an image instead of a word document right here I'm uploading profile pic dot JPEG
I send that off and what do I get I get my error message as a nice clean Jason response body error please
upload a word document it could not be clearer so all we really did was we added a another function
onto the end of the route handle or call in this case app dot post but the same strategy would work
for Patch Delete Get or anything else.
This function needs to have this call signature this set of arguments that it expects that's what let's
express.
No that this is the function set up to handle any uncut errors in this case any errors that have occurred
because melter through an error when it got a bad upload so all we did is add this function.
Now it's your challenge to do the exact same thing for the other route we've been working on.
I'm gonna head over to the user router where I'll paste in some challenge comments right here.
What I'd like you to do is clean up the error handling you're going to set up the error handler function
for this particular endpoint when that occurs you will send back a four hundred with the error message
and finally you'll test your work try to upload something whether it's too big or not an image that's
going to trigger an error and make sure you actually get the Jason response in post man.
Take some time to knock that out.
Test your work and when you're done come back and click play
how'd that go.
Let's go ahead and kick things off together by setting up that function.
This is going to come at the very end and it has to have the correct call signature.
Remember that is an error request response and next followed by the rest of the arrow function definition
down below.
We'll use response dot status to send back a four hundred letting them know that there is something
wrong with the data they've provided.
Either the file is too big or it's not an image.
And will you send to send back the error message on our object which will be passed to Jason.
We are going to set up error with the value coming from the message property on the actual error object.
Now that we have this in place things should be working from postman I can remove the challenge comments
since we're moving on to Step 3 where we test our work.
I will save the user router.
Head over to man.
Switch over to the upload Avatar request and test things out now.
Right here I'm trying to upload a PD app that failed before and it should still fail.
Just with a different response body right here please upload an image which is fantastic.
Next up let's use a valid upload.
So right here I can upload that robot profile picture.
I'm going to send that off.
This should work right here.
It does.
It does match the file extension and it's not larger than a megabyte and that upload is accepted now
that we have this in place.
The next step in the process is to figure out how we can add authentication and actually associate this
image with the user who uploaded it.
And that's what we're going to focus on in the next lesson.
So let's go ahead and jump into that.