1
00:00:01,070 --> 00:00:09,769
well in this video we are going to see how to create a touch but the first thing we are going to do is

2
00:00:09,769 --> 00:00:23,190
explain a little what a touch is a touch is a tool that will allow us to know that the

3
00:00:23,190 --> 00:00:33,689
client the front is the person who says it is worth it will be useful to us to know

4
00:00:33,689 --> 00:00:40,630
all the time to authenticate all the time to that client to that front then what

5
00:00:40,630 --> 00:00:48,350
we are going to do is create a touch from the user's identifier, that is,

6
00:00:48,350 --> 00:00:58,070
every time the user logs in and puts their password and their login and password are correct,

7
00:00:58,070 --> 00:01:05,269
then a token is going to be generated and we are going to send that token from the backend to the front,

8
00:01:05,269 --> 00:01:17,030
okay, so that every time the user, the front wants to make a request for some data from the

9
00:01:17,030 --> 00:01:25,250
database that handles or files or objects or whatever that handles the backend is worth the backend is not going to

10
00:01:25,250 --> 00:01:34,989
respond to it until it verifies that touch before a little the idea is that good and we are going to

11
00:01:34,989 --> 00:01:44,409
work with the jason web so that the token is valid and that good touch then that is better known as jw

12
00:01:44,409 --> 00:01:57,549
The JSON Web Token what it does is digitally sign certain information, in this case it can be

13
00:01:57,549 --> 00:02:10,689
or the JWT is usually used for two things, one that is for an authorization, which is what

14
00:02:10,689 --> 00:02:20,189
that we are going to work and another is to send data, it is worth that there is an exchange of

15
00:02:20,189 --> 00:02:31,210
information, then in either of the two situations the jw t comes in handy because it

16
00:02:31,210 --> 00:02:44,969
sign digitally and then it guarantees the legitimacy of that information, it is good

17
00:02:47,250 --> 00:02:54,909
we are going to start doing it then to start using the jason web token what we do is first

18
00:02:54,909 --> 00:03:02,490
as always to install that module then we are going to come to our terminal of visual studio code

19
00:03:03,490 --> 00:03:08,270
and we are going to install the npm and jason web

20
00:03:10,949 --> 00:03:22,069
ok well it is already installed ok let's see that we have everything raised we have mongo I am going to

21
00:03:22,069 --> 00:03:30,430
also raise the mongo express ok we have our database here

22
00:03:30,430 --> 00:03:38,409
ok they give 2db user and we have and ours

23
00:03:38,409 --> 00:03:42,750
this is jacinto ok it was the last one because that's it

24
00:03:42,750 --> 00:03:50,389
ok we have our mongo db database with the collection and with the

25
00:03:50,389 --> 00:03:56,889
different documents, okay, well then, what is the first thing I am going to do the import

26
00:03:58,629 --> 00:04:14,509
and import jw from jason webtoon ok there we take it ok I do it in the controller because in the end here

27
00:04:14,509 --> 00:04:17,949
I am going to play with the login function that right now I am not doing anything and with the

28
00:04:17,949 --> 00:04:25,569
register is worth then I am going to generate that touch right now in register and then we will play with it

29
00:04:25,569 --> 00:04:37,189
in the login is worth then to do this well if we are looking at what we already have in our

30
00:04:37,189 --> 00:04:45,149
register arrow function we receive the information the variables that have been returned to us in a json

31
00:04:45,149 --> 00:04:54,810
that sends us in a json the from is worth the user mail the email the password then we have done we have

32
00:04:54,810 --> 00:05:03,990
encrypted the password is worth with a depth level of 10 we have created a new user

33
00:05:03,990 --> 00:05:14,290
through the model and the mongoose scheme and we have assigned that encrypted key to the

34
00:05:14,290 --> 00:05:24,689
key we have saved it and once we have saved it and no error has been skipped, that's why

35
00:05:24,689 --> 00:05:35,769
the target is here, it is in this hole where we are going to generate that touch then in this hole

36
00:05:35,769 --> 00:05:45,709
what I am going to do is with JWT there is a function, it is worth with JSON Web Token, there is a function that is the

37
00:05:45,709 --> 00:05:53,589
point without it is worth being signed, it is worth then we are going to put JWT point without there it is

38
00:05:55,290 --> 00:06:02,689
and this function we pass three parameters ok if you see them here separated by commas the

39
00:06:02,689 --> 00:06:11,990
first is the field that we want to code to make that touch the second would be a

40
00:06:11,990 --> 00:06:23,990
key principle a secret key is worth that this can be a single key or it can be a couple of keys a

41
00:06:25,089 --> 00:06:31,930
public key private key it will always be better to make the public key the private key is

42
00:06:31,930 --> 00:06:38,610
ok but well we are going to do it with a single key and then we could put

43
00:06:38,610 --> 00:06:45,550
several options in this case the options are going to be the lifetime that that token is going to have,

44
00:06:45,550 --> 00:06:56,089
then we are going to do that well before starting to write if I come to the documentation of

45
00:06:56,089 --> 00:07:05,509
JSON Web Token, the JWT.IO introduction, here I have all this that I am telling you, okay?

46
00:07:08,509 --> 00:07:13,769
I'm going to stop here because now when we create the token I'll explain this about the header,

47
00:07:13,769 --> 00:07:20,350
payload and signature, okay? Well, this is what I was telling you, that we can use it for

48
00:07:20,350 --> 00:07:29,410
authorization or for the exchange of information, okay, well, let's go back

49
00:07:32,170 --> 00:07:41,509
to our code then the first field that I have told you that we are going to put it will be a field

50
00:07:41,509 --> 00:07:49,910
I'm going to pass that it's going to be and it's going to be equal to and use the 6 point and a low and d

51
00:07:51,930 --> 00:07:53,629
second field

52
00:07:57,410 --> 00:08:01,029
second field parameter that I'm going to pass

53
00:08:03,310 --> 00:08:04,910
because that secret key

54
00:08:04,910 --> 00:08:16,250
secreta vale entonces eso es un string que por ejemplo le voy a poner dan 2 guión medio 2024

55
00:08:16,250 --> 00:08:29,389
por ejemplo vale esto no hay coma aquí tercer campo que le voy a pasar bueno las opciones vale

56
00:08:29,389 --> 00:08:38,789
then in the options we are going to put the expire in two points and we are going to put a day

57
00:08:40,110 --> 00:08:50,269
ok ok and we have all these fields this I am going to put it also between keys and so it is

58
00:08:50,269 --> 00:09:02,509
as more orderly ok ok then we have first what value am I going to use to create that touch

59
00:09:02,509 --> 00:09:09,049
what is the secret key ok in this case they give 2 2024 I am going to modify this because

60
00:09:09,049 --> 00:09:16,429
passing it in the code like this because security has very little expiration time ok and

61
00:09:16,429 --> 00:09:31,850
then I can put a callback, a callback is a property that allows me to evaluate this function,

62
00:09:34,490 --> 00:09:42,070
then this function either gives me an error or gives me a touch, then that callback

63
00:09:42,070 --> 00:09:53,070
what it does to us is we put it in parentheses or it gives us an error or it gives us the touch, okay, this

64
00:09:53,070 --> 00:09:59,950
will do depending on whether it is one thing or another, because it will do different things, we are going to tell it to

65
00:09:59,950 --> 00:10:07,870
do different things, okay, then I need to do an arrow function here, okay, this is

66
00:10:07,870 --> 00:10:23,830
ok then what am I going to tell you that if an error occurs then the only thing I want you to do is

67
00:10:26,450 --> 00:10:33,929
visualize a message that is, for example, the error that is being produced, okay and if

68
00:10:33,929 --> 00:10:41,009
no error occurs then you are going to send me to the front that is why we put the rest a json is

69
00:10:41,009 --> 00:10:56,370
worth a document in json format in which I am only going to pass the touch to the front this is between

70
00:10:56,370 --> 00:11:08,250
parentheses and between keys the token variable that we have generated is worth 3 this the jw t the

71
00:11:08,250 --> 00:11:17,870
sin function would be this one that I just described here is worth then I pass the field that I am going to

72
00:11:17,870 --> 00:11:27,629
use to generate that touch I pass the secret key I pass it in options that if we go to the

73
00:11:27,629 --> 00:11:33,889
jwt documentation you will have more options in this case the only thing that interests me is the

74
00:11:33,889 --> 00:11:41,750
expiration time then we tell it to expire in a day ok and then a callback that is to

75
00:11:41,750 --> 00:11:49,549
evaluate if an error has occurred or this function returns me the touch that is what

76
00:11:49,549 --> 00:12:00,110
we want to create if there is an error we visualize through a console ok and if there is no error you

77
00:12:00,110 --> 00:12:10,009
return or send better said from the backend to the front that touch is worth then we are going to and I am going to

78
00:12:10,009 --> 00:12:24,129
to comment on this and this is worth because it does not make sense that we are sending the client what

79
00:12:24,129 --> 00:12:29,950
he has already sent us, it is worth to the front, he has already sent us the id, the username, the email, it does not make

80
00:12:29,950 --> 00:12:36,110
sense, what does make sense is that we send him the touch so that later that from can be

81
00:12:36,110 --> 00:12:44,450
being authenticated ok then we have already verified that we have it all active let's go to our

82
00:12:44,450 --> 00:12:54,090
thunder client ok and here we are going to generate a request then as always we had made the route

83
00:12:54,090 --> 00:13:09,269
remember with the post here because we had told him the port 4000 and the register is worth and we are going to body and we are going to

84
00:13:09,269 --> 00:13:29,649
generate a new document, well, as we have done, it is worth username, this is going to be

85
00:13:29,649 --> 00:13:42,330
postponed, we can put, for example, Carmen, we can put an email that will be

86
00:13:44,809 --> 00:14:04,350
carmen arroba dan 2.com and the password that is going to be 234

87
00:14:04,350 --> 00:14:12,289
we are going to put it as a string in all we have put it like this ok ok I already have then that

88
00:14:12,289 --> 00:14:19,789
json that I am going to pass from the client, that is, from the front to the back in the back in, it will receive the fields

89
00:14:21,809 --> 00:14:28,570
worth the back in that there is something

90
00:14:38,399 --> 00:14:45,000
this I cannot put it with the keys

91
00:14:47,019 --> 00:14:48,440
that is why it is giving me that

92
00:14:48,440 --> 00:14:57,419
from the front we have sent these data and what I told you before we have done the

93
00:14:57,419 --> 00:15:02,879
encryption we have generated the new user so that it passes through the model or the scheme and the model

94
00:15:02,879 --> 00:15:12,440
we have saved it in mongodb and now we generate the touch and if it is good it has to respond to us

95
00:15:12,440 --> 00:15:19,460
with the rest one has to return us here a touch is worth then if I give it to send it tells us

96
00:15:21,500 --> 00:15:26,360
that the connection was rejected because because I do not have activated

97
00:15:28,440 --> 00:15:33,899
I have not raised the service of the express it is worth it is as if we had the back-end

98
00:15:33,899 --> 00:15:41,759
then here that we are going to put the npm npm

99
00:15:44,950 --> 00:15:55,590
of 2 ok ok now we have everything well set now I give it to what there is and when sending sorry

100
00:15:55,590 --> 00:16:01,070
then it has already returned to us it has told us ok I have done everything well it has done everything it has signed

101
00:16:01,070 --> 00:16:07,169
well, he has used the key well, the ID field and no error has occurred and he has

102
00:16:07,169 --> 00:16:15,870
returned that touch to us, so this is the touch, okay, this is the touch control that we are going to

103
00:16:15,870 --> 00:16:27,769
copy it and I am going to go back to the jw web page, it is worth then, notice that here it is

104
00:16:27,769 --> 00:16:40,129
saying the structure of the touch is worth of the jw of the jason web talk and then it tells you that

105
00:16:40,129 --> 00:16:49,610
that structure is that touch is divided into three parts one that is the header is worth it is in

106
00:16:49,610 --> 00:16:57,889
la que me va a dar estos dos datos que es el algoritmo que usa para la encriptación y el

107
00:16:57,889 --> 00:17:08,160
tipo de encriptación que es jota w vale entonces si nos venimos a nuestro código vemos que este

108
00:17:08,160 --> 00:17:15,460
todo este conjunto de números y letras está separada cada línea por un punto eso lo divide

109
00:17:15,460 --> 00:17:22,380
en el primer trozo este es el primer trozo que es el que en la documentación os dice que es el

110
00:17:22,380 --> 00:17:29,920
que vale el primer el primer trozo el segundo que sería esta línea y el tercero que es este

111
00:17:29,920 --> 00:17:38,059
vale en este va entonces el tipo de encriptación jwt y va el algoritmo que ha utilizado en el

112
00:17:38,059 --> 00:17:50,059
second is the one called the useful load and here what is encrypted is the value of the field that

113
00:17:50,059 --> 00:17:59,059
we have used in this case it is the identifier ok and in this third part of the touch the

114
00:17:59,059 --> 00:18:08,119
digital ok then this can be verified then if you select all the touch that

115
00:18:08,119 --> 00:18:17,000
has generated you we return to the web page I come to jason

116
00:18:17,000 --> 00:18:24,339
or sorry jw point and I go down here a little here we can paste

117
00:18:24,339 --> 00:18:56,279
that touch we are going to copy it we are going to paste it here well let's see okay let's see now there you are okay

118
00:18:56,279 --> 00:19:06,779
then look at how I have pasted that the touch that we have generated gives me the three sections in the

119
00:19:06,779 --> 00:19:11,700
first tells me that the algorithm he has used is the hs 256 which is the one that is by default the type is

120
00:19:11,700 --> 00:19:19,240
jwt json web token gives me the identifier ok and then he starts to put me here information that

121
00:19:19,240 --> 00:19:25,619
good that we do not care but if he has returned me that field identifier that is the one that

122
00:19:25,619 --> 00:19:37,750
we have used to generate the touch this is the 6 6 918 ok if we go back to our visual studio code

123
00:19:37,750 --> 00:19:43,349
we go to mongo we refresh here

124
00:19:43,690 --> 00:19:50,809
we see that we get 66918 b which is the same identifier that we have

125
00:19:50,809 --> 00:19:57,690
generated is worth with carmen carmen they give us two is worth and if

126
00:19:57,690 --> 00:20:00,670
we come

127
00:20:00,670 --> 00:20:31,119
localhost 8001 root, root, okay, we enter the database, let's go, it's the same, it's just to do the two ways and not get used to just doing it in one way, here I already have Carmen, okay, and I have that identifier that is the one we have used and the one that right now we have a token that takes it inside, okay, coded but inside,

128
00:20:32,619 --> 00:20:41,619
Okay, and then, well, this is how we are going to generate the tokens and how we send it to the front.

129
00:20:42,400 --> 00:20:46,359
Okay, in the next video, what we are going to do is this touch.

130
00:20:47,619 --> 00:20:50,019
We are going to send it as a cookie.

131
00:20:51,519 --> 00:21:00,180
So that it does not happen that we do not have to be constantly generating that touch when the client, the front, needs some

132
00:21:00,180 --> 00:21:10,900
type of information or data that can be generated by the API or the backend, so in the next video

133
00:21:10,900 --> 00:21:23,400
what we are going to see is how to do that how to take that touch and pass it to the front as a cookie a greeting