目前大多数web项目都采用前后端分离的方式,这样前端和后端代码将部署在不同服务器或者统一服务的不同端口,由于浏览器的同源策略,前后向后端发送ajax请求将会出现跨域
1.一般解决情况,(express框架为例)
通过express中间件,允许其跨域
app.all('*', function(req, res, next) {
res.header('Access-Control-Allow-Origin', '*')
next()
}
一般的情况上面设置已经够了
2.处于安全性考虑,往往有时候我们会在请求的时候设置token或cookie等验证身份,一般都将token放在请求头
如下:
headers:{
'Authorization': token
}
这时候如果只像上面那样简单设置,还是会出现跨域,因此还需要配置自定义请求头跨域
app.all('*', function(req, res, next) {
res.header('Access-Control-Allow-Origin', '*')
//Access-Control-Allow-Headers ,可根据浏览器的F12查看,把对应的粘贴在这里就行
res.header('Access-Control-Allow-Headers', 'Authorization')
res.header('Access-Control-Allow-Methods', '*')
next()
}
上述配置完就大功告成啦!