00:00
好,那我们继续啊,那上一节课呢,我们是去把前端验证的东西啊写完了,那这一节课呢,我们来进行啊,真正的什么呀?啊,后端验证,后端验证。OK,那么后端验证的话呢,就需要我们真正的去发请求啊,请求我们的服务器,然后由服务器端来验证啊,我们当前用户的这个身份,呃,要请求服务器的话呢,那我们还是需要去看一下我们的接口文档,在我们接口文档的接口列表里面啊,第四个是手机号登录,手机号登录这里呢,大家看我分了这么几个,呃,上面这说说的呢,是我们当前的接口啊,用于去呃,用手机号呢,去登录网易云乐的真实的这个接口。所以呢,还没有账号的小伙伴呢,你可以去注册一下啊,对应的接口地址呢,啊是这个请求方式是get,那么必选的参数啊,这不用说一个手机号,一个是我们的密码啊,分别对应的字段呢,是phone和password OK啊还有个可选的参数啊,是用于国外手机号登录,那在这里呢,这个我们就不做了,那这有一个调用的示例对吧?那示例这一块呢,我们有了,我们先去测一下我们的接口啊,所以呢,来到这里啊,还是我们的老办法啊,Local host3000把接口丢过来。
01:22
那么对应的这个账号跟密码呢,我们需要一个真实的,所以呢,这里呢,我去输入一下手机号111,嗯40593,然后呢,对应的密码呢,我们也去给他换一下啊,那在这测呢,就让大家知道我的密码了,很复杂啊,123456玩吧走。这个时候呢,大家看啊,呃,现在呢,我是登录成功了,没有问题,哎,扣子为200啊,那就是说成功了好了,那现在呢,啊,我们先不管里面的数据啊,那这是一个呃成功的案例,那假如说啊,我的手机号不对,少一倍我们再走,哎这个时候你看到装向板是400。
02:02
好,那这是手机号不对啊,那么对应呢,呃,这个400我这儿呢也有说明啊,如果手机号错误扣的为400,紧接着我们看啊,如果是密码错误,哎,是502来我们看一下是不是这样的,好,那先把手机号写成正确的,然后呢,密码的话呢,那简单一点啊,我就把留个123啊,后边的不留回撤,诶大家看到这是502 OK,那现在的接口呢,我们也测完了啊,测完了没有问题,那接下来呢,我们要真正的去用代码去实现,那这个时候呢,我们要发请求啊,所以呢上来啊,那对应的这个注释呢,我给大家先收一下啊,在这里呢,引入一下啊,我们之前分装好那个方法啊,上一节在上一节U下边的request。然后啊,我们在这里去发请求,那要发请求呢,用到的是a think of it啊,所以呢,这a think我们就写上了啊,因为我们写了很多次了,来在这啊,Let个result法等于wa request,然后我们把刚才那个接口地址拿过来。
03:09
啊,就这。来过来好,前面的呃,这个地址啊,我们留着,那么后面的参数呢,我们还是写成什么呀啊这个对象的形式啊,一个是phone,一个是password,注意啊,我直接这样就写了,为什么可以直接这样写呢?因为上边大家看这来我们把这些验证呢,先给大家收一下。在这里我是吧,已经把我们收集表单项的这两个内容呢啊抽取出来了,并且呢,对应的正好是这两个变量,那这样的话呢,就相当于同名的属性可以省略不写啊这用到的还是ES6里面的东西好的,那现在呢,发请求了以后,我们需要通过代码的方式呢,去判断我们到底有没有成功,刚才呢,我们看到的code状态码还是result这个结果。
04:00
对象里边扣的是不是就是它对应的状态码呀,我们刚才看到几种啊,一种是200成功,还有个四码呢,是手机号错误,那么对应的还有502是密码错误。哎,大家可以想一下,如果说要你们去判断的话,你们是先判断成功的呀,还是先判断失败的呀。哎,这是一个思考题啊,那在这里呢,建议大家先去判断成功的,为什么呢?刚刚我们只是看到了三种状态嘛,200 400,还有502,那你要知道啊,我们真正发起牛的话,除了这些状态码了,很有可能有别的,比如说404,那就用户的地址压根输错了,是不是404啊,还有服务器错误,比如说500。是不是服务器错误呀,那这些状态码对应下呢,你照样是拿不到你真正的数据的。所以我们不能考虑的太简单啊,光考虑这三种,那这样的话呢,我们知道啊,我不管你别的啊,最起码我知道result code,如果说它呢,等于等于200的话,那说明啥,说明请求一定是成功的。
05:09
对吧?啊,那这个时候呢,我们去给他提示一下,就是用我们刚才那个微信点收post啊,我们来一个title啊,那这个呢啊,就是登录成功呗。OK,那接下来我们再写啊,那刚才我们看到的l if,如果说啊,我们lot的哎空嗯,等等于多少呢?400,那说明啥呀,刚才啊,咱们看到的啊,等等于400的话,我们说是不是手机号错误呀,既然是错误的,那我先能想到我们是不是先将这个icon设置为呢?不应该用那个对勾了啊,那这个时候呢,我们这提示一下啊啊手机号错误。对吧,哎,手机号错误,好那再说再往下还有什么刚才我们看到的啊else if再来一个,那就是的扣,如果说等等于刚才我们看到的502,那这一把呢,来说明啊,不用这个了啊,我们用这个这呢应该是啊密码错误提示用户呗,啊这为什么写了个l if呢?因为还有一些状态码,我们不可能挨个去判断了,所以呢,最后呢,我们统一用一个else直接啊放到这里,那那就告诉啊用户啊,我们当前的登录失败。
06:29
注意啊,这个时候你不能告诉用户,你比如说我们的服务器错了,或者说你呢啊或者有别的问题,我们干脆就告诉他啊,登录失败,然后呢啊请重新登录就OK好的,那这样的话呢,来整体的再捋一遍啊整体再捋一遍。啊,这是我们的判断,当我们拿到结果以后,对吧,200登录成功,400手机号错误,然后502密码错误,那最后啊,不管什么原因,你还没有成功,那就是登录失败,好的,那么写完这个以后啊,我们再用啊我们的模拟器呢,去测一把。
07:11
那这个时候注意啊,当你的前端验证不通过,你那个请求是发不出去的,你看这这是没有请求的,我们是不是必须要保证我们的这个前端验证通过了呀,所以啊,这个时候来啊,我去说一个啊,我们先来一个正确的,嗯。那先来一个正确的走你好,登录成功,那这个时候大家看啊,我们真正去发请求了,状态买了200 OK没有问题,那比如说我是手机号啊,少一位走,那手机号格式错误啊,其实这个前端验证就帮我们搞定了啊,那接下来呢,我们输一个密码错误吧。呃,比如说我随便说一个123来走。啊,密码错误。没有问题,那这个密码错误呢,是刚才我们那个通过后端啊这的状态码来提示给用户的啊没有问题,好的,那这节课呢,我们主要是去实现了我们的后端验证啊,那在这里呢,我们是需要真正的去发请求啊给服务器,有服务器来验证,然后呢,我们根据服务器返回的结果呢,不同的结果啊,做不同的提示给到用户,好,那这节课呢,我们先讲到这里。
我来说两句