Github 엔지니어가 IE 지원을 중단하는 방법을 설명합니다 — 우아하게

지난 여름 GitHub.
사용자를 IE에서 성공적으로 전환하기 위해 팀이 알아야 할 것이 무엇인지 GitHubber에 질문했습니다.

David Graham은 다음 팁으로 내 전화에 응답했습니다.
도움이 되셨다면 그에게 감사를 표하거나 BlackGirlsCode에 기부해 주세요.

지원 배너 서버 측 렌더링

GitHub의 지원 배너는 서버 측에서 렌더링됩니다.
잘 보이도록 서버 측에서 렌더링됩니다.
잘못된 JavaScript는 스크립트 실행을 중단하여 코드가 실행되지 않도록 할 수 있습니다.
따라서 클라이언트 측에서 렌더링된 메시지는 실행되지 않을 수 있습니다.

브라우저가 필요한 JavaScript를 지원하지 않는다는 사실을 사용자에게 알리려는 경우 좋지 않습니다.
클라이언트측 메시지는 정확히 필요한 사용자에게 보이지 않을 수 있습니다.

지원 배너 서버 측을 렌더링합니다.

Trident에 대한 사용자 에이전트 문자열을 확인하십시오.

Trident는 IE를 구동하는 엔진입니다.Trident 에 대한 요청 헤더의 user-agent 문자열을 확인하십시오.
user-agent를 확인하는 방법은 서버 기술에 따라 다릅니다.
다음은 우리가 수행한 작업의 짧은 버전입니다.

레일즈/루비

  request.user_agent =~ /Trident/

추가 감지 지원을 위해 useragent gem을 사용하십시오.

익스프레스/NodeJS

  let http = require('http'),
      server = http.createServer(function(request) {
          let isIE = /Trident/.test(request.headers['user-agent']);
      });

Express/NodeJS 앱용 미들웨어express-useragent를 사용하세요.

브라우저

  /Trident/.test(navigator.userAgent);

방해가 되는 브라우저 확장 프로그램에 주의하세요.

어떤 사람들은 user-agent 문자열을 수정하는 브라우저 확장 기능을 가지고 있습니다.
이러한 확장 프로그램은 "IE에서 최고"인 이전 앱에 액세스하는 데 자주 사용됩니다.

불행하게도 이것은 user-agent 스니핑 전략이 거짓 긍정을 생성할 수 있음을 의미합니다.

이러한 확장과 싸우려면 클라이언트에서 약간의 기능 감지를 수행하십시오.
예를 들어:
IE는 지원하지 않습니다navigator.mediaDevices.
존재하는 경우 사용자의 브라우저가 거짓말을 하고 있을 수 있습니다.

서버에서 렌더링된 배너가 몇 가지 클라이언트 측 검사를 실행하도록 합니다.
브라우저 간섭이 의심되는 경우 지원 티켓을 트리거하고 이러한 사례를 개별적으로 처리하십시오.

첫날에 Polyfill을 당기지 마십시오

사용자에게 인내심을 가지십시오.
그들 아래에서 깔개를 잡아 당기려고 너무 열심하지 마십시오.

기한이 지난 후에도 계속해서 지원을 제공하십시오.
사용자는 추가 관리에 감사할 것입니다.

🕸

IE 사용자를 식별하고 마이그레이션하기 위한 팁과 요령이 있다고 확신합니다.
어떻게 합니까?