Notice
Recent Posts
Recent Comments
Link
투케이2K
117. (javascript/자바스크립트) 안드로이드 : 카카오 인앱 브라우저에서 크롬 브라우저로 이동 실시 본문
[개발 환경 설정]
개발 툴 : Edit++
개발 언어 : javascript
[소스코드]
<!-- 내부 JS 지정 : 일반 -->
<script>
/* [브라우저 ready 상태 정의 : 최초 호출 상태] */
document.addEventListener("DOMContentLoaded", ready);
function ready(){
console.log("");
console.log("[window ready] : [start]");
console.log("");
// [현재 접속된 url 정보 및 접속 브라우저 확인]
// [카카오톡 인앱 브라우저 >> 안드로이드 모바일 기종 인 경우 >> 크롬 브라우저 이동 실시]
var Url = location.href;
var Agent = navigator.userAgent.toLowerCase();
console.log("");
console.log("[window ready] : [접속 Url] : " + Url);
console.log("[window ready] : [접속 Agent] : " + Agent);
console.log("");
//alert(Agent);
if(Agent.includes("kakao")){ // 카카오 브라우저로 실행 시킨 경우
// 먼저, 카카오 인앱 브라우저 닫기
location.href = 'kakaotalk://inappbrowser/close';
if(navigator.userAgent.match(/iPhone|iPad/i)){ // 아이폰 접속 경우
console.log("");
console.log("[window ready] : [접속 모바일] : " + "[아이폰]");
console.log("");
}
else { // 안드로이드 접속 경우
console.log("");
console.log("[window ready] : [접속 모바일] : " + "[안드로이드]");
console.log("");
// 크롬으로 새창 열기
location.href='intent://'+location.href.replace(/https?:\/\//i,'')+'#Intent;scheme=http;package=com.android.chrome;end';
}
}
};
</script>
[요약 설명]
/*
[로직 설명]
1. 사용자가 카카오톡 인앱 링크를 통해 브라우저를 접속 (카카오톡에서 브라우저 링크 클릭)
2. 자바스크립트 단에서 ready() 함수 (최초 실행 확인) 부분에서 접속한 브라우저 및 디바이스 기기를 체크
3. 접속한 브라우저가 카카오 인앱 인 경우 >> 실행 중인 카카오 인앱을 닫은 후 >> 현재 접속 url 을 크롬으로 열기
*/
반응형
'JavaScript' 카테고리의 다른 글
Comments