0:00:26
welcome back guys to another episode of
0:00:28
bill break and fix brought to you by the
0:00:33
you guessed it if you did
0:00:36
and uh yeah in today's episode we're
0:00:39
gonna be doing some exciting stuff so
0:00:42
bear with me and we'll get the ball
0:00:45
rolling after few prerequisites
0:00:48
so first of all let's play
0:00:52
our acknowledgement to the country and
0:00:54
pay our respects to the elders of the
0:00:57
past present and future
0:01:01
i begin today by acknowledging the
0:01:03
traditional custodians of the land on
0:01:05
which we gather today and pay my
0:01:07
respects to the elders past present and
0:01:10
future i extend their respect to
0:01:12
aboriginal and torres strait islander
0:01:18
all right that was smoothly done
0:01:24
yeah so let's get the music rolling
0:01:34
all right cool so uh
0:01:37
what we're gonna be doing today is when
0:01:40
we're gonna be trying to save
0:01:50
we're gonna be trying to save the notes
0:01:52
they're coming from the websocket as in
0:01:55
through the websocket
0:01:58
and make sure that they get saved in
0:02:00
their database as well so what we would
0:02:06
to get that done is basically
0:02:09
make sure that the notes that are coming
0:02:12
from the websocket have been picked up
0:02:15
and been put into the variable
0:02:19
which is handling all our notes
0:02:22
all right and then eventually
0:02:29
it will save the notes in the database
0:02:35
let's get cracking
0:02:42
um so yeah that is it so we'll go into
0:02:48
actually am i already have
0:02:52
thing open yeah here we go
0:03:02
did this so that means that
0:03:07
so get message is coming from here
0:03:18
so get message will be there and
0:03:24
over here so basically a message being
0:03:37
board board notes card array so this is
0:03:41
taking all the cards and then this is
0:03:44
calling the action method
0:03:50
through that so if we take this one
0:03:53
what that's basically doing is calling
0:03:57
this in a card and then hence this can
0:04:05
the detail would be the cards array
0:04:18
when the card comes from the script
0:04:31
any comment yes very dory
0:04:38
fantastic man thanks for that i really
0:04:51
in a screw in a card
0:04:56
so we need to make sure that the cards
0:05:01
taken into consideration when the
0:05:04
event is connected to the websocket
0:05:09
um so for that one raise our
0:05:14
websocket get message
0:05:20
websocket dispatch websocket message
0:05:42
this opera sentos and ping
0:05:46
that's alright we don't really care
0:05:47
about this at the moment
0:05:52
all right on so this is on connect
0:06:02
all this happens through when it's
0:06:18
if we pause the get message
0:06:36
any cosplay and the board data
0:06:39
so all we want to basically do is make
0:06:46
created um the ones that are done
0:07:00
workshop websocket uh also
0:07:03
consider that so i'm just gonna
0:07:06
the console here and
0:07:11
okay and play this see what happens
0:07:26
what did i do there
0:07:28
someone much journey going on yeah man
0:07:31
i've had a beautiful day that though so
0:07:35
pushing myself at the moment to be
0:07:56
okay so quality one
0:08:20
oh this is really cool though
0:08:24
interesting i like it
0:08:31
sent you an invite
0:08:39
okay i didn't have a
0:08:48
but this is really interesting sonic
0:09:06
gray heading scrambler
0:09:09
they did it on the body
0:09:16
more continuous interesting
0:09:19
head so that there's an index.html and
0:09:48
no they might not have been searched in
0:09:52
this is interesting
0:10:18
nevermind okay so that is gone now
0:10:24
what i wanted to check is
0:10:27
reference our ws is not defined
0:10:36
this is not defined obviously it's not
0:10:44
error ws is not defined
0:10:49
where is ws am i using
0:11:08
that wouldn't work because
0:11:33
okay so it does come in here open
0:11:57
received message in terms of error
0:12:03
request id that one
0:12:22
so this is that one and if i do
0:12:37
set the board popular board notes map
0:12:42
so it is coming in here
0:12:44
and the cards in script
0:13:29
because it's not online that does make
0:13:32
sense okay so for that to work basically
0:13:55
get the websockets online and i'll need
0:14:01
let me check in this one
0:14:04
if i do this and open it in another tab
0:14:12
create another one here ah yeah that is
0:14:23
ah because it's not online right
0:14:26
so i would have to
0:14:36
so what that would get yeah i'd have to
0:14:40
which i don't really want at the moment
0:14:43
actually let's come back to this issue
0:14:45
because i don't want to take this online
0:14:49
so what we're going to do basically is
0:14:54
go to another issue
0:15:04
and pick the one that
0:15:07
we can actually solve without going
0:15:26
don't allow script tags in note as text
0:15:29
okay so we can basically do this one
0:15:41
this one in progress
0:15:46
okay let's do that don't allow
0:16:07
from execution how to
0:16:32
cross site scripting prevention
0:16:35
that is the one that we need
0:16:44
don't don't scratch defense philosophy
0:16:48
unsafe or open encoding question
0:16:52
alert example tech yeah that is the one
0:17:00
in order to add a variable
0:17:06
look at the text context
0:17:12
and added the same thing and would
0:17:21
save for example tech blur
0:17:28
any comments not not
0:17:40
i hate your culture requesting inserting
0:17:43
a variable between
0:17:47
a half for example that
0:17:50
has a good modified data that is
0:17:54
this could lead to an attack
0:18:07
common mistake dangerous context
0:18:13
okay something users
0:18:20
html one story would be to allow the
0:18:23
users to change the starting order
0:18:26
inside every editor i'll point them over
0:18:30
will prevent access
0:18:38
the intent intentions and the style will
0:18:40
be not rendered will not be rendered in
0:18:43
these cancellation sensations should be
0:18:50
sanitization bluestrip
0:18:54
from the variable and
0:18:59
every tennis has rainbow faced you know
0:19:10
safe html attributes include
0:19:20
eastern bodies spring spring
0:19:51
my modify also you can easily point your
0:19:57
i don't really want this
0:20:00
basic print whatsapp process scripting
0:20:15
let the script had to be embedded
0:20:23
so for example to make this more
0:20:35
your specific requirements said this is
0:20:38
actually quite simple it should work
0:20:48
js immediately proceeds
0:20:54
without anything in between them yeah
0:21:00
firstly let's see that the html looks
0:21:04
like this which is fine
0:21:06
i've removed the set timer
0:21:09
to run the days okay
0:21:14
this is not really the thing that i'm
0:21:18
you will inject on the key to the
0:21:21
the key to the solution is the
0:21:24
document.right line it will inject into
0:21:27
html script type sub surprise between
0:21:34
cross script tag or the front end
0:21:37
let's use the brown uh-huh
0:21:41
the password will see
0:21:45
no i don't really want this
0:22:00
first groups element
0:22:10
regix2 prevent the script script
0:22:15
to add in the input field
0:22:18
all right so this is basically the regis
0:22:35
okay we can basically use this
0:23:26
it is regular expression
0:23:34
interesting so we can basically use this
0:23:43
people before star
0:23:45
people start growing red is for html are
0:23:48
evil yes they are but for script tags
0:23:51
they're saying because of the special
0:23:53
behavior a script section may not
0:23:57
and sometimes remember some matching
0:24:00
over there right it's easily possible
0:24:03
however quickly look at the righteous
0:24:18
account for training wise so right let's
0:24:27
so this is how i'm going to insert it in
0:24:31
to remove html for using
0:24:36
oops um i need to use up my laptop
0:24:40
just bear with me i will be back shortly
0:24:47
all right here we go
0:24:56
so if we validate before putting in the
0:25:02
so we want to go back to data
0:25:07
in the cars create card draw new card
0:25:15
okay that draws a new card
0:25:30
and it caught on either any card
0:25:33
yep there's the one
0:25:37
so draw new cards he comes with draw new
0:25:41
then it takes the card and typed text
0:25:50
text so draw new card
0:25:54
go to this definition and then
0:26:22
so in this one we're gonna basically say
0:26:29
that if type is equal to chord here that
0:26:54
shouldn't allow any
0:26:58
you shouldn't allow any um what you call
0:27:03
it shouldn't allow
0:27:04
any predict uh script text so if
0:27:12
so if we do this so if text
0:27:42
contain i would say
0:28:05
and we do this and then what do we do is
0:28:56
let's check if the rejects contain
0:29:09
to create user register must contain
0:29:12
some kids but i'm pretty sure it steps
0:29:15
it's just had a damn good reason to do
0:29:17
it probably somewhere
0:29:21
on some browser does
0:29:23
excuse groups when inserting
0:29:53
um so with the viewers
0:29:58
64 let's have you mate
0:30:03
and victor samson welcome
0:30:06
egg and great to see you
0:30:20
not present so what we basically need to
0:30:24
do is check if any of the text
0:30:33
contains uh rejects
0:30:39
uh string contains right right right
0:30:57
text contains any of these
0:31:09
then we won't allow
0:31:11
it to create return
0:31:19
uh throw the arrows open
0:31:31
this is not going to work
0:31:37
it's growing the card here after
0:31:41
the validation we need to draw the card
0:31:44
first and then do the validation
0:31:56
okay so this is the content
0:32:02
what we can basically do is
0:32:05
we can do this part over here
0:32:15
so this one can be
0:32:26
true then what we want to do is we don't
0:32:43
text is contained then what do we want
0:32:46
to do we don't want to insert it
0:32:51
if this if it doesn't contain that then
0:32:53
we want to simply do text
0:33:14
open toast message
0:33:25
with toast message
0:33:32
um confirmation prompt yet
0:33:37
ah say what's it is it is an open alert
0:33:43
open it look yeah it would be an open
0:34:02
so there was a way to
0:34:05
customize the messages
0:34:09
probably open toast message
0:34:36
i think it would work but let's try
0:34:40
and give it a shot
0:35:20
our text content contains is not
0:35:25
interesting okay and now mine's
0:35:31
if this is a string isn't it i
0:35:36
it's basically nothing it's
0:35:39
let's go to this reference
0:35:43
and check for exactly his text type
0:35:49
so text type is that this one is that
0:36:03
text type is a string
0:36:06
note dot text yeah
0:36:09
text type is a string apparently
0:36:17
this definition of this
0:36:20
where is it declared
0:36:56
don't mean text includes
0:37:00
that's the one i meant
0:37:02
i don't know one thinking
0:37:07
uh so if i go back to text
0:37:16
i did that to be honest conor 64.
0:37:20
so what did i miss text or includes
0:37:26
yes i did that text or includes which is
0:37:32
ah text contains includes
0:37:37
my reading ability where has it gone
0:37:48
and textile contains okay i'm gonna
0:37:57
put that live server
0:38:12
why is it still picking up text contains
0:38:18
don't even have tech
0:38:28
so i don't need that anymore
0:38:34
it should be fine check sewing
0:38:48
right there t is not defined
0:38:51
where is this coming from still frontend
0:39:20
it doesn't work now
0:39:24
it doesn't work because i'm drawing the
0:39:32
before i even i've even
0:39:37
never mind this is not gonna work
0:39:42
okay so we we only
0:39:45
once we have actually drawn the card
0:39:52
draw a new card yeah so if we
0:39:59
so now i should work yeah
0:40:06
with the text on the card
0:40:10
we can't allow this text
0:40:13
so if we do script
0:40:19
we don't want to allow that
0:40:42
so we don't want to allow script tags on
0:40:48
so basically if we
0:40:59
how would we find out that if that is
0:41:07
so in this one i think what we can do
0:41:18
yours is contained don't you want to
0:41:21
sanitize the data before you draw else
0:41:24
is prone to dom manipulation
0:41:36
i'm just thinking that if we
0:41:45
sanitizer before we draw
0:41:52
yeah yeah that would actually make sense
0:41:56
so we want to do that sanitize it before
0:42:00
we draw it so if you come back
0:42:13
create card there we go so we wanna come
0:42:23
actually you wanna check
0:42:36
and that's in there
0:42:38
okay that's why i don't need that
0:42:41
so that would basically be created
0:42:58
what we want to do here basically
0:43:00
sanitize it so let clean
0:43:09
purifier that's going in there
0:43:16
why am i saying which is great
0:43:32
so which would be dom
0:43:50
super fast return github
0:43:56
how do i use it so
0:43:58
this is basically ah so i needed the
0:44:17
so i think i already had the scripts
0:44:25
if you draw the card
0:44:27
then send inside you can still break
0:44:34
yeah because when we draw the card the
0:44:40
gets inserted then and it will have zero
0:44:43
effects you're right
0:44:45
yeah so that would be the case
0:44:50
um so in this one i'm pretty sure we had
0:44:56
don't purify yet min.js
0:45:16
so the script tag is there
0:45:22
okay so it's yeah and then what i want
0:45:26
to do is basically
0:45:34
yep that's already there
0:45:36
so now what i want to do is just this
0:45:41
so if we come back to that one
0:46:00
and if we do this one here
0:46:03
which will do that and then
0:46:12
please don't send the user profile
0:46:15
so the resultant the resulting
0:46:18
html can be written into a domain using
0:46:23
in html or the dom using document.right
0:46:26
okay don't purify requesting dirty
0:46:32
sanitize okay so what does this sanitize
0:46:41
ah okay dirty right so i can put this
0:46:54
nobody will we promise html it says
0:46:59
if you need html which might be a very
0:47:02
cool use because you can easily set up
0:47:11
so now clean and then what i can do is
0:47:19
okay what i can do is do this clean
0:47:23
no clean text here
0:47:34
how about if i do this
0:47:50
kind of ties the text and then text and
0:47:53
then this one can remain the same here
0:47:58
create the card and use that
0:48:22
okay say find the script tag
0:48:26
still allowing me to do it
0:48:35
i think i might need to have a look
0:48:42
how would you do it
0:48:48
how to insert in first
0:49:07
have i still got that one over here
0:49:12
no yeah i don't need this one now
0:49:15
because i'm sanitizing it
0:49:48
so i need to avoid this and it's hot um
0:50:07
what i would probably need to do is
0:50:12
reproduce this and then from there
0:50:18
let's see how that one works
0:50:24
all right guys probably
0:50:30
continue on it on sunday
0:50:39
now and to be honest i can't even think
0:50:46
uh a little bit of progress because
0:50:50
you know where we are going now and um
0:50:52
the implementation is already kind of on
0:50:55
the way but um yeah if you want to see
0:51:00
if you want to see how we do
0:51:02
um actually complete the fix um of
0:51:07
of the prevention of the cross crops
0:51:10
cross site scripting and
0:51:13
feel free to join us on sunday
0:51:17
same time same place and a different
0:51:19
task um sorry the same task all right
0:51:23
i'll see you guys then have a good night
