web前端Ajax实现跨域访问的二种情势

By admin in web前端 on 2019年5月19日

一、什么是跨域

大家先想起一下域名地址的组合:

http:// www . google : 8080 / script/jquery.js

      http:// (协议号)

               www  (子域名)

             google (主域名)

               8080 (端口号)

script/jquery.js (请求的地方)

* 当协议、子域名、主域名、端口号中随便1各不一样样时,都算不相同的“域”。

* 差别的域之间相互请求财富,就叫“跨域”。

比如: 请求

二、管理跨域的方法一 — 代理(这几个方法相比较“笨” 故不做详细介绍)

诸如在京城(www.beijing.com/sever.php)和上海(www.shanghai.com/sever.php)各有三个服务器,香港的后端(www.beijing.com/sever.php)直接待上访京的服务,然后把收获的响应值再次来到给前端。也正是首都的劳动在后台做了多个代理,前端只供给拜访东京(Tokyo)的服务器也就1二分与走访了法国首都的服务器。这种代理属于后台的手艺,所以不开始展览叙述。

叁、管理跨域的方式二 — JSONP

假设在这一个页面中向交由GET请求,那么大家在www.aaa.com页面中增多如下代码:

  var eleScript= document.createElement("script"); //创建一个script元素

  eleScript.type = "text/javascript"; //声明类型、

  eleScript.src = "http://www.bbb.com/getinfo.php"; //添加src属性 引入跨域访问的url

  document.getElementsByTagName("HEAD")[0].appendChild(eleScript); //在页面中添加新创建的script元素

当GET请求从归来时,能够回到一段JavaScript代码,这段代码会活动推行,可以用来担负调用页面中的贰个callback函数。看下边三个列子:

在www.aaa.com页面中:

<script>

  function jsonp( json ){

    document.write( json.name ); //输出周星驰

}

<script>

<script src="http://www.bbb.com/getinfo.php"></script>

在www.bbb.com页面中:

  jsonp({ “name”:”周星驰”,”age”:45 });

也正是在www.aaa.com页面中表明,在web前端,www.bbb.com页面中调用。然而JSONP只扶助“GET” 请求,但不帮助 “POST” 请求。

叁、管理跨域的方法二 — XH奥迪Q7贰(推荐方法)

“XHPRADO二” 全称 “XMLHttpRequest Level二”
是HTML5提供的主意,对跨域访问提供了很好的支撑,并且还有局地新的功用。

* IE10刹那间的版本都不帮忙

* 只必要在劳务器端底部加上上边两句代码:

  header( “Access-Control-Allow-Origin:*” );

  header( “Access-Control-Allow-Methods:POST,GET” );

关于 “XH瑞虎二”
的愈来愈多新闻大家能够查阅官方文书档案,在此地就不详细描述了,由此可见那是以此很好用的章程。

上述所述正是本文的全部内容了,希望大家能够欣赏。

您只怕感兴趣的小说:

  • Ajax
    设置Access-Control-Allow-Origin完毕跨域访问
  • 化解ajax不能够访问当守田件难题(利用js跨域原理)
  • AJax与Jsonp跨域访问难点总结
  • JSONP跨域GET请求消除Ajax跨域访问难点
  • 浅谈Ajax跨域Session和跨域访问
  • Ajax跨域代理访问网络能源的达成代码
  • JQuery Ajax
    跨域访问的消除方案
  • 化解AJAX中跨域访问现身”未有权限”的荒谬
  • Ajax达成跨域访问最新化解方案

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图
Copyright @ 2010-2019 澳门新葡亰官网app 版权所有