1
00:00:00,300 --> 00:00:00,610
Okay.

2
00:00:00,630 --> 00:00:03,090
And lastly, let's set up the logout route.

3
00:00:03,360 --> 00:00:06,930
And first, let me just showcase why we need one.

4
00:00:07,020 --> 00:00:08,490
And then step by step.

5
00:00:08,610 --> 00:00:12,780
We'll set up everything on a server as well as the front end.

6
00:00:13,170 --> 00:00:15,990
So at the moment I'm on a dashboard.

7
00:00:16,000 --> 00:00:17,970
Everything is dandy.

8
00:00:18,090 --> 00:00:20,370
I can navigate to all my pages.

9
00:00:21,210 --> 00:00:26,550
And I can clearly see that I still have a cookie with my token, of course.

10
00:00:26,820 --> 00:00:29,970
And if I go to a logout, what happens?

11
00:00:29,970 --> 00:00:33,560
I'm going to be kicked back to the landing page.

12
00:00:33,570 --> 00:00:34,080
Correct?

13
00:00:34,770 --> 00:00:35,380
Yep.

14
00:00:35,520 --> 00:00:36,420
That is awesome.

15
00:00:36,660 --> 00:00:39,260
But I can still see the token over here.

16
00:00:39,270 --> 00:00:41,220
Basically, I can still see the cookie.

17
00:00:41,370 --> 00:00:45,870
And what that means is that once I let's say, refresh, I'm going to go back to the application.

18
00:00:45,870 --> 00:00:46,230
Why?

19
00:00:46,230 --> 00:00:48,840
Well, because we perform a request.

20
00:00:48,840 --> 00:00:55,230
We get the current user cookie is valid, so we get the info about the user and all that, and that

21
00:00:55,230 --> 00:00:57,190
is probably not the best approach.

22
00:00:57,210 --> 00:01:00,960
Essentially what we want to do is to set up a root.

23
00:01:01,730 --> 00:01:03,470
That we can call when we log out.

24
00:01:03,470 --> 00:01:09,860
So not only we set up the features on the front end, not only we set, let's say everything back to

25
00:01:09,860 --> 00:01:14,420
the default on the front end, but we also want to remove that cookie.

26
00:01:15,830 --> 00:01:17,420
We want to remove it.

27
00:01:17,420 --> 00:01:23,270
And as a result, the user is not going to go automatically back to the dashboard.

28
00:01:23,870 --> 00:01:25,340
So here's what we want to do.

29
00:01:25,590 --> 00:01:27,740
Let's bring our gate to the redmi.

30
00:01:27,890 --> 00:01:28,880
So.

31
00:01:29,880 --> 00:01:34,500
As far as the log en route, we want to go with a controller.

32
00:01:34,930 --> 00:01:36,520
We'll go with the red dot cookie.

33
00:01:36,540 --> 00:01:38,070
We need to set the same name.

34
00:01:38,070 --> 00:01:39,690
So in our case, that is token.

35
00:01:39,840 --> 00:01:41,700
We need to provide some kind of value.

36
00:01:41,710 --> 00:01:43,350
So in my case, I'm just going to go log out.

37
00:01:43,350 --> 00:01:45,570
But this can be literally anything.

38
00:01:45,870 --> 00:01:52,230
And the gotcha here is following that we want to go with expires and then we just need to decide and

39
00:01:52,230 --> 00:01:53,970
how long this is going to expire.

40
00:01:54,120 --> 00:01:59,460
So just to showcase that, it's going to come back and then disappear, I'm going to go with one second.

41
00:01:59,460 --> 00:02:06,420
But essentially you can do something like this where the cookie expires automatically and the result

42
00:02:06,420 --> 00:02:10,470
is going to be that the user wants he or she logs out, actually.

43
00:02:11,460 --> 00:02:15,150
Is not going to have that cookie in the browser.

44
00:02:16,290 --> 00:02:19,530
As far as the response, it doesn't really, again, matter.

45
00:02:19,530 --> 00:02:26,070
If you want to display something, you can provide a message, but as long as you send the 200, you're

46
00:02:26,070 --> 00:02:27,480
going to be good to go.

47
00:02:28,410 --> 00:02:29,550
Let's keep looking.

48
00:02:29,760 --> 00:02:32,700
We want to, of course, set it up in a root like so.

49
00:02:32,700 --> 00:02:38,610
And then as far as the frontend, when we log out the user, we simply want to go with a wait and then

50
00:02:38,610 --> 00:02:40,080
auth logout.

51
00:02:40,410 --> 00:02:40,800
That's it.

52
00:02:40,800 --> 00:02:44,610
That's all we have to do because again, we're not going to make any changes on the front end, we're

53
00:02:44,610 --> 00:02:46,350
just going to remove that cookie.

54
00:02:46,350 --> 00:02:52,380
And in order to remove the cookie, we need to go with the same cookie, the name here, so token and

55
00:02:52,380 --> 00:02:55,580
then provide some kind of string value over here.

56
00:02:55,590 --> 00:02:57,870
In my case, that is going to be logout.

57
00:02:57,990 --> 00:03:00,420
And then yes, it's still a HTTP only.

58
00:03:00,420 --> 00:03:03,060
Now it doesn't have to be the secure one.

59
00:03:03,060 --> 00:03:05,910
Again, we're just removing that cookie from the browser.

60
00:03:05,910 --> 00:03:12,070
And then as far as the expires, just so I can showcase that it actually comes back and then goes away.

61
00:03:12,090 --> 00:03:15,720
I'm going to go with one second, but.

62
00:03:16,210 --> 00:03:19,110
Essentially we can just go with data now.

63
00:03:19,200 --> 00:03:21,340
So let's start working on that.

64
00:03:21,360 --> 00:03:24,550
We want to go to the controllers.

65
00:03:24,570 --> 00:03:28,580
So I have here controllers of controllers get current user.

66
00:03:28,590 --> 00:03:28,810
Okay.

67
00:03:28,830 --> 00:03:29,730
That's good.

68
00:03:30,270 --> 00:03:31,160
Let's go with console.

69
00:03:31,290 --> 00:03:32,160
Log out.

70
00:03:32,760 --> 00:03:36,450
And that is going to be a sync rec and Russ.

71
00:03:37,780 --> 00:03:43,600
And let's go with the resident cookie, and then we want to provide the token value.

72
00:03:44,620 --> 00:03:46,180
By the way, this is not.

73
00:03:46,990 --> 00:03:47,800
Correct spelling.

74
00:03:47,800 --> 00:03:48,970
This should be like this.

75
00:03:48,970 --> 00:03:51,940
So token, I'll say log out.

76
00:03:52,450 --> 00:03:55,150
And then we want to provide those options there.

77
00:03:55,240 --> 00:03:57,910
So http only.

78
00:03:58,360 --> 00:04:00,220
Yep, that's going to be the case.

79
00:04:00,220 --> 00:04:01,210
So HTTP only.

80
00:04:01,210 --> 00:04:01,900
True.

81
00:04:02,170 --> 00:04:07,480
And then as far as the expiration, I'm not going to repeat what I just said, like I believe three

82
00:04:07,480 --> 00:04:11,320
times expires and that is equal to new date.

83
00:04:11,530 --> 00:04:14,320
Now let's pass in a date that now.

84
00:04:14,830 --> 00:04:21,339
And in my case, I'm going to add that one second just so we can see basically the cookie coming back

85
00:04:21,339 --> 00:04:22,450
and then expiring.

86
00:04:22,780 --> 00:04:26,230
And after that, we want to go with that red dot status.

87
00:04:26,530 --> 00:04:29,680
So let's set up here as that status.

88
00:04:29,950 --> 00:04:33,220
And that is equal to status codes we're going to go with.

89
00:04:33,220 --> 00:04:34,000
Okay.

90
00:04:34,150 --> 00:04:40,360
And then let's set up the JSON here and let's say that JSON and will provide a message.

91
00:04:40,360 --> 00:04:42,910
So it's a message and user.

92
00:04:43,990 --> 00:04:46,330
Logged and out.

93
00:04:47,440 --> 00:04:48,430
Okay, good.

94
00:04:48,610 --> 00:04:51,040
Now let's navigate to the root.

95
00:04:51,900 --> 00:04:53,550
And we obviously want to get that.

96
00:04:53,820 --> 00:04:59,600
So in the throughout the first and let me double check, I don't think I added.

97
00:04:59,610 --> 00:05:00,490
Okay, my bad.

98
00:05:00,510 --> 00:05:02,060
So we need to export that.

99
00:05:02,070 --> 00:05:02,850
Of course.

100
00:05:03,330 --> 00:05:04,350
My apologies.

101
00:05:04,800 --> 00:05:07,140
So, comma, log out.

102
00:05:08,980 --> 00:05:09,580
Good.

103
00:05:09,820 --> 00:05:12,580
And then let's go to Arthur out.

104
00:05:13,120 --> 00:05:14,350
You want to grab that?

105
00:05:14,740 --> 00:05:15,490
Log out.

106
00:05:16,460 --> 00:05:21,860
And then let's set up I mean, in my case, I'm going to do right after login, but you don't have to

107
00:05:22,190 --> 00:05:23,180
so really matter.

108
00:05:23,180 --> 00:05:23,820
And you know what?

109
00:05:23,840 --> 00:05:26,360
In order to speed this up, I'm just going to copy and paste.

110
00:05:26,540 --> 00:05:29,030
So we're looking for the log out here.

111
00:05:29,240 --> 00:05:30,610
So that's the URL.

112
00:05:30,650 --> 00:05:32,180
It's going to be a get root.

113
00:05:32,480 --> 00:05:36,290
And we don't want the limiter doesn't really matter.

114
00:05:36,790 --> 00:05:38,390
I just go with the log out here.

115
00:05:38,660 --> 00:05:40,400
Let's save that.

116
00:05:41,090 --> 00:05:46,910
And like I said, on the front end, we simply want to call this a root when we log out.

117
00:05:47,000 --> 00:05:49,250
So let me find my app context.

118
00:05:49,670 --> 00:05:52,010
Let me find the log of user.

119
00:05:52,010 --> 00:05:53,270
It's a right over here.

120
00:05:53,450 --> 00:05:56,720
And then on top of it, let's just go with a wait.

121
00:05:58,540 --> 00:05:59,260
Wait.

122
00:05:59,740 --> 00:06:10,210
Auth fetch and then we're going to go with get root and we'll go with slash auth forward slash logout.

123
00:06:10,890 --> 00:06:12,120
And now it's the Stroud.

124
00:06:12,930 --> 00:06:15,150
So let me go back to my application.

125
00:06:15,720 --> 00:06:17,870
Let me refresh just to stay on the safe side.

126
00:06:17,880 --> 00:06:18,200
Yep.

127
00:06:18,210 --> 00:06:20,430
So users here, I.

128
00:06:21,200 --> 00:06:22,760
Navigate back to the dashboard.

129
00:06:22,760 --> 00:06:23,630
Everything's fine.

130
00:06:23,960 --> 00:06:26,040
And now let me log out and not notice.

131
00:06:26,060 --> 00:06:28,310
So essentially, we see this cookie over here.

132
00:06:28,310 --> 00:06:34,790
But let's say if I go and click on it one more time, we can see that there is no cookie anymore.

133
00:06:35,300 --> 00:06:38,270
And again, that is just the showcase that it does expire.

134
00:06:38,270 --> 00:06:44,630
So now let me go back to the auth controller and essentially we want to set it equal to the dot now.

135
00:06:45,540 --> 00:06:48,090
Effectively, it expires right away.

136
00:06:48,300 --> 00:06:50,280
So now let me test it out here.

137
00:06:50,310 --> 00:06:51,840
I'm going to go to John.

138
00:06:53,070 --> 00:06:55,200
My favorite user, of course.

139
00:06:55,770 --> 00:06:56,880
Let me log in.

140
00:06:56,880 --> 00:07:00,930
And of course, it complains that credentials are not correct.

141
00:07:00,930 --> 00:07:02,520
So let's try one more time.

142
00:07:02,790 --> 00:07:03,540
We're good.

143
00:07:04,170 --> 00:07:05,610
So that's my cookie.

144
00:07:05,610 --> 00:07:08,610
And then once we log out, everything should work.

145
00:07:08,640 --> 00:07:13,440
Notice we have no cookie anymore and we're directed back to the landing page.

146
00:07:13,860 --> 00:07:16,500
And that actually concludes the cookie setup.

147
00:07:16,530 --> 00:07:19,920
Like I said, there was quite a bit of refactoring.

148
00:07:20,940 --> 00:07:23,170
Unfortunately, there's no other way.

149
00:07:23,190 --> 00:07:32,550
But now you know how we can set up auth both ways with local storage or by.

150
00:07:33,380 --> 00:07:35,480
Just communicating back to the server.

151
00:07:35,510 --> 00:07:41,270
So each and every time we need some user info, we have a specific route that gets us everything, and

152
00:07:41,450 --> 00:07:50,570
all of the token info is stored in the cookie, which is only accessed by the browser.

153
00:07:51,050 --> 00:07:54,050
And essentially that is more secure.

154
00:07:54,200 --> 00:07:55,400
And also.

155
00:07:56,090 --> 00:07:57,950
It's less work on the front end.

156
00:07:58,220 --> 00:08:06,310
The reason why we had to do so much refactoring is because we already had the local storage approach.