[web]CORS(Cross Origin Resource Sharing)

기본적으로 웹에서 사용하는 HTTP request는 기본적으로 다른 도메인(서버)에 데이터를 요청할 수 있다.

예) 내가 만든 html파일에서 구글 사진을 들고올 수 있음.

[www.google.co.kr/logos/doodles/2021/international-womens-day-2021-6753651837108879.6-s.png]

또는 css파일 역시 불러와서 사용이 가능함. 하지만, 스크립트 태그로 둘러싸인 스크립트 코드에서 실행되는 HTTP request 는 본인 서버에만 요청할 수 있음

<script></script>

정확하게 말하자면 프로토콜, 호스트명, 포트번호 모두가 동일해야 함. 이를Same Origin Policy라고 한다.

ajax(옛날에 많이 썼던 라이브러리), axios 와 같이 스크립트 태그안에서 HTTP request 를 보낼 수 있는 기능이 생김에 따라,
스크립트 태그 안에서도 다른 사이트의 데이터 요청을 지원해야 한다라는 요구가 생겨, CORS 라는 가이드가 마련됨 (각 언어별 구현)

pip install flask_cors 설치 후

from flask_cors import CORS

app = Flask(__name__)
CORS(app) # 이와 같이 선언해주면 전 요청/응답 헤더에 CORS 지원 헤더 정보를 넣어서, CORS 를 지원해줌, 쉽게 말해 cors에 app객체를 넣어 허락을 받음

에러 표시:
HTTP Response 의 헤더에 Access-Control-Allow-Origin 관련 정보가 없으므로 브라우저 정책에 따라 Cross Domain 을 허용하지 않음

Access to XMLHttpRequest at 'http://localhost:5000/payment/verify' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

+ 헷갈리는 부분

@app.route("/google")
def get_google():
    response = requests.get("http://www.google.co.kr") #google 사이트의 요소들을 response 변수에 담고
    return response.text #이를 텍스트 파일 형식으로 리턴하여 해당 루트로 들어올 경우 띄운다.


#결과를 본다면 전반적인 사이트 요소들은 보여지지만 사진, 기타 아이콘 등은 보이지 않는데 CORS 보안문제와 관련있는 건가???