前后端分离开发时,需要进行http请求后端,这时刚会遇上跨域问题。
解决方法之一就是使用proxy代理
ng proxy是基于webpack proxy, 更详尽说明:https://webpack.js.org/config...
1. proxy.conf.json
在项目根目下添加文件:proxy.conf.json
示例:
{
"/api": {
"target": "http://localhost:8089/",
"secure": false,
"pathRewrite": {
"^/api": ""
},
"changeOrigin": true,
"loglevel": "debug"
}
}
示例说明:
对所有/api/*
的请求,转发到http://localhost:8089/
上
-
target
,一般是后端服务地址 -
pathRewrite
,重写url路径。效果就是前端统一请求后端时使用/api/
,而实际代理时则无此关键字。 -
changeOrigin
,如果你的后端服务不是localhost
,则需把此项设为true
-
loglevel
,日志级别。包括 debug, info, warn, error, and silent (默认 info)
2. 启动代理
ng cli 启动项目时会检查是否存在代理文件proxy.conf.json
,所以可不需配置启动项目
$ ng serve
如果你新增了其他代理文件,也可以指定文件进行启动
$ ng serve --proxy-config proxy.conf.json
这就完成了代理后端的配置了,使用代理也解决了跨域访问的问题。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。