• JavaScript跨源资源共享


     CORS(跨 源资源共享)基本思想,就是使用自定义的HTTP头部让浏览器与服务器进行沟通,从而决定请求或响应式应该成功还是失败

    IE对CORS的实现

    IE8引入了XDR类型,与XHR类似,但可以实现安全可靠的跨域通信。

    两者不同之处:

    • cookie不会随请求发送,也不会响应返回
    • 只能设置请求头部信息中的Content-Type字段
    • 不能访问响应头部信息
    • 只支持GET和POST请求

    使用方法时与XHR对象相似,创建xDomainRequest 实例,调用open(),再send().但open()方法只接受两个参数,请求的类型和URL。

    XDR请求都是异步执行的,请求返回之后触发load事件,响应数据保存在responseText属性中。如果失败(Access-Control-Allow-Origin头部)触发error事件。

    如:

    var xdr = new XDomainRequest();

    xdr.onload = function(){

          alert(xdr.responseText);

    }

    xdr.onerror = function(){

         alert("An Error Occured");

    }

    xdr.open("get","http://www.baidu.com/page/");

    xdr.sent(null);

    当用post传送资源时,通过contentType属性影响头部信息的唯一方式

    其他浏览器

      使用标准的XHR对象并在open()方法中传入绝对URL即可。还可支持同步请求。跨域XHR对象有一定的限制(安全限制)

    • 不能使用setRequestHeader()设置自定义头部
    • 不能发送和接收cookie
    • 调用getAllResponseHeaders()方法总会返回空字符串

    由于无论同源请求还是跨源请求都使用相同的接口,因此对于本地资源,最好使用相对URL,在访问远程资源时再使用绝对URL.

    XMLHttpRequest对象和IE中的XDomainRequest对象的共同的属性/方法:

    • abort():用于停止正在进行的请求。
    • onerror():用于替代onreadystatechange检测错误。
    • onload():用于onreadystatechange检测成功。
    • responseText:用于取得响应内容。
    • send():用于发送请求。

    以上成员都包含在createCORSRequest()函数返回的对象中,在所有浏览器中都正常使用。

    其他跨域技术

    1.图片ping

    2.JSONP

    3.comet

    4.sse(服务器发送事件)

    5.Web Socket 

    在程序媛的路上,越走越用劲儿:)
  • 相关阅读:
    JavaScript变量作用域和内存问题(二)
    引用类型之object类型
    浅谈javascript函数
    javascript变量,作用域和内存问题(一)
    js运动动画
    html css 模仿小米官网搜索框
    javascript实现网页日期和时间显示
    内联元素与内联块状元素
    表单新增元素和属性
    增强的页面元素
  • 原文地址:https://www.cnblogs.com/AliceX-J/p/5242760.html
Copyright © 2020-2023  润新知