Spring boot - ajax 통신시 발생하는 문제 - SOP(Same Origin Policy) Feat. Synology NAS

우선, SOP가 뭐냐? wiki 백과 왈 ~
In computing, the same-origin policy is an important concept in the web application security model. Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web pages have the same origin

same-origin policy는 웹어플리케이션 보안 모델에서 중요한 개념이라고 한다.
웹 브라우저는 첫 번째 웹 페이지에 포함 된 스크립트가 두 번째 웹 페이지의 데이터에 접근하는 것을 허용하지만 두 웹페이지 모두 동일한 출처를 갖는 경우에만 허용된다고 한다.


그렇다면 , 동일한 출처가 뭐냐?
프로토콜/호스트/포트 가 동일한가 라고 한다.
예를들어, http://abc.dfg.com/temp/index.html 과 동일한 출처를 알아보자.

http://abc.dfg.com/temp/login.html    =>  동일한 출처.
http://abc.dfg.com/temp2/fake.html   =>  동일한 출처.

https://abc.dfg.com/temp/real.html    =>  프로토콜이 다르다. 따라서 동일한 출처가 아니다.
http://abc.dfe.com:123/temp/isReal.html   => 포트가 다르다. 따라서 동일한 출처가 아니다.
http://dfe.abc.com/temp/good.html   =>   호스트가 다르다.   따라서 동일한 출처가 아니다.



넘어가서,, 내가 맞닥뜨린 문제는.. 아래이다.

현재 나는 synology에 apache http 서버와 tomcat was 서버를 동시에 돌리고 있다.
그리고 문제가 발생하는 구조는
http://ndgndg91.synology.me   ==> http://ndgndg91.synology.me:7070/accbook-0.0.1/user/login
으로 요청하고 있다.

이 과정에서 SOP를 따르고 있지 않다.

프로토콜, 호스트가 같지만 포트(8080 != 7070)가 다르다.

tomcat에 올라가 있는 어플리케이션은 spring boot로 만들었다.
Apache에서도 설정을 해주었다.
따라서 이에 대한 해결 방안을 적어본다.


Apache 설정
Synology NAS를 기준으로 설명하려고 한다.
이미 ssh 접속이 가능하게 하는 설정은 다 되어있다고 여기고 생략한다.

ssh admin@자기호스트.synology.me (NAS의 DDNS와 관리자아이디 입력)
패스워드는 DSM의 admin 패스워드와 동일

(root 권한으로 로그인)
sudo -i

(아파치 설정파일 수정)
vi /volume1/@appstore/Apache2.4/usr/local/etc/apache24/conf/httpd24.conf

(httpd24.conf에 다음설정구문 추가하여 저장)
아래 vi editor 사용법 참고

<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-headers "Range"
Header set Access-Control-Expose-headers "Date, Content-Length, Content-Range"
</IfModule>

(아파치 재시작)
synoservice --restart pkgctl-Apache2.2

참고 : http://www.academyck.com/synology_set.txt

Spring boot 설정

아래와 같이 Global 설정
@Configuration
public class WebMVCConfigurer implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
    registry.addMapping("/**")
            .allowedOrigins("http://ndgndg91.synology.me")
            .allowedMethods(HttpMethod.POST.name())
            .allowCredentials(false)
            .maxAge(3600);}
}


아래와 같이 Controller 단에서 설정
@CrossOrigin("http://ndgndg91.synology.me")
@RestController@RequestMapping(value = "/user")
@Api(value = "UserController", description = "사용자 관련 API",basePath = "/user")
public class UserController {



이상 허접의 블로깅이였습니다.

댓글

이 블로그의 인기 게시물

About JVM Warm up

About idempotent

About Kafka Basic

About ZGC

sneak peek jitpack

Spring Boot Actuator readiness, liveness probes on k8s

About Websocket minimize data size and data transfer cost on cloud

About G1 GC

대학생 코딩 과제 대행 java, python, oracle 네 번째