본 고 는 Nginx 를 이용 하여 간단 한 동정 분 리 를 실현 하고 본 고 는 Nginx 와 하나의 SpringBoot 간단 한 웹 응용 을 사용 하여 실현 한다.
1. 준비 작업.
본 장면 과 결합 하여 Nginx 와 자바 환경 (SpringBoot 프로젝트 실행) 을 설치 해 야 합 니 다.
1.1 Linux 시스템 에 Nginx 를 설치 하 는 것 은 제 글 인 (전송 문) 을 참고 할 수 있 습 니 다.
1.2 본 고의 SpringBoot 는 Thymeleaf 템 플 릿 을 사 용 했 고 프로젝트 포트 번 호 는 8888 이다.
1.3 로 컬 / Users / dalaoyang / Downloads / static 파일 에 jquery. js 를 저장 합 니 다.
2. 동정 분리 란 무엇 인가?
동정 이 분리 되 기 전에 우 리 는 먼저 무엇이 움 직 이 고 무엇이 조용 한 지 알 아야 한다.
웹 개발 에서 일반적으로 동적 자원 은 배경 자원 을 가리 키 는데 정적 자원 은 HTML, JavaScript, CSS, img 등 파일 을 가리킨다.
일반적으로 동적 자원 과 정적 자원 을 분리 하여 정적 자원 을 Nginx 에 배치 해 야 합 니 다. 요청 이 왔 을 때 정적 자원 의 요청 이 라면 nginx 가 설정 한 정적 자원 디 렉 터 리 아래 에서 자원 을 가 져 옵 니 다. 동적 자원 의 요청 이 라면 nginx 는 역방향 에이전트 의 원 리 를 이용 하여 요청 을 배경 응용 프로그램 에 전달 합 니 다.동정 분 리 를 실현 한다.
전후 단 분 리 를 사용 한 후에 정적 자원 의 방문 속 도 를 어느 정도 향상 시 킬 수 있 고 오픈 과정 에서 전후 단 개발 을 병행 하면 개발 시간 을 효과적으로 향상 시 킬 수 있 으 며 연결 시간 도 줄 일 수 있다.
3. 프로젝트 설정
SpringBoot 응용 시작 클래스 를 수정 하고 간단 한 점프 를 하여 루트 경 로 를 index. html 로 이동 할 수 있 도록 합 니 다. 다음 코드 와 같 습 니 다.

@SpringBootApplication
@Controller
public class DemoApplication {

	public static void main(String[] args) {
		SpringApplication.run(DemoApplication.class, args);
	}

	@GetMapping("/")
	public String index(){
		return "index";
	}
}

index. html 코드 는 다음 과 같 습 니 다. jquery. js 를 도입 하 는 것 에 주의 하 십시오. 인용 에 성공 하면 jquery 를 사용 하여 div 에 값 을 부여 합 니 다. 코드 는 다음 과 같 습 니 다.

"en" xmlns:th="http://www.w3.org/1999/xhtml">

    "UTF-8">
    

type</span>=<span class="hljs-string">"text/javascript"</span> src=<span class="hljs-string">"jquery.js"</span>>

        
"test_div">


type</span>=<span class="hljs-string">"text/javascript"</span>>
    $(<span class="hljs-string">'#test_div'</span>).html(<span class="hljs-string">'  jquery.js  '</span>);

프로젝트 구 조 는 다음 과 같 습 니 다. jquery. js 가 없 는 것 을 볼 수 있 습 니 다. 우리 가 해 야 할 일 은 Nginx 를 사용 하여 jquery. js 를 방문 하 는 것 입 니 다.
4. Nginx 설정
nginx. conf 설정 을 수정 합 니 다. 그 중에서 첫 번 째 location 은 배경 요청 을 처리 하고 두 번 째 는 정적 자원 을 처리 합 니 다. 다음 과 같 습 니 다.

worker_processes  1;

events {
    worker_connections  1024;
}

http {

   server {
       listen       10000;
       server_name  localhost;
      
      #      
      location / {
        proxy_pass http://localhost:8888;
        proxy_set_header X-Real-IP $remote_addr;
      }

      #      
      location ~ .*\.(html|htm|gif|jpg|jpeg|bmp|png|ico|js|css)$ {
        root /Users/dalaoyang/Downloads/static;
       }

    }

}

5. 테스트
SpringBoot 애플 리 케 이 션 을 시작 하고 Nginx 를 시작 합 니 다.
브 라 우 저 에서 접근http://localhost:10000/아래 그림 과 같이 볼 수 있 습 니 다.
그림 에서 빨 간 상자 의 내용 을 통 해 정적 자원 을 인용 하 는 데 성공 했다 는 것 을 알 수 있다.
6. 총화
최근 에 nginx 에 관 한 것 을 계속 보고 있 습 니 다. 최근 에 nginx 와 관련 된 글 을 계속 업데이트 할 것 입 니 다. 관심 이 있 으 시 면 계속 지 켜 보 세 요.