同源策略防跨域解决方案

跨域

由于同源策略导致的不同源网站间页面脚本无法互相访问。

同源策略

出于安全性考虑,一个网站的脚本不能访问另一个网站的请求。除非它们的协议号,域名,端口号相同。

防跨域

同源策略条件过于严苛,很多网站都有子域名,这样就造成了互相通信不便的问题。

解决方案

一.document.domain

document.domain只能实现一级域名相同的防跨域。

如:www.sojson.com 下指到sojson.com 是可以的。

  icp.sojson.com 下指到 sojson.com 是可以的。

  www.sojson.com 下指到 www.baidu.com 是不行的。

  sojson.com 指到 baidu.com 还是不行的。

实例

1.需求:

比如我们要在当前页面下,“www.sojson.com/shiro” 下上传图片到 "cdn.sojson.com/images/" 下去。直接搞肯定是不行的。

2.在请求“www.sojson.com/shiro” 的时候,写上如下代码:

if(document.domain !=‘sojson.com‘){
document.domain = ‘sojson.com‘;
}

3.然后在上传的地址“cdn.sojson.com” 的Iframe 文件内写上一样的代码。

if(document.domain !=‘sojson.com‘){
document.domain = ‘sojson.com‘;
}

二.jsonp

jsonp是利用script标签没有同源策略限制的属性实现的。jsonp只能发送GET请求。

客户端:

$.ajax({
     url: "http://otherdomain.com/manage/role/get",
     async: false,
     type: "get",
     dataType: "jsonp",
     data:{
        "id":1
     },
     jsonp: "callback",
     jsonpCallback:"fn",
     success: function(data){
         alert(data.code);
     },
     error: function(){
         alert(‘fail‘);
     }
})

服务端:

return HttpResponse("fn(outputData)")

注意内容:

1、Ajax请求需要设置请求类型为Jsonp

dataType: "jsonp"

2、Ajax请求需要设置回调函数,当前函数值必须与服务器响应包含的callback名称相同

jsonpCallback:"fn"

3、Ajax请求可以设置jsonp(可选),传递给请求处理程序或页面,用以获得jsonp回调函数名的参数名,默认为:callback

jsonp: "callback"

4、服务端返回Json数据必须使用jsonpCallback设置的值进行包裹

return HttpResponse("fn(outputData)")

三.CORS

cors只设置服务端允许白名单网站访问即可。

# 服务器添加响应头headers
Access-Control-Allow-Origin: http://a.com

补充:django-cors-headers

安装

pip install django-cors-headers

添加应用

INSTALLED_APPS = (
    ...
    ‘corsheaders‘,
    ...
)

中间层设置

MIDDLEWARE = [

// 必须在最前面 只有允许跨域请求,后面的中间件才能被执行
    ‘corsheaders.middleware.CorsMiddleware‘,
    ...
]

添加白名单

# CORS
CORS_ORIGIN_WHITELIST = (
    ‘127.0.0.1:8080‘,
    ‘localhost:8080‘,
    ‘www.meiduo.site:8080‘,
    ‘api.meiduo.site:8000‘
)

CORS_ALLOW_CREDENTIALS = True # 允许携带cookie

原文地址:https://www.cnblogs.com/LTEF/p/9833860.html

时间: 2024-10-08 08:26:34

同源策略防跨域解决方案的相关文章

同源策略和跨域解决方案

同源策略 一个源的定义 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相同的源. 举个例子: 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: URL 结果 原因 http://a.xyz.com/dir2/other.html 成功   http://a.xyz.com/dir/inner/another.html 成功   https://a.xyz.com/secure.html 失败 不同协议 ( https和http ) h

浏览器的同源策略及跨域解决方案

同源策略 一个源的定义 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相同的源. 举个例子: 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: URL 结果 原因 http://a.xyz.com/dir2/other.html 成功   http://a.xyz.com/dir/inner/another.html 成功   https://a.xyz.com/secure.html 失败 不同协议 ( https和http ) h

同源策略、跨域解决方案

一.定义 1.什么是源? 源(origin)就是协议.域名和端口号.以上url中的源就是:http://www.company.com:80若地址里面的协议.域名和端口号均相同则属于同源.以下是相对于 http://www.a.com/test/index.html 的同源检测? http://www.a.com/dir/page.html ----成功? http://www.child.a.com/test/index.html ----失败,域名不同? https://www.a.com/

Django - - 同源策略和跨域解决方案

目录 同源策略 一个源的定义 同源策略是什么 举个例子 jQuery中getJSON方法 JSONP应用 1, 同源策略 1.1 一个源的定义 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相同的源. 举个例子: 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: URL 结果 原因 http://a.xyz.com/dir2/other.html 成功 http://a.xyz.com/dir/inner/another.html 成

【转】同源策略和跨域请求解决方案

一.一个源的定义 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相同的源.举个例子: 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: URL 结果 原因 http://a.xyz.com/dir2/other.html 成功 协议,端口(如果有指定)和域名都相同 http://a.xyz.com/dir/inner/another.html 成功 协议,端口(如果有指定)和域名都相同 https://a.xyz.com/secure

解说同源策略和跨域访问

尽管浏览器的安全措施多种多样,但是要想黑掉一个Web应用,只要在浏览器的多种安全措施中找到某种措施的一个漏洞或者绕过一种安全措施的方法即可.浏览器的各种保安措施之间都试图保持相互独立,但是攻击者只要能在出错的地方注入少许JavaScript,所有安全控制几乎全部瓦解--最后还起作用的就是最弱的安全防线:同源策略.同源策略管辖着所有保安措施,然而,由于浏览器及其插件,诸如Acrobat Reader.Flash 和Outlook Express漏洞频出,致使同源策略也频频告破. 既然web应用的最

浏览器的同源策略和跨域访问

1. 什么是同源策略 理解跨域首先必须要了解同源策略.同源策略是浏览器上为安全性考虑实施的非常重要的安全策略.    何谓同源:        URL由协议.域名.端口和路径组成,如果两个URL的协议.域名和端口相同,则表示他们同源.    同源策略:        浏览器的同源策略,限制了来自不同源的"document"或脚本,对当前"document"读取或设置某些属性.        从一个域上加载的脚本不允许访问另外一个域的文档属性. 举个例子:      

11. cookie_session_原生ajax_readyState的值_同源策略_跨域_jsonp的使用

1. cookie 浏览器存储技术.(服务器将少量数据交于浏览器存储管理) 作用: 存储数据, 解决 http 协议无状态问题 工作流程: 浏览器发送请求给服务器,请求登录 服务器返回响应给浏览器,此时携带了cookie(其中包含着当前用户的唯一标识) 浏览器接受到响应中cookie,得保存下来 浏览器下一次发送请求时,会自动携带上cookie, 服务器接受到请求,解析cookie,从而判断是哪个用户发送的请求(解决http协议无状态问题) 服务器端的使用: 设置cookie        re

同源策略和跨域-总结

目录: 1.同源策略 2.跨域 3.几种跨域技术 1.同源策略 什么叫同源? URL由协议.域名.端口和路径组成,如果两个URL的协议.域名和端口相同,则表示他们同源.相反,只要协议,域名,端口有任何一个的不同,就被当作是跨域. e.g. 对于http://store.company.com/dir/page.html进行同源检测: URL 结果 原因 http://store.company.com/dir2/other.html 成功 仅路径不同 http://store.company.c