Nodejs教程18：Ajax跨域

阅读更多系列文章请访问个人GitHub博客，示例代码请访问这里。

Ajax跨域问题的产生缘由

Ajax请求没法跨域，在前端开发中是个常见问题，它的产生缘由是，在浏览器接收服务端返回数据时，会检查该数据是否和当前发起请求的网址在同一域名下。若不是，则会丢弃该数据，并返回一个跨域错误。

在Ajax请求中，遵循以下流程：

网页提交一个Ajax请求到浏览器，浏览器将请求发至服务器，服务器接收到请求后，返回响应数据给浏览器（服务器一般不会对域名进行区分），浏览器接收到响应数据时，检测返回数据的域名是否和当前页面域名相同，若相同则将数据返回给网页，不一样则丢弃数据。

Ajax跨域的处理方法

既然跨域问题的产生缘由在于浏览器的限制，那么网页端在请求时没法主动规避，此时就须要服务端进行处理。

服务端只须要在响应Ajax请求时，在请求头中加入一个Access-Control-Allow-Origin属性，并设置为*（表示所有域名）或者当前域名就能够让浏览器再也不进行限制。

如下示例能够经过/lesson18/ajax.html文件发起Ajax请求测试。

示例代码：/lesson18/server.js

const http = require('http')

const server = http.createServer((req, res) => {
  console.log(req.headers.origin)
  res.setHeader('Access-Control-Allow-Origin', '*')
  res.write(`{"resultCode": "0000", "msg": "success"}`)
  res.end()
})

server.listen(8080)
复制代码

固然在实际项目中，不能够简单地设置res.setHeader('Access-Control-Allow-Origin', '*')，而是要经过req.headers.origin判断发起请求的域名是否合法，再设置Access-Control-Allow-Origin属性，以避免出现安全问题。