0:00:29
what is going on guys welcome to another
0:00:32
session of build break and fix we are
0:00:36
you you must be thinking that where's my
0:00:38
co-host kartik um he's going
0:00:41
because he you're all uh as you all know
0:00:45
a student so he's got a simon do so for
0:00:48
that reason he can't really make it and
0:00:50
um so this session
0:00:52
will be entirely on me and um i'll be
0:00:56
taking you through some of the cool
0:01:00
some of the cool stuff that i plan to do
0:01:07
might have remembered that um
0:01:11
having an issue with the api with the
0:01:14
cause issue which is
0:01:18
causes has been blocked
0:01:20
by that issue so what we
0:01:23
what i'm gonna do today is uh i'm gonna
0:01:26
try and fix that issue and
0:01:31
see how we go on that issue because we
0:01:34
can't really move forward
0:01:36
uh without doing that issue because um
0:01:40
our next functionality is
0:01:44
um depending on the cause issue to be
0:01:48
resolved all right so
0:01:50
let's get started cool
0:01:53
and if i don't see you in this
0:01:56
in this camera and i'm
0:01:58
seeing over here then that means i'm
0:02:01
focusing on my screen
0:02:12
green scr the green screen is on the way
0:02:15
as well so hopefully the
0:02:20
camera angle will get sword by then
0:02:25
let's dive into the fun part now
0:02:31
coding garden fan how are we doing by
0:02:33
the way i love your emojis mate
0:02:36
keep them coming keep them coming
0:02:43
i'll just minimize
0:02:56
and i will do that and what i'm going to
0:03:00
do is actually share my screen with you
0:03:19
coding garden fan um
0:03:25
and uh as you know as you know that he's
0:03:28
a student um his score is
0:03:30
simon do you so he's working on that for
0:03:33
that reason he won't be attending the
0:03:36
stream uh unfortunately and um
0:03:43
where he is he's just working on his
0:03:47
all right so i'm going to go in the
0:03:53
tumblr enhancement
0:03:59
okay that one doesn't work on my end
0:04:05
and i mean tapping your right no the
0:04:07
spelling is wrong for scrambler
0:04:11
oh here we go and i'll just open it in
0:04:58
fully show up and then we can take it
0:05:05
how's your day been coding garden fan
0:05:13
right so i don't know if you can see my
0:05:19
properly but let's just check this one
0:05:38
yeah oh good to hear man um
0:05:41
my dad has been pretty good pretty
0:05:43
pretty pretty productive got a lot done
0:05:53
let's just see it into the
0:05:58
client because all the working
0:06:00
directories are in that folder
0:06:05
and i'm gonna open this up with
0:06:39
okay and let's open up our browser
0:06:45
what's going on over there
0:06:54
that's the browser and i'm gonna just
0:06:59
in the front and see how we go
0:07:15
right uh i'll do just
0:07:22
console to check if i'm still facing
0:07:28
um hopefully not but if it is then
0:07:37
go on about that and
0:07:39
try to resolve it so
0:07:46
okay so this time it didn't really show
0:07:50
cause error which is good
0:07:52
uh oh okay because that api has
0:07:58
the end point has been changed so i need
0:08:07
why is that error happening
0:08:10
right so um i don't know if you know
0:08:13
about um cause issues so
0:08:15
basically what's happening is that
0:08:21
endpoint is different to my
0:08:25
made up the fetch api um
0:08:28
my localhost so because these two
0:08:33
different that's why it needs to make
0:08:41
it needs to make sure that the policy
0:08:45
uh that enables the two different
0:08:53
valid but at the moment apparently it's
0:09:00
czecho and people call the desert
0:09:07
but um i think what you're
0:09:11
in the middle where i think what you
0:09:15
what you're talking about uh happens in
0:09:18
the back end which is the express app
0:09:34
do you want me to show you if yes let me
0:09:40
so i'm just gonna change the endpoint to
0:09:43
do that to get the updated one
0:09:48
seems i don't have the update
0:09:54
i would first have to get the latest
0:09:59
let's get that from
0:10:12
how is this i need to open up my aws
0:10:19
didn't know express had a pre-built
0:10:26
uh so i don't think
0:10:29
preview coding card van it's an npm
0:10:33
package that i had to
0:10:36
install and then i
0:10:38
imported it in the express app
0:10:45
built in in express app
0:10:48
there's a package we need to install
0:10:53
right uh so this one goes there i'm just
0:11:02
and see how that works
0:11:18
surely um i'll show you um because we
0:11:22
creating this micro service architecture
0:11:26
it's in my other repo but i'll
0:11:29
open that one up and
0:11:33
just bear with me for a sec
0:12:13
where's special okay
0:12:18
andre the special k uh
0:12:22
as you know that he's a student and um
0:12:24
his score is simon d so
0:12:27
he wouldn't be able to make it
0:12:31
today because he's working on his
0:12:38
you guys are probably stuck with me only
0:12:45
if so give me a link to the repel check
0:12:49
okay yeah i could do that
0:12:56
i just have to check
0:13:03
then i will be able to give you the
0:13:16
that is the one that you want
0:13:26
i'll just paste it in
0:13:32
go cody garden fan
0:13:38
thing that you wanted
0:13:41
for the mpm course package
0:13:47
going back to the api gateway now we
0:13:57
endpoint which we will get it from
0:14:11
that's where i'm at
0:14:24
we're going to get the link to the api
0:14:44
this is our stack so the api should be
0:14:51
sorry not the stack the
0:15:01
there we go and our
0:15:04
link should be on this link which is the
0:15:10
a what's happening
0:15:13
dad what's that welcome
0:15:21
alright uh so i'm gonna paste that link
0:15:29
if that still gives me the course issue
0:15:38
don't really want this prod
0:15:43
yeah okay cool that's fine
0:15:47
actually prod only
0:15:52
i need the board yeah to
0:16:00
what was that thinking
0:16:02
honestly all right cool um so i'm gonna
0:16:05
start this app again on localhost
0:16:12
i didn't go broke yourself
0:16:16
i'm doing very very very
0:16:23
got your palm as well
0:16:33
but um here we go so
0:16:36
what was that come on called python
0:16:52
let's check if you're still
0:16:54
facing that cause error
0:17:01
what do we have here right cool
0:17:06
that one's there and if i just say
0:17:13
okay so i'm still getting the cause area
0:17:38
what did we film middleweight 32
0:17:41
so you're seeing the arrows coming from
0:17:43
the middle with a2
0:17:52
access control now origin that one
0:17:58
um what was that again so i want to
0:18:14
network tab place my
0:18:19
ah here we go so this is our script
0:18:23
thing that's causing the issue
0:18:26
gonna open this one up
0:18:30
error name not found
0:18:39
that's this is coming from a preflight
0:18:45
pretty pry you're right
0:18:50
okay that doesn't do anything to do with
0:19:01
it's not really using our updated api
0:19:06
apparently interesting
0:19:10
glad i really like that um
0:19:13
i'm gonna just hard refresh again
0:19:20
see if it uses that now
0:19:34
so if i go to my networks tab
0:19:45
this is really weird
0:19:48
over here says this just know our old
0:19:54
shouldn't be in the first place
0:19:58
what i'm going to do is close the
0:20:02
and open or open it up again
0:20:07
maybe it's still taking the
0:20:15
just have a bit of water
0:20:40
and what does the just give us now okay
0:20:44
it's still given giving us the same one
0:20:54
this is the same one
0:20:57
so the api has been changed
0:20:59
changed calls out of hundred
0:21:10
yeah middleweight 32
0:21:12
so it's coming from this 32.
0:21:20
i think yeah this is a sink away
0:21:26
actually one might do is hang on
0:21:31
try and use this part here
0:21:34
and see if this works
0:22:02
all right cool so let's try
0:22:08
i'm going to open that one up again
0:22:11
because i just want to experiment
0:22:14
something if it works or not
0:22:17
maybe the end point that i was
0:22:20
giving it was not fully
0:22:22
correct and which is why i was causing
0:22:31
maybe i don't know
0:22:34
let's have a look if that was the case
0:22:40
all right open up console
0:22:52
okay funny doesn't know wrong huh
0:23:01
and what does it tell us
0:23:04
in the chord uh says same thing still
0:23:11
if i go back in to my
0:23:26
yeah i need api gateway
0:23:33
what does post give me proxy
0:23:44
really curious why
0:23:47
is the cause not not going away
0:23:52
did i deploy as well
0:24:08
want to check a few things
0:24:20
no no i don't want this one
0:24:29
then networks tech because i really want
0:24:39
based out of coming from
0:24:46
so so it doesn't really give us any
0:24:56
response okay that okay options for off
0:25:02
that definitely doesn't work which has
0:25:06
that way cool i'll
0:25:37
okay my back needs charging so i'm just
0:25:40
gonna put down charge
0:25:48
let's try and open up that one again and
0:25:52
where do we get our error in the
0:26:26
yeah the endpoint is definitely working
0:26:35
yeah the endpoint definitely works
0:26:43
core reference type
0:26:49
course something to do with this this is
0:27:18
request that one cool
0:27:22
prefer or regen is this referral is that
0:27:31
response was the one access law all
0:27:36
access to our region
0:27:44
if this is causing the problem because
0:27:47
in the request i've got x
0:27:52
responsible i just allow all reach
0:27:56
allow region is all
0:28:01
but in this one request
0:28:04
i don't have that i don't know if i
0:28:15
headers content type
0:28:18
lowry yeah this is the the request i
0:28:23
origin is that one
0:28:26
referral is that one
0:28:43
so polish response coming
0:28:46
api giving 500 get response status close
0:28:53
right and if request
0:28:56
method is optioned
0:28:58
let's just go to the options
0:29:04
and see what do we have here let's go
0:29:12
do we need headers here
0:29:16
not really i don't think we need them
0:29:26
i don't think this has anything to do
0:29:36
content type all right no
0:29:46
see this is all we've done application
0:29:50
yeah i don't ever get citation empty
0:29:53
access control allow region
0:30:04
prior information about this but they
0:30:11
integration response
0:30:13
which is c 200 i am actually
0:30:17
giving them the response which is 200
0:30:20
but for some reason it's not picking it
0:30:34
all let me just check if
0:30:38
i need to add something over here as
0:30:42
access control allow region yeah oh
0:30:54
try and do this as well
0:31:00
maybe this might be the cause
0:31:32
and headers as well
0:31:37
yeah which is fine
0:31:39
application dot j application i've been
0:32:10
that one home on html
0:32:32
come on i need to get rid of you now
0:32:36
all right still coming on
0:32:38
actually what i'm gonna do is
0:32:49
okay i'm going to copy and paste this
0:32:52
has been blocked by
0:32:59
you can actually paste this there
0:33:04
and see where am i
0:33:05
going wrong because
0:33:16
uh he's going to put the price control
0:33:19
check after another
0:33:25
yeah i've done this as well
0:33:30
post that one yeah
0:33:34
okay what did it say
0:33:37
and i believe that this is the simplest
0:33:42
right header allow
0:33:45
and actually i need to do in fetch api
0:34:14
let's see if we can get something
0:34:27
okay there's no part okay cool this is
0:34:32
one how do we get rid of this
0:34:44
i stop install chrome extension cool
0:34:46
down the problem is caused by the
0:34:48
browser blocking requests ah
0:34:51
by the so the browser's
0:34:54
blocking the request
0:34:56
or if it does it's in
0:34:59
total europe provided to set
0:35:02
in their code this
0:35:05
this is not an issue of your code all
0:35:07
right but i've already
0:35:14
i also try to replace painting
0:35:18
cool what's this one
0:35:26
uh i know that it could
0:35:30
i need you to fetch api not that one
0:35:53
method first phones 200.
0:36:07
integration request blend yeah that's
0:36:10
fine that's our lambda
0:36:22
um i think why my dough is add
0:36:27
those other headers here as well
0:37:19
not plural i need to have a look at that
0:37:23
let's go go go go go go go go api go api
0:37:28
oh wait wait go api come on boy come on
0:37:34
i just have to check
0:37:46
and see what happens
0:37:53
to be honest i don't even know if it
0:37:57
but all we can do is try
0:38:15
all right so this is deployed
0:38:21
give it a shot now
0:38:24
and see if this works
0:38:26
and if we still get cause error
0:38:33
come on please give me a surprise now
0:38:37
give me a surprise now api
0:38:41
i need surprises in my life come on man
0:38:45
i need surprises my life
0:39:30
control it does not happen
0:39:35
um i wonder if this is
0:39:38
causing the problem as well
0:39:45
let me just get rid of this
0:39:48
and see what happens
0:40:38
all right let's check this one if this
0:40:52
okay so that's gone but all right no
0:40:56
that's not still doing it
0:41:12
code error i'm pretty sure now
0:41:15
can't be the error in the code
0:41:32
what could it be what could it be
0:41:44
fixed called javascript
0:41:48
fetch cross origin yeah this
0:41:57
same request read your request
0:42:23
this is not the one that i need
0:42:26
i need to find this one
0:42:37
why is cause needed
0:42:39
all right now wise you need it that's
0:42:50
uh adventure requests
0:42:53
if we send french quests to another
0:42:55
website we'll probably fail
0:43:10
the policies for close
0:43:12
crossovers for sharing
0:43:19
what were they yeah
0:43:43
save method down here
0:44:02
if the header allows it then success
0:44:09
here's an example of
0:44:12
your sponsor content type that one
0:44:19
allow region which is
0:44:31
there's no quantity
0:44:40
okay so i need to basically
0:44:44
as you see origin header containing
0:44:49
exactly the region
0:44:58
yeah the server can expect the origin
0:45:01
and if the agrees to set
0:45:03
such a request add a special adder
0:45:07
allow region to the response
0:45:10
the header should contain allowed origin
0:45:18
or a star then the response is
0:45:20
successful the one thing scenario
0:45:26
i've already got this access control in
0:45:33
next control allow region
0:45:54
if our request is across the original
0:45:58
the browser was as though
0:46:00
that's the origin headed to it
0:46:03
for instance a free request
0:46:12
uh it had to look like
0:46:23
javascript does a fetch as in post http
0:46:26
request which is a post
0:46:29
or origin is this one
0:46:33
grand response it allows everything
0:46:39
then it would come
0:46:41
on access control allow region
0:46:46
or http otherwise it will fail
0:46:53
so we have got this already
0:47:02
opposed force quantum type access
0:47:05
control allow region all
0:47:07
we are actually allowing all actually
0:47:41
see what this gives me
0:47:55
all right let's check this one
0:48:26
okay so that doesn't even come here
0:48:32
obviously because it doesn't
0:48:45
500 how to resolve
0:49:35
okay how do i do this
0:49:38
this was fixed by accept
0:49:41
this after application donation content
0:49:46
once i find the new headers
0:49:49
to see what i'm saying
0:49:56
this one content time
0:49:59
okay i can try this as well
0:50:02
see how this works
0:50:41
let's check if this still gives me the
0:50:44
same thing or not hopefully not
0:50:54
okay fulfilled to fetch
0:51:05
so he's coming in here
0:51:09
right so that didn't look fairly
0:51:20
what else can we do
0:51:23
to be honest i'm running out of options
0:52:47
method response 200
0:52:52
methods lock control
0:52:55
now methods control
0:52:58
yeah this is all there
0:53:02
so it's going into options
0:53:23
it's going to hair
0:53:26
you should send me a response this is
0:54:01
well i'm really confused now
0:54:05
adding mapping template
0:54:11
what to do what to do
0:54:13
what to do trying to think
0:54:22
and what i'm going for safari and see
0:54:24
what's happening in there
0:55:22
just check if that comes in
0:55:32
url from there now look
0:55:35
a lot quicker and easier
0:55:53
this can come free right so that is sure
0:56:02
ah wow okay cool another session gone
0:56:17
sorry about that guys um looks like i
0:56:20
couldn't make it work but there's always
0:56:24
tomorrow so what i'm gonna be doing is
0:56:26
tomorrow i will be
0:56:28
coming back and hopefully
0:56:36
would also be able to join in tomorrow
0:56:43
tuning same time same place and
0:56:48
tomorrow if you can and if not no
0:56:51
problem i will see you
0:56:53
whenever you can but in the meantime
0:56:55
wherever you are in the world
0:56:57
good morning afternoon or good night but
0:56:59
in terms of melbourne and i have a great
0:57:02
night and i'll see you guys tomorrow
0:57:04
thanks guys cheers bye
