搜索
您的当前位置:首页正文

关于angular4如何设置proxy代理实现跨域

来源:知库网

一、在项目的根目录下创建一个proxy.conf.json文件,文件所在位置如图

二、该文件代码为

{

    "/test": {

               "secure":false,

              "changeOrigin":true,

"pathRewrite":{

               "^/test":""

             }

    }

}

三、修改package.json文件

ng serve --proxy-config proxy.conf.json

四、在创建的service文件夹中,创建HOST.ts文件用于存放api地址

五、接着在创建的service文件夹中,创建url.ts文件用于存放项目所需的api接口地址

这样GetBillTypes就代表一个可以跨域访问服务器的接口,列如我service文件夹的account.service.ts文件

接着调用该接口getBillTypes()

这样getBillTypes接口得到的数据就赋值给billTypes了,billTypes首先得声明一下类型,如果不知道该接口的数据类型可以用any表示

六、最后console.log(this.billTypes)重新运行项目看效果

重要说明:启动服务的时候必须用npm run start启动,代理才生效,如果用ng serve启动代理不生效

这就是最后效果啦,完成!

Top