1
00:00:00,700 --> 00:00:03,610
In the last section we finished up our local tunnel's setup.

2
00:00:03,630 --> 00:00:08,760
The last thing we have to do is make sure that we instruct send grid that any time it receives some

3
00:00:08,760 --> 00:00:11,500
type of click event from one of our e-mails.

4
00:00:11,580 --> 00:00:17,400
It should send these event notifications over to this specific you RL that is being maintained by our

5
00:00:17,400 --> 00:00:22,540
application specifically this local tunnel address right here.

6
00:00:22,590 --> 00:00:26,970
So let's change over to our Saenger dashboard and set this thing up and then test it out.

7
00:00:27,300 --> 00:00:31,590
So I've already taken the liberty of opening up my said grid dashboard so all I have to do is open up

8
00:00:31,650 --> 00:00:37,000
a new browser tab go to send grid and log in and you should be at the screen right here.

9
00:00:37,080 --> 00:00:39,730
Once I'm here I'll find my left hand now.

10
00:00:39,840 --> 00:00:42,980
And I'm going to scroll down to the settings section.

11
00:00:43,200 --> 00:00:47,390
I'll expand settings and then I will find mail settings right here.

12
00:00:48,750 --> 00:00:51,840
That inside of mail settings there's a lot of stuff going on in here.

13
00:00:51,870 --> 00:00:55,690
The one that we specifically want is event notification.

14
00:00:55,710 --> 00:00:58,750
So this is the Web hook interface right here.

15
00:00:59,050 --> 00:01:02,580
I'm going to first make sure that I turn on event notification.

16
00:01:02,580 --> 00:01:06,130
We were then asked to provide an age TTP post your l.

17
00:01:06,150 --> 00:01:10,340
So this is essentially where we want send grid to send information.

18
00:01:10,350 --> 00:01:14,720
Every single time someone clicks on one of the links inside of our email.

19
00:01:14,790 --> 00:01:20,640
So for us right now in the development environment we're going to make sure that we provide a URL of

20
00:01:20,700 --> 00:01:22,860
our local tunnel address.

21
00:01:22,860 --> 00:01:27,970
So a local tunnel we received this request and then forwarded on to our local machine and then the request

22
00:01:27,970 --> 00:01:33,680
will be eventually forwarded on to localhost 5000 which is our express server.

23
00:01:33,930 --> 00:01:38,080
So to make sure that I get the right you are well I'm going to go back over to the terminal.

24
00:01:38,250 --> 00:01:44,030
I'll scroll up a little bit and we'll find that debug statement that had said specifically your u r

25
00:01:44,030 --> 00:01:45,760
l is blah blah blah.

26
00:01:46,050 --> 00:01:50,510
So I'm going to just copy paste this thing right here just to make sure I'm using the right one.

27
00:01:50,880 --> 00:01:53,250
So going to copy that link.

28
00:01:53,520 --> 00:01:56,220
I'll go back over to the post you are right here.

29
00:01:56,280 --> 00:01:57,410
I'll paste it in.

30
00:01:57,660 --> 00:02:04,110
And the real gotcha right here we do not only specify the domain we are specifying the exact you are

31
00:02:04,110 --> 00:02:08,680
l with the route that we want any of these Web Hoque notifications to be sent to.

32
00:02:08,780 --> 00:02:14,730
And so remember way long ago we had agreed when looking at all of our survey routes we had said that

33
00:02:14,730 --> 00:02:21,820
we would expect any feedback requests to be sent to API slash surveys slash WebEx.

34
00:02:21,840 --> 00:02:28,670
So back over we will say yes send any requests that come into this local Tunnell server scroll out and

35
00:02:28,710 --> 00:02:30,250
see this entire domain.

36
00:02:30,310 --> 00:02:32,520
And I'm sorry I know the font here is very small.

37
00:02:32,610 --> 00:02:38,870
So we will say slash API slash surveys slash Web looks like.

38
00:02:38,860 --> 00:02:44,720
So now we can use this button right here to test the actual integration.

39
00:02:44,760 --> 00:02:49,260
And I'm going to really suggest that we do that right now just so we make sure everything is set up

40
00:02:49,260 --> 00:02:55,830
correctly if we click the button right now however we do not have a route of API slash survey slash

41
00:02:55,830 --> 00:02:59,190
web hooks set up inside of our express server just yet.

42
00:02:59,190 --> 00:03:04,920
So let's take a quick moment to go set up some little debug route for that or some debug route handler

43
00:03:05,220 --> 00:03:07,920
and then we will use this test to your integration button.

44
00:03:08,310 --> 00:03:10,610
So I'll change back over to my code editor.

45
00:03:10,740 --> 00:03:18,450
I'm going to find my routes survey route start G-S file and inside of here I'm going out on a new route

46
00:03:18,480 --> 00:03:21,240
handler of app dot post.

47
00:03:21,240 --> 00:03:30,000
So any time someone makes a post request to a slashy API slash surveys slash web hooks and like I said

48
00:03:30,000 --> 00:03:33,510
I want this to be really just a kind of debug helper right now.

49
00:03:33,720 --> 00:03:40,280
So I'll take the request and the response and we'll just Konst alog the request body.

50
00:03:40,380 --> 00:03:44,330
So we'll see what is a typical typical request.

51
00:03:44,340 --> 00:03:47,410
That said great is going to send over to our server.

52
00:03:47,880 --> 00:03:52,050
So a console log out the body of the request and then just to be nice to send great.

53
00:03:52,050 --> 00:03:53,760
We're not going to leave the request hanging.

54
00:03:53,760 --> 00:03:55,710
We'll send back an empty object.

55
00:03:55,770 --> 00:03:57,800
We don't actually have to send anything back at all.

56
00:03:57,810 --> 00:04:01,500
We're just going to make sure that we're going to kind of close off the request and not leave said grid

57
00:04:01,500 --> 00:04:02,470
hanging.

58
00:04:03,060 --> 00:04:03,300
OK.

59
00:04:03,300 --> 00:04:04,650
So we'll save this file.

60
00:04:04,680 --> 00:04:07,410
We'll make sure that we get our reload at the terminal.

61
00:04:07,440 --> 00:04:09,860
So we now have that additional router setup.

62
00:04:09,880 --> 00:04:14,250
So now go back over said grid and I'll click on the test integration button.

63
00:04:14,640 --> 00:04:20,700
Now when I do if I scroll up to the top I should see a sample event notification will be sent to your

64
00:04:20,700 --> 00:04:21,440
endpoint shortly.

65
00:04:21,450 --> 00:04:24,460
So a nice green message appear if you get something that's red.

66
00:04:24,660 --> 00:04:28,260
Well chances are you probably made a typo in your set up right here.

67
00:04:28,290 --> 00:04:31,090
So just make sure you get that green message up top.

68
00:04:31,230 --> 00:04:37,470
So that's going to instruct send grid to send a test request over to our Web hook that we just defined.

69
00:04:37,530 --> 00:04:41,880
So now we can go over to our terminal and see if that console log produced anything.

70
00:04:41,950 --> 00:04:46,410
And so when we flip back over to the terminal we don't immediately see anything just yet.

71
00:04:46,620 --> 00:04:49,070
But that's not necessarily the worst thing in the world.

72
00:04:49,080 --> 00:04:54,930
Let's double check the route name here and see I've got API surveys web hooks in and back over here.

73
00:04:54,930 --> 00:04:58,620
I have API slash surveys slash books so that's fine.

74
00:04:58,620 --> 00:05:04,140
Just remember every now and then it takes some amount of time for Saenger to actually get the requests

75
00:05:04,140 --> 00:05:04,820
over here.

76
00:05:04,830 --> 00:05:06,360
So let's take a quick break.

77
00:05:06,540 --> 00:05:11,190
Kind of let the Web hook percolate do its thing and then when we come back in the next section we'll

78
00:05:11,190 --> 00:05:14,250
make sure that we're actually getting the request logged out over here.

79
00:05:14,250 --> 00:05:15,810
So I'll see you in just a minute.