- [Instructor] Now that the user is able to login,…obtain a JSON web token,…and successfully view the data,…it's also a necessary feature…to allow the user to log out.…All that the logout functionality should entail…is to delete the user token from local storage,…and then redirect the user to the login page.…Let's add a logout button the menu.…Open up the HTML file for your menu component.…Let's go ahead and move the add contact button…to this container here.…

And we'll go ahead and add the logout button…to the menu.…This will be first in a div…with classes of right and menu.…And we'll have a button here,…and also give this some styling.…And this will contain the logout text.…Now when this button is clicked,…all we do is call the logout method…on this component.…That's it to the component file.…We will need the auth service…we've previously implemented here,…and this is in the shared folder.…

We then inject this here, in the constructor,…and add the logout method to this component.…This method, we will simply call…the logout method on the auth service.…

Resume Transcript Auto-Scroll

Author

Released

7/13/2017

APIs are at the heart of enterprise development, and Angular ships with robust services to communicate with them via HTTP. But one of the best ways to implement authentication of API services is using JWTs (JSON web tokens). In this course, we take a deep dive into using the provided $http service in Angular to create a robust and reusable API service implementing JWT authentication. Instructor Victor Mejia also covers how to use an Angular router to protect client-side routes and unit test services, HTTP requests, and async actions. All these concepts are demonstrated using a realistic contact management application, so you can see how API calls and user authentication are implemented in a real-world Angular app.