CORS是什么?亦解释了在Django中配置CORS的方法
CORS是什么东西?
跨域资源共享(Cross-Origin Resource Sharing)简称为CORS,是指一种机制,允许自身域源决定是否共享来自其他域源的请求。
首先,「オリジン」是什么意思?
起源在中国
-
- スキーム
サイトによってはプロトコルと書かれていたりするが厳密には違う。しかし、Web開発においては基本httpかhttpsを使うのでプロトコルでも問題ない
FQDN
サイトによってはホストやドメインと書かれていたりするが厳密にはFQDNつまり完全修飾ドメイン名のこと
ポート
这是将所有元素组合在一起的东西。
为了防止一个网站的信息被另一个恶意的网站所滥用(如下所述),通常会应用同一源策略。
什么是同源政策?
資源(HTML、スクリプト、Cookieなど)を読み込んだ出自が異なる場合、ウェブブラウザによって制限され、異なるオリジン(クロスオリジンとも呼ばれる)の資源との通信・アクセスが制限されます。
これは、異なるオリジンから読み込まれた資源へのアクセスをブロックすることで、元のオリジンで読み込まれた資源に悪影響を与えないようにするセキュリティ機能です。
2つのオリジンの間での
-
- スキーム(プロトコル)
-
- FQDN(ホスト、ドメイン)
- ポート
只有在所有条件都相符的情况下,才能说它们属于同一起源。
同源的例子
http://example.com:8000/api/customers/1
http://example.com:8000/api/customers/2
http://example.com:8000/api/customers/1
http://example.com:8000/api/customers/2
尽管路径不同,但是方案、FQDN(完全限定域名)和端口相同,因此属于同一来源。
不属于同一个来源的例子(1)
http://example.com:8000/api/customers/1
例子点com:8000/api/customers/1
https://example.com:8000/api/customers/1
例子点com:8000/api/customers/1
由于协议不同(HTTP和HTTPS),所以不属于同一来源。
两个不同的例子(2)不具有相同的来源
http://example.com:8000/api/customers/1
http://example.com:8080/api/customers/1
http://example.com:8000/api/customers/1
http://example.com:8080/api/customers/1
因为端口不同(8000和8080),所以不属于同源。
如果没有同源策略会发生什么?
用户在网站中登录后,可能会因为跨站请求伪造(CSRF)或跨站脚本攻击(XSS)而收到来自其他恶意站点(不同源)发送的未经用户意愿的信息或请求,甚至执行外部的恶意脚本。
为什么需要CORS?
在将前端和后端分开开发时,通常会将它们放置在不同的源上。通过进行CORS设置,可以在遵守同源策略的同时,共享来自不同源(跨源)的请求。
安装所需的软件包
我将安装下面的内容。
pip install django-cors-headers
写出必要的设置说明
将以下内容写在Django的settings.py文件中。
# corsheadersを追加
INSTALLED_APPS = [
'corsheaders',
]
# corsheaders.middleware.CorsMiddlewareを追加
MIDDLEWARE = [
# 一番上に記載
"corsheaders.middleware.CorsMiddleware",
"django.middleware.security.SecurityMiddleware",
"django.contrib.sessions.middleware.SessionMiddleware",
"django.middleware.common.CommonMiddleware",
"django.middleware.csrf.CsrfViewMiddleware",
"django.contrib.auth.middleware.AuthenticationMiddleware",
"django.contrib.messages.middleware.MessageMiddleware",
"django.middleware.clickjacking.XFrameOptionsMiddleware",
]
# 自身以外のオリジンのHTTPリクエスト内にクッキーを含めることを許可する
CORS_ALLOW_CREDENTIALS = True
# アクセスを許可したいURL(アクセス元)を追加
CORS_ALLOWED_ORIGINS = (os.environ.get("TRUSTED_ORIGINS").split(" "))
# プリフライト(事前リクエスト)の設定
# 30分だけ許可
CORS_PREFLIGHT_MAX_AGE = 60 * 30
在env文件中,写下允许的origin。
TRUSTED_ORIGINS="http://localhost:3000"
这就是以上的内容。
在中国,只需要一个选择时,我的建议是参考。