nginx 정적 파일 에이전트 와 gzip 설정
목적.
node. js 가 정적 파일 에 대한 처 리 를 줄 이 고 전단 에서 정적 자원 을 다운로드 하 는 속 도 를 가속 화하 기 위해 nginx 를 사용 하여 정적 대 리 를 하고 gzip 압축 을 하기 로 결 정 했 습 니 다.(express 의 copression 중간 을 사용 하지 않 는 이유: 생산 환경 최 적 실천: 성능 과 신뢰성)
정적 파일 에이전트
express 프로젝트 구조
위의 블 로그 응용 예 를 들 어 블 로그 의 express 프로젝트 구 조 는 다음 과 같다. 모든 정적 자원, 예 를 들 어
js
, css
, font
, image
등 은 static
디 렉 터 리 에 놓 여 있다.- blog
- dist
- static
- images
- javascripts
- stylesheets
- fonts
- font-awesome
- ...
- src
- ...
페이지 의 모든 인용 자원 은
static/XXX/XXX/XXX.XXX
블 로그 에 사용 할 nginx 프로필 수정블 로그 의 프로필 경로
/etc/nginx/jackyang.me/blog.conf
:upstream blog.jackyang.me {
server 127.0.0.1:3000;
keepalive 8;
}
server {
listen 0.0.0.0:80;
server_name blog.jackyang.me;
location / {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
proxy_pass http://blog.jackyang.me/;
proxy_redirect off;
}
# new config lines for static files proxy
location /static/ {
root /var/www/jackyang.me/blog;
}
}
/static/
의 설정 은 nginx 에 게 알려 줍 니 다. static/
시작 하 는 모든 요청 에 부 딪 히 면 blog.jackyang.me/static/images/demo.png
디 렉 터 리 로 내 려 갑 니 다.다시 시작 nginx
sudo /usr/local/nginx/sbin/nginx -s stop
sudo /usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf
nginx 를 다시 시작 합 니 다.
/var/www/jackyang.me/blog/static/
의 express
을 보면 정적 파일 에 대한 log
요청 을 볼 수 없습니다.gzip 열기
블 로그 에 사용 할 nginx 프로필 수정
GET
는 gzip
, http
, server
역할 영역 에서 설정 할 수 있 습 니 다. 저 는 location
만 설정 하기 때문에 blog.jackyang.me
에 두 겠 습 니 다.upstream blog.jackyang.me {
server 127.0.0.1:3000;
keepalive 8;
}
server {
listen 0.0.0.0:80;
server_name blog.jackyang.me;
location / {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
proxy_pass http://blog.jackyang.me/;
proxy_redirect off;
}
# new config lines for gzip
gzip on;
gzip_min_length 1k;
gzip_buffers 4 8k;
gzip_http_version 1.1;
gzip_types text/plain application/javascript application/x-javascript text/javascript text/css application/xml;
location /static/ {
root /var/www/jackyang.me/blog;
}
}
여기에 간단 한 설정 을 주 었 습 니 다. 더 많은
/etc/nginx/jackyang.me/blog.conf
설정 속성 에 대한 정 보 는 공식 문 서 를 보십시오.다시 시작 nginx
sudo /usr/local/nginx/sbin/nginx -s stop
sudo /usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf
브 라 우 저 방문 페이지 를 열 면 디 버 깅 도구 에서 대응 하 는
gzip
유형의 자원 MINE
에 표 시 된 response header
을 볼 수 있 습 니 다.(자신 이 설정 할 때 문제 가 발생 했 습 니 다.
gzip
css
은 gzip
없 었 습 니 다. 마지막 으로 여기 javascript
값 은 설정 파일 Content-Type
에 포함 되 지 않 았 습 니 다. gzip_types
은 content-type
이 고 application/javascript
에 설 치 된 값 은 gzip_types
입 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
React Bundle.js 최소화본편은 webpack 와 TypeScript 를 사용하는 전제가 되어 있습니다. React뿐만 아니라 다른 SPA에도 적용할 수 있습니다. 복수의 라이브러리 사용하면, 빌드 후의 bundle.min.js 도 방대(1...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.