문제점 프로젝트에서 nginx를 사용하기로 하여, nginx에 .vue 파일을 위치시키고 그 뒤에 springboot를 위치시켰다. nginx는 reverse proxy 역할을 하며, 클라이언트의 모든 요청을 받는다. 요청 URI가 /api로 시작하면 뒷단 springboot(proxy_pass 이용)로 요청을 보내고, /api로 시작하지 않는다면 vue router에게 URI에 해당하는 vue 페이지를 리턴하도록 한다. nginx.conf server{ location ^~/api{ proxy_pass http://127.0.0.1:8080; } } 이런식으로 구성을 하여 프로젝트를 진행하였는데, 문제가 발생했다. 바로 springboot 에서 request.getRemoteAddress(); 를 호출..
nginx
일단 라우터의 history 모드를 사용한다. history.pushState API를 활용하여 페이지를 다시 로드하지 않고도 URL을 탐색할 수 있다. const router = new VueRouter({ mode: 'history', routes: [...] }); history 모드를 사용하고 local devServer 에서 동작을 시키면, 우리가 원하는대로 동작이 된다. 하지만 vue 를 nginx 나 apache 같은 웹서버에 배포할 경우 문제가 생긴다. 예전에 처음 vue로 개발하고 nginx에 배포하였을 때 당황했던 적이 있었는데 바로 url 접근시 404에러가 뜬다는 것이다. nginx에 아무런 설정을 하지않고 vue를 번들링해서 배포한 후 http://cornsworld.com/use..
location 블록 location 변경자 location [= |~ |^~|@] pattern { ... } : 맨 앞에 오는 선ㅌ낵적 인자는 로케이션 변경자(location modifier) 심볼. 엔진엑스가 패턴을 비교하는 방법과 패턴의 속성 (문자열 또는 정규식)을 정의한다. server{ server_name corn_tistory location =/test { ... } } # = : 지정 패턴과 정확히 일치 ex) corn_tistory/test (일치) cron_tistory/test?param=value (일치) corn_tistory/test/ (불일치) # ~ : 정규표현식과 일치 # ~* : 대소문자를 구분하지 않으며 정규표현식과 일치 # ^~ : 지정한 패턴으로 시작해야 함. ..
HTTP 코어 모듈 HTTP서버의 핵심적인 블록, 지시어, 변수를 포함한다. 블럭 HTTP 모듈은 아래와 같은 세 가지 논리적 블록을 제공한다. 프로토콜 수준(http 블록), 서버 수준(server 블록), 요청 URI 수준(location) http : 엔진엑스의 HTTP 부문과 관련된 모듈의 지시어와 블록을 정의 server : 하나의 호스트를 선언하는데 사용하며, http 블럭 안에서만 사용할 수 있다. (하나의 웹사이트라고 생각) location : 웹사이트의 특정 위치에 적용할 설정 그룹을 정의한다. server블록이나 다른 location 블록 안에 삽입할 수 있다. 모듈 지시어 표현 방법 : 지시어 소켓과 호스트 환경 listen : 웹 사이트용 리스닝 소켓이 사용하는 IP 주소와 포트를 ..
nginx 기본 설정 설정 파일 nginx.conf : 기본 환경 설정 mime.types : 파일 확장명과 MIME 타입 목록 fastcgi.conf : FastCGI관련 설정 proxy.conf : 프록시 관련 설정 sites.conf : 엔진엑스에 의해 서비스되는 가상 호스트 웹사이트의 설정. 도메인마다 파일을 분리할 것을 권장 지시어 블록 지시어는 모듈에 의해 도입된다. 새 모듈을 활성화하면 그 모듈에 포함된 지시어들을 사용할 수 있다. # 이벤트 모듈에서 사용하는 환경설정 정보 events { worker_connections 1024; } # 블록은 중첩이 되며, 설정은 자식 블럭에 상속된다. http{ server { access_log /var/log/nginx/example.com.log..
SSL 설정 upstream backend{ # upstream 설정 ip_hash; server 127.0.0.1:9000 fail_timeout=30s; } server{ listen 80; server_name www.corn-sample.com corn-sample.com; location / { root /usr/local/var/www/frontend; index index.html; } location ^~/api { proxy_pass http://backend; } error_page 500 502 503 504 /50x.html; location /50x.html { root html; } } server{ #listen 443; listn 443 ssl; server_name www...
Nginx + Tomcat 연동 Upstream apache를 사용하면 tomcat서버와 AJP설정을 통해서 통신을 하게 되는데, nginx는 tomcat서버와 HTTP 통신을 하게된다. Nginx는 Upstream이란 지시자를 사용하며, reverser proxy 역할을 하게된다. upstream이란 무엇일까? Upstream 서버는 다른 말로 Origin 서버라고도 부른다. 여러대의 컴퓨터가 순차적으로 어떤 일을 처리할 때 어떤 서비스를 받는 서버를 의미한다. 위의 그림에서 업스트림 서버는 PHP-FPM이 설치된 서버이고, Nginx는 DownStream 서버라고 할 수 있다. Upstream Module 업스트림 모듈은 Nginx에 내장된 모듈로 부하분산, 속도 개선과 같은 역할을 할 수 있게 한다..
nginx에 가상호스트틀 설정해보자. 호스트 도메인은 corn-sample.com이다. hosts 파일 수정 127.0.0.1 corn-sample.com 127.0.0.1 www.corn-sample.com 가상호스트 설정 가상호스트 파일은 별도의 디렉토리에 두는 것이 보기 좋으니 nginx conf 홈파일에 servers라는 디렉토리를 만들어서 nginx.conf파일에 servers 디렉토리 파일을 include하게 한다. # /usr/local/etc/nginx/nginx.conf http{ ... include servers/*; # 가상호스트설정파일 경로 추가 } # /usr/local/etc/nginx/servers/corn-sample.conf server { listen 80; server..
Apache는 모든 개발자들에게 친근할 거다.(Nginx에 비해) Nginx가 왜 요즘 뜨고있는 HTTP서버인지, 자료를 조금 조사해보았다. (왜냐면 이제 Nginx 사용해볼거거든..) Apache Apache는 Client 요청을 받으면 MPM(Multi Processing Module : 다중처리모듈)이라는 방식으로 요청을 처리하며 대표적으로 Prefork와 Work방식이 있다. Apache 2.4에 Event 방식이 나왔지만, Worker방식과 비슷한것으로 알고있다. 아닌가? 일단 스레드/프로세스 기반구조에 대해 알아보자. 스레드/프로세스 기반 구조 ServerSocket으로 request A가 들어오면 Thread를 할당해 준다. Thread는 그 socket을 가지고 read, write 작업(..
아파치가 버전이 업될때 마다, 살펴볼 것이 많고 설정파일도 무척 복잡하여 nginx를 써보기로 했다. nginx가 가볍고 설정파일이 아파치에 비해 무척 쉽다는 소문만 들었다.. 삽질을 시작해보자. 일단 내 PC인 맥북에 nginx를 설치해보자! 홈브루(homebrew) 설치 사실 macOS에 많이 익숙하진 않다. 홈브루(homebrew)는 yum, apt-get 과 같은 패키지 관리 프로그램이다. 맥북에 설치해보자 $ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" terminal에 위의 명령어를 복붙해서 실행하면, 쭈르르륵 뭔가 설치되는 것이 보인다.. 주르륵 내려가다가 "Press RETU..
