[Flask/AJAX/HTTP] CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

 

Flask를 이용해 웹 개발을 하다가, JQuery이용해서 AJAX요청을 보내다가 생긴 에러로, 요청은 정상적으로 보내지지만 응답은 오지 않았다.

서버에 CORS관련 설정이 없어서 발생하는 것으로 보였다.

 

1. flask cors 추가

1) flask-cors 설치

pip install flask-cors

 

2) flask-cors import

app.py

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)

CORS(app)
# 만약 인증 같은 credentials를 포함한 정보가 오고간다면
# CORS(app, support_credentials=True, origins='localhost:80')

if __name__ == '__main__':
    app.run('0.0.0.0', port=80, debug=True)

CORS를 import하고, CORS(app)을 app.py에 추가하면 된다.

 

옵션이 없으면 모든 도메인으로부터 접근을 허용한다.

support_credentials: credential 정보의 오고감을 허용

origins: 접근을 허용하는 도메인(여러 개 설정 가능)

 

참고로 support_credentials를 true로 사용하려면 origins를 보안상의 이유로 필수로 추가해야한다.

flask-cors 공식 문서에도 명시되어있다.

 

 

2. flask-cors추가하고 import도 완료했는데 에러가 발생한다.

나의 경우 에러 메시지가 2개가 떴고, 아래에 보면 500에러가 뜬다. 이럴 때는 CORS에러가 난 부분의 url(검정색 블러칠한 부분)을 클릭하면 내부 에러 페이지가 나온다. 내부 에러도 CORS에러가 같이 뜨니까 함수를 확인하자.