티스토리 뷰
최근 인터넷 익스플로러에 대한 뉴스가 나왔다.
마이크로 소프트의 웹브라우저인 인터넷 익스플로러
결국 내년 6월에 세상에서 사리진 다는 소식을 접하게 되었다.
물론 그전에도 이미 인터넷 익스플로러에 대한 인지도는 떨어졌지만,
나이가 있는 분들은 아직도 쓰고 일부 회사 사이트는 익스플로러에서만 접속이 가능하는 불편함이 있다.
그 과정에서 우리는 인터넷 익스플로러를 더 이상 사용하지 않게 될 경우, 지금이라고 이 브라우저 접속을 막아보는 방법을 찾아보았다.
먼저 내가 접속한 브라우저가 무엇인지 확인하는 코드다.
let agent = navigator.userAgent.toLowerCase();
if ((navigator.appName == 'Netscape' && navigator.userAgent.search('Trident') != -1) || agent.indexOf('msis') != -1) {
console.log('인터넷 익스플로러 브라우저');
} else if (agent.indexOf('chrome') != -1) {
console.log('크롬 브라우저');
} else if (agent.indexOf('safari') != -1) {
console.log('safari 브라우저');
} else if (agent.indexOf('firefox') != -1) {
console.log('firefox 브라우저');
}
navigator.userAgent
=> 현재 브라우저의 사용자 에이전트 문자열을 반환한다.
.toLowerCase()
=> 이 메서드는 문자열을 소문자로 변환해 반환한다.
navigator.appName == 'Netscape' && navigator.userAgent.search('Trident') != -1
=> 현재 브라우저가 IE 11 버전인지 체크한다.
agent.indexOf('msis') != -1
=> 현재 브라우저가 IE 10 버전 이하인지 체크한다.
agent.indexOf('browserName') != -1
=> 해당하는 브라우저 이름이 맞는지 체크한다.
다음으로는 익스플로러에서 접속한 사이트를 엣지에서 강제로 접속하는 코드다.
if(navigator.userAgent.indexOf('Trident') > 0){
location.href = "microsoft-edge:" + location.href;
document.querySelector('p').innerText = 'This page cannot be opened with IE. Check the Edge browser which has been opened.'
setTimeout(close);
}
이 코드를 작성하고 익스플로러로 접속 시 바로 엣지로 옮겨 접속이 되는 것을 확인할 수 있다.
추가적으로 chrome로 접근하는 방법에 대해 필자도 궁금해서 이번에 찾아보게 되었는데 생각보다 정보가 없어 찾는데 어려움이 있었다.
단, 필자가 이번에는 실제로 확인하지 않았다는 점은 양해 부탁드립니다.
microsoft-edge를 크롬에서 대체를 하게 되는 경우
http의 경우 : location.href = "googlechrome" ...
https의 경우 : location.href = "googlechromes" ...
이런 식으로 적는 방법이 있다. 즉 아마 브라우저마다 명칭이 agent.indexOf와는 명칭이 다르다는 점을 알게 되었다.
'Front-End > Javascript' 카테고리의 다른 글
초보자를 위한 리덕스 101 : 바닐라 JS 그리고 리덕스 (0) | 2021.06.26 |
---|---|
자바스크립트 유효성 검사 모음 (0) | 2021.06.19 |
자바스크립트에서의 배열 : Array (0) | 2021.04.13 |
자바스크립트에서 문자열을 바꿔주는 함수 : parseInt() (0) | 2021.04.12 |
parseInt (0) | 2021.02.27 |
- Total
- Today
- Yesterday
- Coding Test
- 파이썬
- 노드
- 자바
- javascript
- node.js
- 리액트
- mongodb
- 자바스크립트
- 프로그래머스
- github
- node
- redux
- CSS
- 리덕스
- node-sass
- 리액트 썸네일
- 리액트 유튜브
- array
- 함수
- programmers
- Git
- java
- 배열
- 코딩테스트
- 재공부
- 뷰
- Switch
- Visual Studio Code
- react
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |