用户登录

在这个内容列表的列表项目里面,添加一个 Add to list 按钮,点击这个按钮,可以请求对应的服务端应用接口,把当前这个项目存储到一个地方。

在我们的演示用的服务端应用里可以添加一个这样的接口,回到项目,打开 db.json ,在这个文件里添加一个 "my-list",它的值是一个数组,这样服务端应用里就有了一个演示用的 my-list 接口了。

可以先去试一下,打开一个桌面版的 Http 客户端,准备一个请求,给服务端发送数据,一般用的方法是 HTTP 的 POST,请求的地址就是接口的地址,这里就是 http://localhost:3000/my-list,这个 my-list 是刚才我们添加的一个接口。

往它上面发送数据,在请求里可以包含一个主体,数据的格式选择 JSON,在下面准备一个要发给后端服务的 JSON 格式的数据,里面添加一个 title 属性,设置一下对应的值。再添加一个 body 属性,随便修改点内容。

准备好以后就可以发送一下这个请求。

回到项目,看一下 db.json,你会发现,在 my-list 里面,会出现一个数据项目,这个就是我们通过桌面版的 Http 客户端发送给服务端的数据,服务端应用收到了请求,会把数据存储起来。真正的服务端应用,这个数据会存储到数据库系统里,并且可能会先要验证用户的登录状态。

我们准备的这个演示用的服务端应用,默认不会做检查,直接就把数据存储到这个 db.json 文件里了。

GET

想从接口获取到数据,可以使用 GET 方法请求这个地址,这里输出的就是服务端接口响应回来的数据列表。把这个请求访问再换成 POST,修改一下要发送的数据里的 title 的值,然后再发送一下这个请求。

把方法换成 GET,重新再请求一下 my-list,这次接口返回了两个数据项目。回到项目再看一下 db.json 文件,这里会出现刚才发送的内容项目。

PUT

修改数据项目,一般用 PUT 或者 PATCH 方法,请求的地址是 my-list 后面再加上一个数据项目的 id 号。请求里面也需要提供一个数据项目,修改一下 title 属性的值。 然后发送一下这个请求。

完成以后到 db.json 这里再检查一下,你会发现 id 号是 2 的数据项目,它的 title 的值会是刚才修改之后的值。

我们创建的服务端接口,使用 PUT 方法请求跟用 PATCH 方法请求会有些区别。

可以这样试一下,去掉这个要修改的数据里的 body 属性,修改一下它的 title 的值,然后再发送一下这个请求,回到 db.json,你会发现,id 号是 2 的数据项目,它的 title 是我们修改之后的值,但是它之前的 body 属性不见了。

因为我们并没有在修改的数据里面,包含这个 body 的值。

在修改的数据里包含这个 body,然后再 send 一下这次请求。这样 id 号是 2 的这个数据项目里,就又会包含一个 body 属性。

修改数据项目的值也可以使用 PATCH,把请求方法换成 PATCH,在请求的数据里只包含 title 属性,修改一下它的值,然后再发送一下这个请求。

你会发现,虽然我们在修改的数据里没有包含 body 属性,只包含了一个 title 属性,但是修改了这个数据项目之后,并没有删除掉在请求里不包含的属性。

DELETE

要想删除掉数据指定的数据项目,可以使用 HTTP 的 DELETE 方法,请求这个接口地址,就是 my-list 斜线,后面再加上要删除的数据项目的 id 号。发送一下这个请求。

这样就删除掉了 id 号是 2 的这个数据项目。再配置一个请求,用 DELETE 方法,请求 my-list/2 ,发送一下。这次就把 my-list 里的 id 号是 1 的数据项目给删除掉了。

总结

注意这里我们主要就是为了演示一下,一个一般的服务端接口的用法。以后在学习服务端应用开发的时候,我们会一起开发一个真正的可以使用的服务端应用。

理解服务端应用的接口《 Angular:请求 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点