YouTube 및지도와 같은 iPhone 앱에 http + 도메인 기반 URL 체계를 등록 할 수 있습니까?
iOS에 앱이 휴대 전화에 설치 될 때마다 내 앱의 URL (예 : http://martijnthe.nl )을 내 앱 에서 열고 , 그렇지 않은 경우에는 모바일 사파리를 사용하고 싶습니다.
이것에 대한 고유 한 프로토콜 접미사를 만들어 Info.plist에 등록하는 것이 가능하다는 것을 읽었지만 앱이 설치되지 않은 경우 Mobile Safari에서 오류가 발생합니다.
해결 방법은 무엇입니까?
한 가지 아이디어 :
1) 데스크탑 브라우저에서 열리는 http : // URL을 사용하고 브라우저를 통해 서비스를 렌더링하십시오.
2) User-Agent를 확인하고 Mobile Safari 인 경우 myprotocol : // URL을 열어 (시도)하여 iPhone 앱을 열고 시도가 실패 할 경우 앱 다운로드를 위해 Mobile iTunes를 엽니 다
이것이 작동하는지 확실하지 않습니다 ... 제안? 감사!
이 작업을 수행하는 가장 방해가 적은 방법은 다음과 같습니다.
- 사용자 에이전트가 iPhone / iPod Touch의 에이전트인지 확인하십시오
appInstalled
쿠키 확인- 쿠키가 존재하고 true로 설정된 경우로 설정
window.location
하십시오your-uri://
(또는 서버 리디렉션을 수행하십시오). - 쿠키가 존재하지 않으면 "사이트 이름에 iPhone 응용 프로그램이 있다는 것을 알고 있습니까?" "예, 이미 알고 있습니다", "아니요, 시도하고 싶습니다", "나를 내버려 두십시오"버튼이있는 모달.
- "Yep"버튼은 쿠키를 true로 설정하고
your-uri://
- "Nope"버튼은 " http://itunes.com/apps/yourappname "으로 리디렉션되어 장치에서 App Store가 열립니다.
- "나를 내버려두기"버튼은 쿠키를 false로 설정하고 모달을 닫습니다.
- "Yep"버튼은 쿠키를 true로 설정하고
내가 가지고 놀았지만 약간 어색한 것을 발견 한 다른 옵션은 Javascript에서 다음을 수행하는 것입니다.
setTimeout(function() {
window.location = "http://itunes.com/apps/yourappname";
}, 25);
// If "custom-uri://" is registered the app will launch immediately and your
// timer won't fire. If it's not set, you'll get an ugly "Cannot Open Page"
// dialogue prior to the App Store application launching
window.location = "custom-uri://";
폴 백이 다른 applink 인 한 JavaScript에서이 작업을 수행 할 수 있습니다. 나단의 제안을 바탕으로 :
<html>
<head>
<meta name="viewport" content="width=device-width" />
</head>
<body>
<h2><a id="applink1" href="fb://profile/116201417">open facebook with fallback to appstore</a></h2>
<h2><a id="applink2" href="unknown://nowhere">open unknown with fallback to appstore</a></h2>
<p><i>Only works on iPhone!</i></p>
<script type="text/javascript">
// To avoid the "protocol not supported" alert, fail must open another app.
var appstorefail = "itms://itunes.apple.com/us/app/facebook/id284882215?mt=8&uo=6";
function applink(fail){
return function(){
var clickedAt = +new Date;
// During tests on 3g/3gs this timeout fires immediately if less than 500ms.
setTimeout(function(){
// To avoid failing on return to MobileSafari, ensure freshness!
if (+new Date - clickedAt < 2000){
window.location = fail;
}
}, 500);
};
}
document.getElementById("applink1").onclick = applink(appstorefail);
document.getElementById("applink2").onclick = applink(appstorefail);
</script>
</body>
</html>
iOS 6 기기의 경우 옵션이 있습니다 : 스마트 앱 배너로 앱 홍보
선택한 답변이 브라우저 앱에서 작동하지만을 구현하는 비 브라우저 앱에서 작동하는 코드에 문제가 있음을 발견했습니다 UIWebView
.
문제는 Twitter 앱 사용자가 Twitter 앱을 통해 내 사이트로 연결되는 링크를 클릭한다는 것 UIWebView
입니다. 그런 다음 내 사이트에서 버튼을 클릭했을 때 Twitter는 멋지게 노력 window.location
하고 사이트에 도달 할 수 있는 경우 에만 완료하려고합니다 . 따라서 발생 UIAlertView
하는 메시지는 계속 진행하고 두 번째 팝업없이 즉시 App Store로 리디렉션한다고 말하는 팝업입니다.
내 솔루션에는 iframe이 포함됩니다. 이것은 UIAlertView
단순하고 우아한 사용자 경험을 허용하는 발표를 피합니다 .
jQuery
var redirect = function (location) {
$('body').append($('<iframe></iframe>').attr('src', location).css({
width: 1,
height: 1,
position: 'absolute',
top: 0,
left: 0
}));
};
setTimeout(function () {
redirect('http://itunes.apple.com/app/id');
}, 25);
redirect('custom-uri://');
자바 스크립트
var redirect = function (location) {
var iframe = document.createElement('iframe');
iframe.setAttribute('src', location);
iframe.setAttribute('width', '1px');
iframe.setAttribute('height', '1px');
iframe.setAttribute('position', 'absolute');
iframe.setAttribute('top', '0');
iframe.setAttribute('left', '0');
document.documentElement.appendChild(iframe);
iframe.parentNode.removeChild(iframe);
iframe = null;
};
setTimeout(function () {
redirect('http://itunes.apple.com/app/id');
}, 25);
redirect('custom-uri://');
편집하다:
iframe에 절대 위치를 추가하여 삽입 할 때 페이지 하단에 임의의 공백이 없도록하십시오.
또한 Android 에서이 접근법에 대한 필요성을 발견하지 못했습니다. 사용하면 window.location.href
잘 작동합니다.
iOS9에서 Apple은 마침내 특정 http://
URL 을 처리하기 위해 앱을 등록 할 수있는 가능성을 발표했습니다 : Universal Links .
작동 방식에 대한 매우 대략적인 설명 :
http://
앱에서 특정 도메인 (웹 URL)의 URL을 여는 데 관심이 있다고 선언 합니다.- 지정된 도메인의 서버에서 서버의 도메인에서 URL을 여는 데 관심이 있다고 선언 한 앱에서 어떤 URL을 열어야하는지 표시해야합니다.
- iOS URL 로딩 서비스는
http://
위에 설명 된대로 설정을 위해 URL 을 열려는 모든 시도를 확인하고 설치된 경우 올바른 앱을 자동으로 엽니 다. 사파리를 먼저 거치지 않고 ...
이것은 iOS에서 딥 링크를 수행하는 가장 깨끗한 방법입니다. 불행히도 iOS9 이상에서만 작동합니다 ...
Nathan과 JB의 답변에 다시 빌드 :
추가 클릭없이 URL에서 앱을 시작하는 방법 링크를 클릭하는 중간 단계가 포함되지 않은 솔루션을 선호하는 경우 다음을 사용할 수 있습니다. 이 자바 스크립트를 사용하면 Django / Python에서 Httpresponse 객체를 반환 할 수있었습니다.이 응용 프로그램이 설치되어 있거나 시간 초과의 경우 앱 스토어를 시작하면 앱이 성공적으로 시작됩니다. 참고 iPhone 4S에서 작동하려면 타임 아웃 기간을 500에서 100으로 조정해야했습니다. 상황에 맞게 테스트하고 조정하십시오.
<html>
<head>
<meta name="viewport" content="width=device-width" />
</head>
<body>
<script type="text/javascript">
// To avoid the "protocol not supported" alert, fail must open another app.
var appstorefail = "itms://itunes.apple.com/us/app/facebook/id284882215?mt=8&uo=6";
var loadedAt = +new Date;
setTimeout(
function(){
if (+new Date - loadedAt < 2000){
window.location = appstorefail;
}
}
,100);
function LaunchApp(){
window.open("unknown://nowhere","_self");
};
LaunchApp()
</script>
</body>
</html>
window.location = appurl;// fb://method/call..
!window.document.webkitHidden && setTimeout(function () {
setTimeout(function () {
window.location = weburl; // http://itunes.apple.com/..
}, 100);
}, 600);
document.webkitHidden
앱이 이미 호출되었고 현재 사파리 탭이 백그라운드로 이동하는지 감지하는 것입니다.이 코드는 www.baidu.com에서 가져온 것입니다.
앱의 사용자 정의 구성표로 설정된 iframe
웹 페이지 를 추가하면 src
iOS가 자동으로 앱의 해당 위치로 리디렉션합니다. 앱이 설치되어 있지 않으면 아무 일도 일어나지 않습니다. 이를 통해 앱이 설치되어있는 경우 딥 링크하거나 설치되지 않은 경우 App Store로 리디렉션 할 수 있습니다.
예를 들어 Twitter 앱이 설치되어 있고 다음 마크 업이 포함 된 웹 페이지로 이동하면 즉시 앱으로 연결됩니다.
<!DOCTYPE html>
<html>
<head>
<title>iOS Automatic Deep Linking</title>
</head>
<body>
<iframe src="twitter://" width="0" height="0"></iframe>
<p>Website content.</p>
</body>
</html>
다음은 앱이 설치되지 않은 경우 앱 스토어로 리디렉션되는보다 철저한 예입니다.
<!DOCTYPE html>
<html>
<head>
<title>iOS Automatic Deep Linking</title>
<script src='//code.jquery.com/jquery-1.11.2.min.js'></script>
<script src='//mobileesp.googlecode.com/svn/JavaScript/mdetect.js'></script>
<script>
(function ($, MobileEsp) {
// On document ready, redirect to the App on the App store.
$(function () {
if (typeof MobileEsp.DetectIos !== 'undefined' && MobileEsp.DetectIos()) {
// Add an iframe to twitter://, and then an iframe for the app store
// link. If the first fails to redirect to the Twitter app, the
// second will redirect to the app on the App Store. We use jQuery
// to add this after the document is fully loaded, so if the user
// comes back to the browser, they see the content they expect.
$('body').append('<iframe class="twitter-detect" src="twitter://" />')
.append('<iframe class="twitter-detect" src="itms-apps://itunes.com/apps/twitter" />');
}
});
})(jQuery, MobileEsp);
</script>
<style type="text/css">
.twitter-detect {
display: none;
}
</style>
</head>
<body>
<p>Website content.</p>
</body>
</html>
해결책이 있습니다.
흐림 및 초점을 사용하여 부울 위치 설정
//see if our window is active
window.isActive = true;
$(window).focus(function() { this.isActive = true; });
$(window).blur(function() { this.isActive = false; });
이와 같은 것을 호출하는 jquery 클릭 핸들러로 링크를 바인딩하십시오.
function startMyApp(){
document.location = 'fb://';
setTimeout( function(){
if (window.isActive) {
document.location = 'http://facebook.com';
}
}, 1000);
}
앱이 열리면 창에 포커스가 없어지고 타이머가 종료됩니다. 그렇지 않으면 우리는 아무것도 얻지 못하고 일반적인 페이스 북 URL을로드합니다.
내가 아는 한 전체 OS가 http:
+ 도메인 URL을 이해하도록 할 수는 없습니다 . 새 구성표 만 등록 할 수 있습니다 ( x-darkslide:
내 앱에서 사용 ). 앱이 설치되어 있으면 Mobile Safari가 앱을 올바르게 시작합니다.
그러나 "여전히 여기에서 iTunes를 통해 앱을 다운로드하려면이 링크를 클릭하십시오."로 앱이 설치되지 않은 경우를 처리해야합니다. 귀하의 웹 페이지에서.
User-Agent를 확인하고 Mobile Safari 인 경우 myprotocol : // URL을 열어 (시도)하여 iPhone 앱을 열고 시도가 실패 할 경우 앱 다운로드를 위해 Mobile iTunes를 열도록합니다.
이것은 나에게 합리적인 접근 방식으로 들리지만, 두 번째 수단으로 모바일 아이튠즈를 열 수 있다고 생각하지 않습니다. 앱 또는 iTunes로 리디렉션 중 하나를 선택해야한다고 생각합니다.
즉, myprotocol : //로 리디렉션하고 앱이 휴대 전화에없는 경우 iTunes로 리디렉션 할 수있는 두 번째 기회가 없습니다.
먼저 (iphone에 최적화 된) 랜딩 페이지로 리디렉션하고 사용자에게 앱을 클릭하거나 앱이없는 경우 iTunes를 가져 오는 옵션을 제공 할 수 있습니까? 그러나 올바른 작업을 수행하려면 사용자에게 의존해야합니다. (편집 : 쿠키를 처음으로 설정할 수는 있지만 쿠키를 설정할 수 있습니까?)
팝업 문제를 해결하기 위해 Apple이이 문제를 해결할 방법이 있다는 것을 알게되었습니다.
실제로이 링크 를 클릭 하면 응용 프로그램을 설치 한 경우 해당 응용 프로그램으로 다시 라우팅됩니다. 그렇지 않으면 팝업없이 웹 페이지로 리디렉션됩니다.
'IT story' 카테고리의 다른 글
ostream에 << 연산자를 올바르게 오버로드하는 방법은 무엇입니까? (0) | 2020.04.21 |
---|---|
GitHub 저장소에 파일과 폴더를 추가하려면 어떻게합니까? (0) | 2020.04.21 |
img 태그의 src를 프로그래밍 방식으로 변경 (0) | 2020.04.21 |
jQuery가 Ajax 호출이 종료되기 전에 대기하도록하려면 어떻게해야합니까? (0) | 2020.04.21 |
텍스트 변경 리스너의 안드로이드 (0) | 2020.04.21 |