有时候我们使用webpack在本地启动服务器的时候，由于我们使用的访问的域名是 http://localhost:8081 这样的，但是我们服务端的接口是其他的，
那么就存在域名或端口号跨域的情况下，但是很幸运的是 devServer有一个叫proxy配置项，可以通过该配置来解决跨域的问题，那是因为 dev-server 使用了 http-proxy-middleware 包。
假如现在我们本地访问的域名是 http://localhost:8081,
但是我现在调用的是百度页面中的一个接口，该接口地址是：http://news.baidu.com/widget?ajax=json&id=ad。现在我们只需要在devServer中的proxy的配置就可以了：如下配置：
因此所有的配置如下：
然后我们在main.js里面编写如下代码：
或者封装成api
在这里请求我使用 axios 插件，其实和jquery是一个意思的。为了方便就用了这个。
下面我们来理解下上面配置的含义：
1. 首先是百度的接口地址是这样的：http://news.baidu.com/widget?ajax=json&id=ad;2.
proxy 的配置项 '/api' 和 target: 'http://news.baidu.com' 的含义是，匹配请求中 /api
含有这样的域名 重定向 到 'http://news.baidu.com'来。因此我在接口地址上 添加了前缀 '/api', 如：
axios.get('/api/widget?ajax=json&id=ad'); 因此会自动补充前缀，也就是说，url:
'/api/widget?ajax=json&id=ad' 等价于 url: 'http://news.baidu.com/api/widget?ajax=json&id=ad'.3. changeOrigin: true/false 还参数值是一个布尔值，含义是 是否需要跨域。4. secure: true, 如果是https请求就需要改参数配置，需要ssl证书吧。5. pathRewrite: {'^/api' : ''}的含义是重写url地址，把url的地址里面含有 '/api' 这样的 替换成 '', 因此接口地址就变成了 http://news.baidu.com/widget?ajax=json&id=ad； 因此就可以请求得到了，最后就返回接口数据了。
如下图所示：
