웹 측면에서 특정 응용 프로그램이 설치되었는지 판정·처리하는 방법 #마법의 램프
개요
전제 조건
myapp://
이러한 오리지널 모드는 응용 프로그램을 시작할 수 있다목표
웹 측에서 오리지널 응용 프로그램을 설치했는지 판단합니다.
응용 프로그램이 지원되지 않는 장치
어플리케이션 대응 장치
문제점
iOS와 Android는 표준 브라우저에서 특정 모드로 마이그레이션하는 방법이 다릅니다.
iOS
Android
var checkedAt = (new Date()).getTime();
window.setTimeout(function() {
var lagtime = (new Date()).getTime() - checkedAt;
if (lagtime > LAG_TIME) {
window.location = useragent ? IOS_STORE_URL : ANDROID_STORE_URL;
return;
}
}, TIMEOUT);
window.location = MY_APP_SCHEMA;
실행되지 않음
setTimeout()
해결 방법
사용자 확인
useragent.js
window.MY_APP = window.MY_APP || {};
MY_APP.UserAgent = (function() {
var ua = navigator.userAgent;
if ((ua.indexOf('Android') > 0 && ua.indexOf('Mobile') == -1)) {
return 0;
} else if ((ua.indexOf('Android') > 0 && ua.indexOf('Mobile') > 0)) {
return 0;
} else if (ua.indexOf('iPhone') > 0) {
return 1;
} else if (ua.indexOf('iPad') > 0) {
return 1;
} else if (ua.indexOf('iPod') > 0) {
return 1;
} else {
return -1;
}
});
인식 가능한 아키텍처인지 확인
index.html
<!DOCTYPE html>
<html>
<head>
<title>MY APP</title>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="js/useragent.js"></script>
</head>
<body>
<script>
const IOS_STORE_URL = "https://itunes.apple.com/jp/app/hoge/";
const ANDROID_STORE_URL = "https://play.google.com/store/apps/details?id=hoge";
const MY_WEB_PAGE_URL = "https://example.com";
const MY_APP_SCHEMA = "myapp://";
const USER_AGENT_NOT_SMART_PHONE = -1
const LAG_TIME = 400;
const TIMEOUT = 1000;
$(function() {
if (MY_APP.UserAgent() === USER_AGENT_NOT_SMART_PHONE) {
window.location = MY_WEB_PAGE_URL;
return false;
}
$("body").append("<iframe src='" + MY_APP_SCHEMA + "' style='display:none'/>");
var checkedAt = (new Date()).getTime();
window.setTimeout(function() {
var lagtime = (new Date()).getTime() - checkedAt;
$("iframe").remove();
if (lagtime > LAG_TIME) {
window.location = useragent ? IOS_STORE_URL : ANDROID_STORE_URL;
return;
}
}, TIMEOUT);
});
</script>
</body>
</html>
Reference
이 문제에 관하여(웹 측면에서 특정 응용 프로그램이 설치되었는지 판정·처리하는 방법 #마법의 램프), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/oigus-k/items/03044da9a9f7f1754346텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)