在我们实际开发过程中，跨域问题是比较常见的，常见的跨域方法大家也都比较熟悉了。项目使用webpack打包时，我们也可以采用webpack的devServer提供的proxy进行跨域代理配置，相关配置文档和网上有各种的教程，也是比较简单的，但是实际在配置过程中，很多人都遇到了各种各样的问题，然而到最后发现，问题产生的原因其实非常简单，在此简单记录下。
在本地模拟下数据请求
//server.js
const express = require('express')
let app = express()
app.get('/api/user', (req, res)=>{
res.json({msg: '我是返回数据'})
})
app.listen(3002)
console.log('listen 3002...')//index.js
var ajax = new XMLHttpRequest();
ajax.open('get', '/api/user');
ajax.send()
ajax.onreadystatechange = function(){
if(ajax.readyState == 4 && ajax.status == 200){
console.log(ajax.responseText)
}
}配置webpack的proxy代理
//webpack.config.js
......
devServer: {
port: 8082,
open: true,
compress: true,
proxy: {
'/api': {
target: 'http://localhost: 3002',
changeOrigin: true,
pathRewrite: {
'^/api': '/api'
}
}
}}配置完成，执行 npm run sever，打开页面，控制台很喜庆的红色出现了
回去查看代码逻辑，没有发现问题，只好向网络发起请求~
经过反复查询，产生此类问题的原因主要有以下几点：
（1）、target没有添加‘http://’
（2）、target配置的地址要能够访问，否则也会报错(404)
（3）、http代理有缓存问题（很多人遇到，没有太好的办法，可以尝试修改端口号）
（4）、node配置的服务，没有启动服务
（5）、手动再次执行一次npm run dev
（6）、相关端口被占用
根据各位前辈的经验，逐一排查问题，发现没有启动node服务，执行 node server.js启动服务，打包，重启服务，依旧报错！
各位前辈的坑都已经排查过了，没有发现问题；逻辑上也没有问题，那一定是代码书写上有踩坑了，经过大半天的检查，最终发现一个小问题（也是编码习惯问题）,见图~
localhost的冒号后边有个空格，去掉空格，重启服务，数据成功请求！
这个问题产生也是个人习惯问题，平时输入冒号习惯性敲一下空格，对于一般js没有问题，但是对于url会有很大区别，填坑的同时也记录一下！
