WEBVTT 00:01.680 --> 00:06.660 So let's take care of writing some of the JavaScript we're going to need to authenticate and I'm looking 00:06.660 --> 00:11.260 at the login page HTML file that we were working on the last time around. 00:11.860 --> 00:16.200 What I'm going to do now is just to save some time, open the strike, just partial. 00:16.770 --> 00:22.440 So I'll open that because in this valve function, all of this, the form validation, partial copy, 00:22.440 --> 00:27.990 everything, including the statement, and then we'll get rid of the Fed statement or modify the statement 00:27.990 --> 00:28.840 after the fact. 00:30.450 --> 00:31.450 It'll just take some time. 00:32.160 --> 00:38.250 So I'm back in login page gulledge HTML and I'll paste the contents that I just copied from stroke, 00:38.250 --> 00:41.670 just partial into the valve function here at the bottom of this file. 00:43.880 --> 00:54.440 So first thing I'll do is I'll get rid of all of this stuff inside the first, then I should get rid 00:54.440 --> 00:55.190 of the couch, too. 00:55.220 --> 00:55.790 I don't need that. 00:57.620 --> 01:02.970 So I'll make this go from response to response, text to response, response, Jason. 01:03.210 --> 01:07.820 OK, and we're actually not going to be able to call that yet because the route I'm about to put in 01:07.820 --> 01:08.870 here doesn't exist. 01:09.470 --> 01:18.030 So I'm going to have the route that the statement goes to call our apro slash API and then slash authenticate. 01:19.520 --> 01:23.000 OK, now what am I going to put in there? 01:23.120 --> 01:26.630 Well, there's actually a few changes to make at the top of this. 01:27.140 --> 01:32.510 So the form is not called document yet, is not called charge form. 01:32.510 --> 01:34.610 What can I actually call this form? 01:35.760 --> 01:36.740 It is called charge for. 01:36.890 --> 01:38.960 Let's call the login form. 01:45.560 --> 01:51.930 He sat in there and come down here, so we'll get login forms, we check its validity. 01:51.940 --> 01:52.770 So that's all fine. 01:52.790 --> 01:55.050 We don't have a high pay button because there is no pay button. 01:55.650 --> 01:56.970 There is no amount to charge. 01:56.970 --> 01:57.870 So we'll get rid of that. 01:58.410 --> 02:03.150 And instead we'll make this haloed equal to, say, email. 02:05.140 --> 02:11.580 And password, and we'll just get the values from here from right from our form, so this becomes a 02:11.650 --> 02:27.460 document get element ID and we called it email value and the password becomes document the ID password, 02:27.460 --> 02:30.970 which is the lowercase p value. 02:32.500 --> 02:36.190 OK, so the request option, stay the same, the header stay the same. 02:36.190 --> 02:42.730 We string ify our payload and make that the body of our post request and everything else there stays 02:42.730 --> 02:43.150 the same. 02:43.360 --> 02:49.360 So what we'll do just to make sure this works is for now we'll say console dot log data. 02:51.080 --> 02:51.790 A response. 02:51.790 --> 02:52.360 I guess it is. 02:54.500 --> 02:59.850 So we'll log that once we actually get her authenticate back and hooked up properly. 03:00.350 --> 03:05.360 So just to test things, what we'll do next is we'll go to the back end and we'll make some changes 03:05.360 --> 03:10.460 to that code to add a root and a handler and a couple helper functions to it because we will make our 03:10.460 --> 03:18.140 lives easier down the road and then we'll try authenticating and just get some kind of valid response 03:18.140 --> 03:19.700 back from the back end. 03:19.820 --> 03:20.150 All right. 03:20.150 --> 03:22.490 We'll get started on that in the next lecture.