Angular 入门教程系列：35：Restful的增删改查

这篇文章来介绍一下如何进行前后端交互，一个常见的场景就是前端调用后端提供的restful api，进行增删改查，结合之前提到的新版本的http模块和rxjs，这篇文章首先使用kong搭建一个提供后端restful的api接口，对微服务的api增删改查进行处理，以实现api的简单管理。

事前准备

搭建kong，同时启动api服务，然后将此api注册到kong上，通过kong提供的查询的相关Rest Api进行查询

[root@kong ~]# curl http://127.0.0.1:8001/apis
{
  "total":1,"data":[{
  "created_at":1527809237323,"strip_uri":true,"id":"5f41ad1d-f9b2-4dc7-98fc-fc003ec366bb","hosts":["userhost"],"name":"userapi","http_if_terminated":false,"https_only":false,"retries":5,"preserve_host":false,"upstream_connect_timeout":60000,"upstream_read_timeout":60000,"upstream_send_timeout":60000,"upstream_url":"http:\/\/192.168.163.117:9001\/"}]}
[root@kong ~]#

详细可参看如下文章进行后端服务的设定，觉得麻烦的话也可以使用手头的任何后端或者模拟的后端服务均可。
https://blog.csdn.net/liumiaocn/article/details/80466616

设定proxy

在根目录下创建proxy.conf.json,因为牵扯到跨域访问，这里使用在angular中最为简单的本地开发环境的设定方式之一，通过这个配置文件设定诸如nginx可以实现的反向代理的功能,内容如下

{
  "/api": {
    "target": "http://127.0.0.1:8001",
    "secure": false,
    "logLevel": "debug"
  }
}
注意此处是demo用的，实际环境的时候一般为设定nginx，这样会根据url进行匹配，因为kong的api直接是在/下，往往会出现对其他页面的路由产生影响，可以将logLevel打开以确认状况

修改pacakge.json中的npm start命令，加载上述配置信息文件，修改为：

"start": "ng serve --proxy-config proxy.conf.json",

请注意，静态信息的修改需要重新执行start命令才行，因为proxy-config就是一个转发功能的开发环境集成，如果使用nginx的直接使用b