Day10你敢不敢给我登入

延续昨日
有了资料库之後再来就是想想如何登入!
登入的意思就是你输入的帐号密码都和资料库的帐号密码一样
了解了这个思路接下来就来实作看看
首先 在终端机下json-server --watch db.json
才可以启动资料库!
这是我们目前的db.json
我新增了一笔资料等等来看一下区别
https://ithelp.ithome.com.tw/upload/images/20210922/20141007DsTYBxUOuh.png

在postman 测试一下
Get所有user 的资料结果如下
https://ithelp.ithome.com.tw/upload/images/20210922/20141007YHR2b5p2lK.png
再来测试抓取id等於sa password等於12345的资料https://ithelp.ithome.com.tw/upload/images/20210922/20141007BfssmmG7L5.png

成功了就出来一笔资料https://ithelp.ithome.com.tw/upload/images/20210922/20141007BshzCI0BC0.png
那接下来这就是我们登入的思路
再来我们在 登入页面import axios (要先在终端机下npm install axios)
import axios from'axios'
再来将我们day8的login function 改写一下
改成一个async的function(什麽是同步非同步 https://medium.com/%E9%BA%A5%E5%85%8B%E7%9A%84%E5%8D%8A%E8%B7%AF%E5%87%BA%E5%AE%B6%E7%AD%86%E8%A8%98/%E5%BF%83%E5%BE%97-%E8%AA%8D%E8%AD%98%E5%90%8C%E6%AD%A5%E8%88%87%E9%9D%9E%E5%90%8C%E6%AD%A5-callback-promise-async-await-640ea491ea64)
https://ithelp.ithome.com.tw/upload/images/20210922/20141007TPz56EjXmc.png

再来对着网页右键检查看一下刚刚设定的console.log
https://ithelp.ithome.com.tw/upload/images/20210922/20141007FTfadkfbKG.png

所以我们get到一个 data 是一个阵列型别 他的第0笔资料的id是sa password是12345

Status是200
statusText是OK

接下来我们修改程序码 把密码的12345 改成2345 然後再看一次console.log
https://ithelp.ithome.com.tw/upload/images/20210922/20141007bqyAGhjP5h.png

这一次data里面没有资料 status 一样是200
StatusText一样是OK
https://ithelp.ithome.com.tw/upload/images/20210922/20141007MDLnAbf9EU.png

知道这些之後就可以准备登入了!那会是明天的事情XD
p.s.记得我们day7的做法吗?
我们明天见


<<:  Day22 火焰文字

>>:  Day07 Flutter 和 Native 通讯的原理 01

【这些年我似是非懂的 Javascript】Day 29 - 物件 # Part 5 # 特性存取的秘密

今天要来分享特性存取的秘密~ [[GET]] 你知道当你在存取一个物件里面的特性时会发生什麽事情吗...

Day16,Domain&自签凭证

正文 以前有透过Freenom注册了一个边缘网域,这次就设定了一个homelab domain,将A...

django新手村7-----template 常用特殊标签

forloop.counter0 记数器从0开使 forloop.counter 从1开始 divi...

D-27-变数 variable ? int ? string

认识变数 variable 在昨天的历程中小光学习到如何透过dotnet cli来产生专案跟方案,并...

19. 好的面试官不只要有能力,更要懂得同理

前言 这篇蛮适合给刚要成为interview的人,帮助你思考要怎麽同理与善待面试者。 演讲总结 整...