zoukankan      html  css  js  c++  java
  • 关于跨域的理解

    列举几种后端通讯的方法及其使用的场景 以及对跨域的理解

    1.后端程序可以通过session来进行通讯,session有过期时间,主要用于验证码的验证,登录过期等的应用。

    2.数据库,数据库支持多种语言的操作,那么通过数据库就可以通讯。

    关于跨域:

    跨域请求存在的原因:由于浏览器的同源策略,即属于不同域的页面之间不能相互访问各自的页面内容。
    跨域的场景:
    1.域名不同 www.yangwei.com 和www.wuyu.com 即为不同的域名)
    2.二级域名相同,子域名不同(www.wuhan.yangwei.com www.shenzheng.yangwei.com 为子域不同)
    3.端口不同,协议不同 ( http://www.yangwei.com 和https://www.yangwei.com属于跨域www.yangwei.con:8888和www.yangwei.con:8080)
    跨域的方式:(内容较多,需掌握CORS和jsonp,其他内容也要了解)
    1.前端的方式: possMessage,window.name,document.domain,image.src(得不到数据返回),jsonP(script.src后台不配合得不到数据返回),style.href(得不到数据返回)
    —. image.src,script.src,style.href 不受同源策略的影响可以加载其他域的资源,可以用这个特性,向服务器发送数据。最常用的就是使用image.src 向服务器发送前端的错误信息。image.src 和style.href 是无法获取服务器的数据返回的,script.src 服务器端配合可以得到数据返回。
    二. possMessage,window.name,document.domain 是两个窗口直接相互传递数据。
    (1)possMessage 是HTML5中新增的,使用限制是 必须获得窗口的window 引用。IE8+支持,firefox,chrome,safair,opera支持
    (2)window.name ,在—个页面中打开另—个页面时,window.name 是共享的,所以可以通过window.name 来传递数据,window.name的限制大小是2M,这个所有浏览器都支持,且没有什么限制。
    (3) document.domain 将两个页面的document.domain 设置成相同,document.domain 只能设置成父级域名,既可以访问,使用限制:这顶级域名必须相同
    2.纯后端方式: CORS,服务器代理
    CORS 是w3c标准的方式,通过在web服务器端设置:响应头Access—Cntrol—Alow—Origin 来指定哪些域可以访问本域的数据,ie8&9(XDomainRequest),10+,chrom4 ,firefox3.5,safair4,opera12支持这种方式。
    服务器代理,同源策略只存在浏览器端,通过服务器转发请求可以达到跨域请求的目的,劣势:增加服务器的负担,且访问速度慢。
    处理Ajax跨域

    当我们在访问一个Ajax请求,控制台出现如下错误时,我们基本可以判断,是被跨域拦截了:

    MLHttpRequest cannot load xxxxx. No 'Access-Control-Allow-Origin' header is present on the requested resource. 
    

    几种常见请求错误

    • Access-Control-Allow-Origin: origin | '' 允许某个指定的域访问,表示不限制域。
    • Access-Control-Allow-Methods: 'GET,POST,PUT,DELETE' 允许哪些类型的请求
    • Access-Control-Allow-Headers: 'x-token' 允许的自定义Header。
      注意:该方式由服务端设置,前端无需设置,也无法设置。只要服务端处理好了,前端不需要做任何处理即可使用。

    3.前后端结合:JsonP
    script.src 不受同源策略的限制,所以可以动态的创建script标签,将要请求数据的域写在src 中参数中附带回调的方法,服务器端返回回调函数的字符串,并带参数。
    如 script.src="http://www.yangwei.com/?id=001&callback=getInfoCallback",服务器端返回 getInfoCallBack("name:yangwei;age:18") 这段代码会直接执行,在前面定义好getInfoCallBack函数,既可以获得数据并解析。 这种是最常见的方式。
    4.webSocket(了解性拓展)
    服务端推送websocket和sse场景及应用
    应用场景
    都可以进行服务端推送,并且都是使用长连接来进行.但两者的实现又有—点不同,sse仍使用http协议,并且使用相同的链接发送正常的http协议报文.而websocket是使用http协议进行握手,然后再使用同—个链接进行websocket协议的通信.

  • 相关阅读:
    我的友情链接
    我的友情链接
    区块链:权益证明设计哲学
    区块链:权益证明与错误的工程思维
    区块链:Ethereum Casper 101
    区块链:Casper 机制的历史起源-第五篇
    区块链:Casper 机制的历史起源-第四篇
    区块链:Casper 机制的历史起源-第三篇
    区块链:Casper 机制的历史起源:第二篇
    区块链:Casper 机制的历史起源:第一篇
  • 原文地址:https://www.cnblogs.com/heson/p/10015794.html
Copyright © 2011-2022 走看看