[Nginx] detect/filter old browser (야호!)

웹개발을 하다보면 브라우저 호환성으로 인해 스트레스를 많이 받습니다.

 

하지만, 종종 특수한 경우에 모든 브라우저를 지원하기위해 노력할 필요가 없을때가 있습니다.

예를들어, 개발 초기부터 "IE는 배제하고 다른 사용자 브라우저에 집중하기로 한다"하고 미리 약속을 할 때가 있죠.

 

그런 조금은 행복한 경우를 위해,

"ancient"브라우저들을 nginx수준에서 막아버릴 방법을 제시해드리도록 하겠습니다.

(의외로 잘 정리된 자료가 없더군요)

이 방법은 Nginx가 늘 사용자 request의 브라우저를 식별하고 있음을 이용한 방법입니다.

 

# /etc/nginx/nginx.conf

...
http {
    ...
    map $http_user_agent $outdated {
        default                                 0;
        "~MSIE [1-9]\."                         1;
        "~MSIE [0-9][0-9]\."                    1;
        "~Trident/.*"                           1;
        "~Edge/[0-9]\."                         1;
        "~Edge/[0-9][0-9]\."                    1;
        "~Edge/.*"                              1;
        "~Mozilla.*Firefox/[1-9]\."             1;
        "~Mozilla.*Firefox/[0-2][0-9]\."        1;
        "~Mozilla.*Firefox/3[0-1]\."            1;
        "~Opera.*Version/[0-9]\."               1;
        "~Opera.*Version/[0-1][0-9]\."          1;
        "~Opera.*Version/2[0-1]\."              1;
         "~AppleWebKit.*Version/[0-6]\..*Safari" 1;
         "~Chrome/[0-9]\."                       1;
        "~Chrome/[0-2][0-9]\."                  1;
        "~Chrome/3[0-3]\."                      1;
    }
    ...
}
...

 

다음은, /etc/nginx/sites-enabled (혹은, /etc/nginx/sites-available/default)를 수정할건데요.

여러분이 설정해둔 server중 적용하고 싶은 파트에 적절히 배치하면됩니다.

예시를 통해 확인하고 응용해보세요.

# /etc/nginx/sites-enabled/default 혹은 /etc/nginx/sites-available/default

...

server {
    root /home/ubuntu/hello_world
    index index.html
    server_name www.helloworld.com
    
    location / {
        if ($outdated = 1) {
            root /home/ubuntu/unsupported;
            rewrite ^ /index.html break;
        }

        try_files $uri $uri/ /index.html;
    }
    ...
}

...

보시는 바와 같이 1번 블럭 코드의 브라우저(및 버전)에 해당될경우

/home/ubuntu/unsupported 경로의 index.html 파일을 response합니다.

unsupported경로에 index.html 파일만 적절히 만들어두면 되겠죠?

 

코드를 통해 알수있듯이, IE브라우저 외에도 오래된 브라우저들은 모두 redirect 시켜버립니다.

확인해보고 필요한 부분의 코드만 (제외하고싶은 브라우저만) 남겨서 사용하시면 될것같습니다.

 

# 참고자료

https://gist.github.com/rosskevin/5cfd78c73a10ca1989696350d76ea3c1