作家
登录

前端跨域请求原理及实践

作者: 来源: 2017-05-25 11:45:23 阅读 我要评论

如不雅让 办事器3000 上的页面向 办事器 3001 提议请求会如何呢?

浏览器的同源策略,出于防备跨站脚本的进击,禁止客户端脚本(如 JavaScript)对不合域的办事进行跨站调用。

一般的,只要网站的 协定名protocol、 主机host、 端标语port 这三个中的随便率性一?不合,网站间的数据请求与传输便构成了跨域调用。这也是我们下面实践的理论基本。我们应用 NodeJs 创建了两个办事器,分别监听 3000、 3001 端口(下面简称 办事器3000 与 办事器3001 ),因为端标语不一样,这两个办事器以及办事器上页面通信构成了跨域请求。

在办事器3000 上有如下的页面:

办事器3000 上的请求页面中包含如下 JavaScript 代码:

  1. $(function() { 
  2.  
  3.     $("#submit").click(function() { 
  4.  
  5.         var data = { 
  6.  
  7.             name: $("#name").val(), 
  8.  
  9.             id: $("#id").val() 
  10.  
  11.         }; 
  12.  
  13.         $.ajax({ 
  14.  
  15.             type: 'POST'
  16.  
  17.             data: data, 
  18.  
  19.             url: 'http://localhost:3000/ajax/deal'
  20.  
  21.             dataType: 'json'
  22.  
  23.             cache: false
  24.  
  25.             timeout: 5000, 
  26.  
  27.             success: function(data) { 
  28.  
  29.                 console.log(data) 
  30.  
  31.             }, 
  32.  
  33.             error: function(jqXHR, textStatus, errorThrown) { 
  34.  
  35.                 console.log('error ' + textStatus + ' ' + errorThrown); 
  36.  
  37.             } 
  38.  
  39.         }); 
  40.  
  41.     }); 
  42.  
  43. });  

办事器3000 对应的处理函数为

请求页面返回结不雅:

一、 跨域请求的含义

 1/7    1 2 3 4 5 6 下一页 尾页

  推荐阅读

  PinDemonium通用动态脱壳工具

一、简介本文是对16年的blackhat大年夜会上PinDemonium通用动态脱壳对象介绍。1. 通用脱壳对象简介通用脱壳对象可以经由过程以下办法实现: -debuggers -kernel modules -hyperv>>>详细阅读


本文标题:前端跨域请求原理及实践

地址:http://www.17bianji.com/lsqh/35417.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)