nginx 의 http 사용 하기image_filter 모듈 에 이미지 서버 구축

1730 단어
이야기 배경: 물리 적 픽 셀 밀도 가 높 은 아이 폰 6s 등 핸드폰 이 고 화질 이미지 맞 춤 형 (동시에 일반 핸드폰 이 이미지 의 질 을 낮 출 수 있다) 을 누 릴 수 있 도록 다음 과 같은 기능 이 필요 합 니 다. 잘 하 는 회사 에 이런 이미지 서버 가 있 을 것 이 라 고 생각 합 니 다. url 을 통 해 파 라 메 터 를 얻 은 다음 에 이미지 의 질 을 제어 할 수 있 습 니 다.그림 을 다른 사이즈 로 재단 할 수도 있 습 니 다.
그래서 우 리 는 큰 그림 (@ 2x) 을 올 리 고 나머지 작은 그림 은 모두 이미지 서버 에 맡 기 면 됩 니 다. 우 리 는 url 을 맞 추 는 것 만 책임 지면 됩 니 다.
예 를 들 어, 이 원 도 는:
https://img.alicdn.com/tps/TB1AGMmIpXXXXafXpXXXXXXXXXX.jpg

이와 같이 그림 재단 을 할 수 있 습 니 다: 200×200 
https://img.alicdn.com/tps/TB1AGMmIpXXXXafXpXXXXXXXXXX_200x200.jpg

100×100 
https://img.alicdn.com/tps/TB1AGMmIpXXXXafXpXXXXXXXXXX_100x100.jpg

찾 아 보 니 nginx 자체 가 해결 할 수 있 습 니 다.http_image_filter 의 역할 은 바로 이 단계 에서 nginx 가 그림 을 처리 하 는 것 입 니 다. 축소, 확대 등 기능 을 포함 합 니 다.처 리 된 그림 을 되 돌려 줍 니 다.컴 파일 절 차 를 건 너 뛰 었 습 니 다.
nginx 의 설정 을 붙 여 넣 기 시작 합 니 다:
location ~  \/testImage\/(\d+)\.(jpg)$ {

           set $h $arg_h;
           set $w $arg_w;
           #image_filter crop $h $w;
           image_filter resize $h $w;

 }

location ~ \/testImage\/(\d+)_(\d+)x(\d+)\.(jpg)$ {

      if ( -e $document_root/testFile/testImage/$1.$4 ) {
              rewrite '/(\d+)_(\d+)x(\d+)\.(jpg)$' /testFile/testImage/$1.$4?h=$2&w=$3 last;
      }
      return 404;
  }

   location ~* \.(jpg)$ {
   }

location 의 일치 규칙 과 rewrite 쓰기 방법 은 여 기 를 참고 하 십시오.
이상 의 표기 법 자 체 는 여기에서 참고 한다.
강조해 야 할 것 은 그 중에서 파일 이 존재 하 는 지 판단 하고 rewrite 가 나 로 하여 금 반나절 동안 썼 다 는 것 이다. 이 구 덩이 를 뛰 어 넘 는 것 을 깊이 이해 하 기 를 바란다.
또한 cpu 가 새 그림 을 만들어 주 었 기 때문에 저장 하지 않 았 습 니 다.그래서 방 문 량 이 많 을 때 는 일종 의 소모 이다.Fastdfs 와 결합 하면 이 문 제 를 해결 할 수 있다 는 글 이 있 습 니 다.
nginx 역방향 에이전트 구축
ReactDOM.createRoot 🆚 ReactDOM.render

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage