[ IOS & Android ] 모바일웹 에서 어플 실행하기

in #urlscheme7 years ago (edited)

모바일웹에서 어플 실행하기
모바일웹에서 네이티브앱 실행하기

아래 예제 소스가있습니다.
자신의 앱 URL스키마로 소스를 변경하시고
구글스토어, 앱스토어 주소를 맞게 변경하신다음 테스트해보시면 될것같습니다.

*** URL스키마 (URL Scheme) 가 뭐냐구요 ?
쉽게 설명하면 웹 브라우저에서 스마트폰에 설치된 APP을 호출하는 닉네임같은것입니다
예를들면 Chrome 앱 하시죠 ? 구글에서 만은 웹브라우저
이놈에 URL스키마는 googlechrome:// 입니다
아래 예제 소스에 googlechrome:// 이걸 도입해서 작성해두었으니
스마트폰에 Chrome 앱 설치하신뒤에 테스트해보시면 Chrome을 실행시키는 모습을 보실 수 있습니다

아이폰의 경우.. 명확하게 앱 설치여부를 판단할만한 방법을 아직 모르겠는데..
혹시 아시는분은 댓글 부탁드립니다.


<!DOCTYPE html>
<html>

    <body>
        <div id="os_name"></div>
        <h1><a href="#" onclick="appStart()" data-role="button">App Start (onclick event)</a></h1>
    </body>

<script>

// OS 확인
var uAgent = navigator.userAgent.toLocaleLowerCase();
if(uAgent.indexOf("android") != -1)  
    OSName = "android";
else if(uAgent.indexOf("iphone") != -1 || uAgent.indexOf("ipad") != -1 || uAgent.indexOf("ipod") != -1) 
    OSName="ios";
else 
    OSName="is not mobile";

// 확인한 OS이름을 HTML에 표시 
document.getElementById("os_name").innerHTML="<h1>Your os : "+OSName+"</h1>";

// 어플 실행
function appStart(){
    if("ios" == OSName || "android" == OSName){
        document.checkframe.location = "googlechrome://";
        setTimeout("checkApplicationInstall_callback()", 1500);
    }else{
        // 어플 실행하지 않고 종료 
        return;
    } 
}

</script>

</html>