CORS (Cross-Origin Resource Sharing) 란?

 

기본적으로 웹브라우저는 시큐리티상 다른 Origin(도메인, 프로토콜, 포트) 리소스에의 액세스를 불허한다. 주로 아래와 같은 효과가 있다.

 

1. API 주소만 안다고 하면 아무렇게나 액세스하여 데이터를 훔쳐갈 수 있는데 이를 방지하는 효과.

2. CSRF（Cross-Site Request Forgeries) 를 방지하는데 예를 들면 사용자가 특정 사이트에 로그인 상태에서 스팸메일의 악성 링크를 클릭하면 로그인 세션으로 API 에 접근하여 원치 않는 결과를 초래 할 수 있다.

 

위의 예에서는 웹 페이지는 example.com 으로 부터 발행되서 그 안에서 api.example.com/func 을 액세스하고 있지만 엄격히 말해 서브도메인도 별도의 도메인으로 취급되므로 아래와 같은 에러가 발생하게 된다.

 각각 다른 Address를 사용하는 Frontend(React) 와 Backend(Flask) 를 분리해서 개발하는 환경에서 CORS 는 골치아픈 일이 된다.

 

 Flask CORS 대응

pip install flask-cors

 

1. 전체 Origin을 허용하자고 하는 경우

GET method 의 경우

@app.route("/", methods=["GET"]) def get_example():     """GET in server"""     response = jsonify(message="Simple server is running")     # Enable Access-Control-Allow-Origin     response.headers.add("Access-Control-Allow-Origin", "*")     return response

 

POST, PUT, DELETE method 의 경우

@app.route("/", methods=["POST"]) @cross_origin() def post_example():     """POST in server"""     return jsonify(message="POST request returned")

 

또는 일괄적으로

from flask import Flask from flask_cors import CORS app = Flask(__name__) CORS(     app,     supports_credentials=True )

 

2. 특정 api 만 전체 Origin을 허용하는 경우

"/api/" 로 시작하는 패스는 허용

app = Flask(__name__) cors = CORS(app, resources={r"/api/*": {"origins": "*"}}) @app.route("/api/v1/users") def list_users():   return "user example"

 

3. 특정 도메인만 허용하는 경우 (white list)

CORS(app, origins=['http://allowed-domain1.com', 'http://allowed-domain2.com'])