Nodejs-ajax跨域

2019-03-31

const http=require('http');

let allowOrigin={
  'http://localhost': true,
  'http://aaa.com': true,
  'https://aaa.com': true,
}

http.createServer((req, res)=>{
  let {origin}=req.headers;

  if(allowOrigin[origin]){
    res.setHeader('access-control-allow-origin', '*');
  }

  res.write('{"a": 12, "b": "Blue"}');
  res.end();
}).listen(8080);

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <script>
    window.onload=function (){
      let oBtn=document.getElementById('btn1');

      oBtn.onclick=function (){
        let ajax=new XMLHttpRequest();

        ajax.open('GET', 'http://localhost:8080/a', true);
        ajax.send();

        ajax.onreadystatechange=function (){
          // readyState 0~4
          // 0：初始化	1：已连接 2：已发送 3：响应头已经接收到 4：相应体已经接受
          if(ajax.readyState==4){
            if(ajax.status>=200 && ajax.status<300 || ajax.status==304){
              alert('成功');
              let json=JSON.parse(ajax.responseText);
              console.log(json);
            }else{
              alert('失败');
            }
          }
        };
      };
    };
    </script>
  </head>
  <body>
    <input type="button" value="请求" id="btn1">
  </body>
</html>

ajax为什么不能跨域？

SOP：同源策略，你代码请求的资源应该和你在一个域名下，如果不是，浏览器会禁止这个请求。

ajax是被谁阻止住的？

不是服务器，是浏览器阻止的，这是浏览器的一种”自律”的行为。

服务器是一定会响应的，响应后如果不是同源，浏览器会把这个东西扔掉。

所以这个时候需要服务器返回数据的时候需要声明一下，声明我们是一家子(就是声明哪些人可以从我这里获取数据)，如上代码。