REST API, CORS 에러 해결방법

이 글은 AJAX를 다룬 글과 함께 보면 좋을 듯하다.
원래 AJAX를 다루며 한 글에 작성하려했으나, 최근 CORS에러를 직접 겪고 해결방법을 찾아보다가 글을 따로 분리했다.

 

1. REST API

   ▪  RESTful API는  두  컴퓨터  시스템이  인터넷을  통해  정보를  안전하게  교환하기  위해  사용하는  인터페이스
   ▪  REST(Representational State Transfer)는 API 작동 방식에 대한 조건을 부과하는 소프트웨어 아키텍처
   ▪  작동방식
      1) 클라이언트가  서버에  요청  전송
      2) 서버가  클라이언트  인증  후  클라이언트에게  해당  요청  수행할  수  있는  권한  있나  확인
      3) 서버가  요청  수신  후  내부적으로  처리
      4) 서버가  클라이언트에  응답  반환(응답  요청  성공여부, 상태  코드  등  포함)
         ➢   응답  종류
            ▪  200: 일반  성공  응답
            ▪  201: POST 메서드  성공  응답
            ▪  400: 서버가  처리할  수  없는  잘못된  요청
            ▪  404: 리소스를  찾을  수  없음

---

 

2. CORS (Cross Origin Resource Sharing, 교차  출처  리소스  공유)

1) CORS관련 개념
   ▪  웹  보안  정책: SOP(Same Origin Policy), CORS(Cross Origin Resurce Sharing)
   ▪  SOP는  같은  출처에서만  리소스를  공유할  수  있다. 즉, 프로토콜, 호스트, 포트가  동일해야한다.
   ▪  프로토콜, 호스트, 포트가  하나라도  다르다면, CO(Cross Origin)
   ▪  교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS)는 추가 HTTP 헤더를 사용하여, 한 출처 에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제
   ▪  웹  애플리케이션은  리소스가  자신의  출처(도메인, 프로토콜, 포트)와  다를  때  교차  출처  HTTP 요청을  실행
   ▪  CORS(Cross-origin 리소스  공유)는  브라우저에서  실행  중인  스크립트에서  시작되는  cross-origin HTTP 요청을  제한하는  브라우저  보안  기능.
   ▪  REST API의  리소스가  비  단순  cross-origin HTTP 요청을  받을  경우  CORS 지원을  활성화해야한다.
   ▪  즉, 외부서버에  요청한  데이터를  브라우저에  받아오려면, cross-origin HTTP요청을  허가해야한다.

 

 

2) CORS 형식 

Access to XMLHttpRequest at from '요청을 받은 주소 ' origin '요청한 주소' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

 

<CORS에러 예시>

포트가 서로 다른 jsp파일끼리 통신하려다 CORS를 맞닥뜨린 모습이다.
8088포트에서 8089포트로 jsp파일 통신을 요청했는데 CORS로 인해 거절당했다.😅
에러는 console 창에서 확인할 수 있다.

 

 

 

3) CORS 에러 해결방법

CORS에러 해결방법에는 참 다양한 방법이 있다. 
그 중 프록시 서버를 통해 우회하는 방법도 있고하던데, 내 경우에는 내 서버끼리만 통신하면 되므로 데이터가 있는 8089 서버에 8088서버가 접근할 수 있게 해줬다.
8089포트를 쓰는 서버에 있는 jsp파일의 상단에 response로 시작하는 코드 한 줄만 추가해서 간단하게 해결했다.

<?xml version="1.0" encoding="UTF-8"?>
<%@ page contentType="text/xml; charset=utf-8" %>
<%@ page import="java.sql.*,javax.sql.*,java.io.*,java.net.*" %>
<%
//CORS error solve
response.setHeader("Access-Control-Allow-Origin","http://192.XXX.X.XX:8088");
%>

 

 

 

참고 자료
w3schools
mozilla
Dev scroll
aws 
365일 24시간 초보:티스토리