IT story

YouTube 및지도와 같은 iPhone 앱에 http + 도메인 기반 URL 체계를 등록 할 수 있습니까?

hot-time 2020. 4. 21. 08:22
반응형

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를 엽니 다

이것이 작동하는지 확실하지 않습니다 ... 제안? 감사!


이 작업을 수행하는 가장 방해가 적은 방법은 다음과 같습니다.

  1. 사용자 에이전트가 iPhone / iPod Touch의 에이전트인지 확인하십시오
  2. appInstalled쿠키 확인
  3. 쿠키가 존재하고 true로 설정된 경우로 설정 window.location하십시오 your-uri://(또는 서버 리디렉션을 수행하십시오).
  4. 쿠키가 존재하지 않으면 "사이트 이름에 iPhone 응용 프로그램이 있다는 것을 알고 있습니까?" "예, 이미 알고 있습니다", "아니요, 시도하고 싶습니다", "나를 내버려 두십시오"버튼이있는 모달.
    1. "Yep"버튼은 쿠키를 true로 설정하고 your-uri://
    2. "Nope"버튼은 " http://itunes.com/apps/yourappname "으로 리디렉션되어 장치에서 App Store가 열립니다.
    3. "나를 내버려두기"버튼은 쿠키를 false로 설정하고 모달을 닫습니다.

내가 가지고 놀았지만 약간 어색한 것을 발견 한 다른 옵션은 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웹 페이지 를 추가하면 srciOS가 자동으로 앱의 해당 위치로 리디렉션합니다. 앱이 설치되어 있지 않으면 아무 일도 일어나지 않습니다. 이를 통해 앱이 설치되어있는 경우 딥 링크하거나 설치되지 않은 경우 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이이 문제를 해결할 방법이 있다는 것을 알게되었습니다.

실제로이 링크 를 클릭 하면 응용 프로그램을 설치 한 경우 해당 응용 프로그램으로 다시 라우팅됩니다. 그렇지 않으면 팝업없이 웹 페이지로 리디렉션됩니다.

참고 URL : https://stackoverflow.com/questions/1108693/is-it-possible-to-register-a-httpdomain-based-url-scheme-for-iphone-apps-like

반응형