基于Nodejs的跨域方法

  跨域一词从字面意思看,就是跨域名,但实际上跨域的范围绝对不止那么狭隘。具体概念如下:只要协议、域名、端口有任何一个不同,都被当作是不同的域。



  那我么如何实现跨域传输数据呢?一下就是三种比较简单的跨域方法,后台服务器是NodeJs

1.通过修改http请求头实现跨域


   通过在被请求服务器中添加Access-Control-Allow-Origin来实现跨域

//跨域被请求服务器的后端路由
router.get('/code',function (req, res) {
  res.header("Access-Control-Allow-Origin", "http://www.trysth.top/");
  var a = req.query;
  res.send("传回的数据");
});

   在前端页面用Ajax实现跨域请求即可

//前端请求页面
$.ajax({
  type:"POST",
    //url为跨域请求的服务器的地址
  url: "url/code",
  async:false,
  data:{
    name: name,
    psw:psw
  },
  success:function(msg){
    alert(msg);
  }
});

2.通过jsonp实现跨域


   通过jsonp实现跨域的代码

//跨域被请求服务器的后端路由
router.get('/code',function (req, res) {
  var _callback = req.query.callback;
  var _data = {
    email:'example@163.com',
    name:'jaxu'
  };
  if(_callback){
    res.type('text/javascript');
    res.send(_callback + '(' + JSON.stringify(_data) + ')');
  }else{
    res.json(_data);
  }
});

//前端请求页面
$.ajax({
  type:"get",
  url: "Http://www.trysth.top/code",
  async:false,
  cache:false,
  dataType:"jsonp",
  jsonp:"callback",
  data:{
    name: name,
    psw:psw
  },
  success:function(jsonp){
    alert(json.name);
  },
  error:function (e) {
       alert('error');
  }
});

3.创建XMLHttpRequest实现跨域


//跨域被请求服务器的后端路由
router.post('/code',function (req,res) {
  res.setHeader('Access-Control-Allow-Origin','*');
  res.send({name:'待传数据'});
});

//前端请求页面
var fun = function () {
  var xhr = new XMLHttpRequest();
  xhr.onload = function () {
    console.log(this.responeText);
  };
  xhr.open('post','Http://www.trysth.top/code',true);
  xhr.send();
};
lei Song wechat
欢迎关注我们的微信
坚持原创技术分享,您的支持将鼓励我继续创作!