반응형
기획에서 모바일 웹에서 창을 닫아달라는 요청이 있었다.
이 로직을 태우면서 발견한 여러가지 문제점을 적어두려고 한다.
1. 개발한 링크를 문자에서 바로 누르고 들어갈 경우
1-1. 싱글페이지일 경우
이때는 닫기가 잘 된다
1-2. 싱글페이지가 아닐 경우
첫 화면의 창 닫기 로직을 태우면 잘 되지만, 화면 이동을 했을 경우부터는 동작을 하지 않는다.
2. 문자에서 받았지만 직접 url을 입력하여 웹을 동작시켰을 경우
2-1. 모든 경우
안드로이드에서는 blank 화면으로 꺼질 수는 있으나 ios에서는 동작하지 못함
아래의 로직을 태웠을때 잘 동작할 경우와 동작 하지 않을 경우에 대한 컨트롤이 어렵기 때문에
결국 해당 기능은 제거하기로 결론이 났다.
const _ua = window.navigator.userAgent || window.navigator.vendor || window.opera
const type = checkMobile();
if (type == 'kakaotalk') {
//kakaotalk
window.location.href = (/iPad|iPhone|iPod/.test(_ua)) ? 'kakaoweb://closeBrowser': 'kakaotalk://inappbrowser/close';
}else if(type == 'ios'){
//ios
window.open('', '_self', '')
window.close();
}else {
window.open('about:blank','_self').self.close();
}
// 브라우저 구별 function 참고 하기 위해 적어둠
// 기기구분
function checkMobile(){
var ua = navigator.userAgent.toLowerCase();
if ( ua.indexOf('kakaotalk') > -1) {
//카카오톡
return "kakaotalk";
} else if ( ua.indexOf('android') > -1) {
//안드로이드
return "android";
} else if ( ua.indexOf("iphone") > -1||ua.indexOf("ipad") > -1||ua.indexOf("ipod") > -1 ) {
//ios
return "ios";
} else {
//ios, 안드로이드 외
return "other";
}
}
반응형
'Development > 기타' 카테고리의 다른 글
[ error / wget ] WARNING: cannot verify 'xxxxx' certificate (0) | 2021.10.19 |
---|---|
window - yarn 설치하기, version 확인하기 (0) | 2021.09.16 |
[ javascript / vus.js ] 에이전트를 이용한 브라우저 감지 (0) | 2021.06.23 |
[ javascript ] cookie 값 등록, 수정, 가져오기, 삭제 (0) | 2021.06.10 |
[ vue.js ] moment 추가하기 (0) | 2021.05.26 |