Có thể đăng ký Lược đồ URL dựa trên tên miền http + cho các ứng dụng iPhone, như YouTube và Bản đồ không?


223

Tôi muốn có iOS để mở URL từ tên miền của mình (ví dụ: http://martijnthe.nl ) với ứng dụng của tôi bất cứ khi nào ứng dụng được cài đặt trên điện thoại và với Mobile Safari trong trường hợp không có.

Tôi đọc có thể tạo hậu tố giao thức duy nhất cho điều này và đăng ký nó trong Info.plist, nhưng Mobile Safari sẽ báo lỗi trong trường hợp ứng dụng không được cài đặt.

Điều gì sẽ là một cách giải quyết?

Một ý tưởng:

1) Sử dụng http: // URL mở trong bất kỳ trình duyệt máy tính để bàn nào và hiển thị dịch vụ thông qua trình duyệt

2) Kiểm tra Tác nhân người dùng và trong trường hợp đó là Mobile Safari, hãy mở myprotatio: // URL tới (cố gắng) để mở ứng dụng iPhone và mở iTunes di động để tải xuống ứng dụng trong trường hợp không thành công

Không chắc chắn nếu điều này sẽ làm việc ... đề xuất? Cảm ơn!


4
Trong tàu điện ngầm NYC, có wifi của Boingo cung cấp cho bạn quyền truy cập WiFi miễn phí nếu bạn tải xuống một ứng dụng mà họ đề xuất. Khi bạn tải xuống, bạn quay lại Safari và trình duyệt sẽ phát hiện nếu nó được cài đặt và sau đó cấp cho bạn quyền truy cập. Bất cứ ý tưởng làm thế nào được thực hiện?
TommyG

2
Universal Links hiện sẽ hỗ trợ trường hợp sử dụng này mà không có bất kỳ thông báo lỗi nào. Dưới đây là cách định cấu hình tên miền và ứng dụng của bạn: blog.branch.io/ Kẻ
Alex Austin

Câu trả lời:


243

Tôi nghĩ rằng cách ít xâm phạm nhất để làm điều này là như sau:

  1. Kiểm tra xem tác nhân người dùng có phải là iPhone / iPod Touch không
  2. Kiểm tra appInstalledcookie
  3. Nếu cookie tồn tại và được đặt thành true, được đặt window.locationthành your-uri://(hoặc thực hiện phía máy chủ chuyển hướng)
  4. Nếu cookie không tồn tại, hãy mở "Bạn có biết Tên trang web của bạn có ứng dụng iPhone không?" phương thức với một nút "Yep, tôi đã có nó", "Không, nhưng tôi thích thử nó" và nút "Để tôi yên".
    1. Nút "Yep" đặt cookie thành đúng và chuyển hướng đến your-uri://
    2. Nút "Không" chuyển hướng đến " http://itunes.com/apps/yourappname " sẽ mở App Store trên thiết bị
    3. Nút "Để tôi yên" đặt cookie thành false và đóng chế độ

Tùy chọn khác mà tôi đã chơi nhưng thấy hơi khó hiểu là thực hiện các thao tác sau trong 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://";

16
Giải pháp tuyệt vời. Nếu dự phòng của bạn là một ứng dụng khác, nó sẽ tải NGAY LẬP TỨC mà không hiển thị lỗi. Vì vậy, thay vì quay trở lại itunes.com ... hãy sử dụng itms: //phobos.apple.com / ... để tránh lỗi bật lên!
jb.

47
Vấn đề : Khi window.location="custom-uri://thành công, thời gian chờ dự phòng không bị giết. Khi người dùng quay lại trình duyệt từ ứng dụng của bạn, bộ hẹn giờ vẫn ở đó và sẽ khởi chạy liên kết cửa hàng ứng dụng. Đây là trải nghiệm người dùng kém.
JoJo

5
Có vẻ như Cookies được sandbox trong # ios6 vì vậy bạn không thể truy cập cookie được giải quyết bởi một ứng dụng từ một ứng dụng khác. (Ví dụ: Ứng dụng WebUI và Safari Mobile)
Olivier Amblet

2
Bất cứ ai cũng tìm được cách ngăn thời gian chờ ban đầu bắn khi người dùng quay lại trình duyệt? (vấn đề được nêu lên mà JoJo đề cập)
cobolstinks

2
Để giải quyết vấn đề mà JoJo đề cập, chỉ chạy mã trong thời gian chờ nếu không "nhiều thời gian" đã trôi qua kể từ khi người dùng nhấp vào liên kết. Xem giải pháp này: stackoverflow.com/a/14751543/533420
kkara

95

Bạn hoàn toàn có thể làm điều này bằng JavaScript miễn là dự phòng của bạn là một ứng dụng khác. Dựa trên đề xuất của Nathan :

<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>

Kiểm tra một bản demo trực tiếp ở đây .


7
Đồng ý với Lee, đây có vẻ là một giải pháp đơn giản hơn - mặc dù tôi vẫn nhận được thông báo lỗi từ safari nếu ứng dụng không tồn tại và nó chuyển hướng đến cửa hàng ứng dụng.
Jon

2
Tôi đã sử dụng giải pháp này cho cả Android và iOS. Tôi đã tìm thấy nếu tôi thay đổi giá trị thời gian chờ từ 500 thành 100 Tôi không nhận được hộp thoại bật lên "Không thể mở trang" trong iOS. Tôi cũng thấy rằng thời gian chờ cần là 50 cho Android
Rossini

14
Sử dụng "itms-apps:" thay vì "itms:" lưu 1 chuyển hướng và trực tiếp mở trang ứng dụng trong kho ứng dụng.
Latorre Đức

6
@Rossini này được tích hợp vào Android bằng cách thiết lập bộ lọc ý định cho hành động của bạn phản hồi lại một máy chủ cụ thể
jwadsack

9
Có ai biết cách tránh thông báo lỗi "không thể mở trang" từ safari nếu ứng dụng chưa được cài đặt và trước khi chuyển hướng đến cửa hàng ứng dụng không?
davidk


24

Tôi thấy rằng câu trả lời được chọn hoạt động cho các ứng dụng trình duyệt nhưng tôi gặp vấn đề với mã làm việc trong các ứng dụng không phải trình duyệt thực hiện a UIWebView.

Vấn đề đối với tôi là một người dùng trên ứng dụng Twitter sẽ nhấp vào một liên kết sẽ đưa họ đến trang web của tôi thông qua một UIWebViewứng dụng Twitter. Sau đó, khi họ nhấp vào một nút từ trang web của tôi, Twitter cố gắng tỏ ra lạ mắt và chỉ hoàn thành window.locationnếu trang web có thể truy cập được. Vì vậy, những gì xảy ra là một UIAlertViewcửa sổ bật lên nói rằng bạn có chắc chắn muốn tiếp tục và sau đó chuyển hướng ngay lập tức đến App Store mà không cần cửa sổ bật lên thứ hai.

Giải pháp của tôi liên quan đến iframe. Điều này tránh việc UIAlertViewđược trình bày cho phép trải nghiệm người dùng đơn giản và thanh lịch.

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://');

Javascript

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://');

BIÊN TẬP:

Thêm vị trí tuyệt đối vào iframe để khi được chèn sẽ không có một khoảng trắng ngẫu nhiên nào ở cuối trang.

Ngoài ra, điều quan trọng cần lưu ý là tôi chưa tìm thấy nhu cầu về phương pháp này với Android. Sử dụng window.location.hrefnên hoạt động tốt.


1
Nó hoạt động !! Cảm ơn tôi cuối cùng đã tìm thấy một giải pháp hoạt động trên mọi trình duyệt.
koleror

2
Đây là giải pháp tốt nhất nếu được tìm thấy. Cảm ơn bạn. Không có lỗi popup nữa.
thiệu

1
@Tim nếu bạn muốn mã này được kích hoạt khi nhấp vào liên kết, hơn là bọc mã này trong một chức năng được gọi khi liên kết được nhấp.
cnotethegr8

1
@ cnotethegr8 Tôi đã đặt nó vào một chức năng và chuyển hướng đến url tùy chỉnh hoạt động rất tốt nhưng việc quay lại iTunes thì không. Đây là của tôi . Tôi đang thiếu gì?
Tim

1
Có ai khác gặp rắc rối với điều này trong iOS 9. Nó không còn hoạt động với tôi trong Safari.
bgolson

20

Trong iOS9, Apple cuối cùng đã giới thiệu khả năng đăng ký ứng dụng của bạn để xử lý một số http://URL nhất định : Liên kết phổ quát .

Một lời giải thích rất sơ bộ về cách thức hoạt động của nó:

  • Bạn tuyên bố quan tâm đến việc mở http://URL cho một số tên miền (url web) trong ứng dụng của bạn.
  • Trên máy chủ của các tên miền được chỉ định, bạn phải chỉ ra URL nào sẽ mở trong ứng dụng nào đã tuyên bố quan tâm đến việc mở URL từ tên miền của máy chủ.
  • Dịch vụ tải URL iOS kiểm tra tất cả các nỗ lực mở http://URL để thiết lập như được giải thích ở trên và tự động mở ứng dụng chính xác nếu được cài đặt; mà không cần thông qua Safari trước ...

Đây là cách sạch nhất để thực hiện liên kết sâu trên iOS, thật không may, nó chỉ hoạt động trong iOS9 và mới hơn ...


và nó không hoạt động bên trong trình duyệt ... chỉ ở bên ngoài, như từ hình ảnh hoặc ghi chú
Mihey Mik

9

XÂY DỰNG một lần nữa vào câu trả lời của Nathan và JB:

Cách khởi chạy ứng dụng từ url w / o Nhấp thêm Nếu bạn thích một giải pháp không bao gồm bước tạm thời nhấp vào liên kết, có thể sử dụng cách sau đây. Với javascript này, tôi đã có thể trả về một đối tượng Httpresponse từ Django / Python để khởi chạy thành công một ứng dụng nếu nó được cài đặt hoặc khởi chạy thay thế cửa hàng ứng dụng trong trường hợp hết thời gian. Lưu ý Tôi cũng cần điều chỉnh khoảng thời gian chờ từ 500 đến 100 để điều này hoạt động trên iPhone 4S. Kiểm tra và chỉnh sửa để làm cho nó phù hợp với tình huống của bạn.

<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>

9
window.location = appurl;// fb://method/call..
!window.document.webkitHidden && setTimeout(function () {
    setTimeout(function () {
    window.location = weburl; // http://itunes.apple.com/..
    }, 100);
}, 600);

document.webkitHidden là để phát hiện xem ứng dụng của bạn đã được gọi hay chưa và tab safari hiện tại để đi đến nền, mã này là từ www.b Nikol.com


Tôi đã thử nghiệm giải pháp này và thấy rằng, trong khi nó cung cấp các sự kiện đúng cách, hộp thoại lỗi "Safari không thể mở trang này vì địa chỉ không hợp lệ" xuất hiện ngay lập tức. (Nó tự động loại bỏ sau một phần của giây).
michaelhanson

sử dụng iframe để tải appurlweburlcó thể giải quyết vấn đề của bạn
zyanlu

1
@zyanlu: tôi đã thử với iFrame. bt vẫn safari đang hiển thị cùng một lỗi.
kunjus

5

Nếu bạn thêm một iframetrang trên trang web của mình với srclược đồ được đặt thành tùy chỉnh cho Ứng dụng của bạn, iOS sẽ tự động chuyển hướng đến vị trí đó trong Ứng dụng. Nếu ứng dụng không được cài đặt, sẽ không có gì xảy ra. Điều này cho phép bạn liên kết sâu vào Ứng dụng nếu nó được cài đặt hoặc chuyển hướng đến App Store nếu nó không được cài đặt.

Ví dụ: nếu bạn đã cài đặt ứng dụng twitter và điều hướng đến một trang web có chứa đánh dấu sau, bạn sẽ được chuyển ngay đến ứng dụng.

<!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>

Dưới đây là một ví dụ kỹ lưỡng hơn chuyển hướng đến cửa hàng Ứng dụng nếu Ứng dụng chưa được cài đặt:

<!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>

Vấn đề với ví dụ đầu tiên của bạn là nếu bạn quay lại Mobile Safari, nó sẽ hiển thị "Ứng dụng Twitter chưa được cài đặt" ngay cả khi Twitter được khởi chạy. Tương tự với ví dụ thứ hai, hiển thị "Nội dung trang web". Cần phải có mã làm điều gì đó khác biệt (tải một URL khác hoặc hiển thị một trong hai thông báo) nếu ứng dụng được cài đặt.
mahboudz

1
Có, @mahboudz, nếu bạn đọc văn bản, đó chỉ là một ví dụ đơn giản để cho thấy rằng có thể tự động chuyển hướng đến ứng dụng.
q0rban

Sau đó tôi tiếp tục với một ví dụ kỹ lưỡng hơn sẽ hiển thị nội dung trang web thực tế. Tôi có thể xóa văn bản "Ứng dụng Twitter chưa được cài đặt" nếu nó làm cho nó rõ ràng hơn.
q0rban

ios 6 vẫn displayes sổ popup Đó trang không thể mở được vì url không hợp lệ
Andrei Shender

@AndreiShender, đây là iOS thống kê sử dụng tại thời điểm viết bài này: monosnap.com/image/8eXUcpEUi8fm94DiMZIdiIp4xUNaln.png iOS 8: 72%, iOS 7: 25%, phiên bản trước: 3%
q0rban

4

Đây là một giải pháp.

Thiết lập chế độ bão hòa boolean bằng cách sử dụng độ mờ và tiêu điểm

//see if our window is active
window.isActive = true;
$(window).focus(function() { this.isActive = true; });
$(window).blur(function() { this.isActive = false; });

Liên kết liên kết của bạn với một trình xử lý nhấp chuột jquery gọi một cái gì đó như thế này.

function startMyApp(){
  document.location = 'fb://';

  setTimeout( function(){
    if (window.isActive) {
        document.location = 'http://facebook.com';
    }
  }, 1000);
}

nếu ứng dụng mở ra, chúng ta sẽ mất tập trung vào cửa sổ và hẹn giờ kết thúc. nếu không, chúng tôi không nhận được gì và chúng tôi tải url facebook thông thường.


Cảm ơn rất nhiều cho lời đề nghị. Tôi đang đối mặt với vấn đề rằng cuộc đối thoại "khởi chạy ứng dụng bên ngoài" dường như đủ để làm mờ cờ vô hiệu hóa cờ. Điều này xảy ra ngay cả khi ứng dụng chưa được cài đặt (ví dụ: khi nhấp vào liên kết có nghĩa là khởi chạy Ứng dụng iPhone trên máy tính để bàn). Ý tưởng?
fluxon

2

Theo như tôi biết, bạn không thể làm cho toàn bộ HĐH hiểu được http:URL miền +. Bạn chỉ có thể đăng ký chương trình mới (tôi sử dụngx-darkslide: trong ứng dụng của mình). Nếu ứng dụng được cài đặt, Mobile Safari sẽ khởi chạy ứng dụng một cách chính xác.

Tuy nhiên, bạn sẽ phải xử lý trường hợp ứng dụng không được cài đặt với "Vẫn ở đây? Nhấp vào liên kết này để tải xuống ứng dụng từ iTunes." trong trang web của bạn.


2
Điều này không còn đúng nữa: với iOS9 và các phiên bản Android gần đây, bạn có thể đăng ký ứng dụng của mình để nghe một số httpURL nhất định
severin

0

Kiểm tra Tác nhân người dùng và trong trường hợp đó là Mobile Safari, hãy mở myprotatio: // URL tới (nỗ lực) để mở ứng dụng iPhone và mở iTunes di động để tải xuống ứng dụng trong trường hợp không thành công

Đây có vẻ là một cách tiếp cận hợp lý với tôi, nhưng tôi không nghĩ rằng bạn sẽ có thể đưa nó để mở itunes di động như một khu nghỉ mát thứ hai. Tôi nghĩ bạn sẽ phải chọn cái này hoặc cái kia - chuyển hướng đến ứng dụng của bạn hoặc đến itunes.

tức là nếu bạn chuyển hướng đến myprotatio: // và ứng dụng không có trên điện thoại, bạn sẽ không có cơ hội thứ hai để chuyển hướng đến itunes.

Trước tiên, bạn có thể chuyển hướng đến một trang đích (được tối ưu hóa cho iphone) và cung cấp cho người dùng tùy chọn nhấp qua ứng dụng của bạn hoặc vào itunes để tải ứng dụng nếu họ không có nó? Nhưng, bạn sẽ dựa vào người dùng để làm điều đúng đắn ở đó. (Chỉnh sửa: mặc dù bạn có thể đặt cookie để chỉ là lần đầu tiên?)


1
Sai rồi. Nếu một lỗi được hiển thị rằng trang không thể được mở (Ứng dụng chưa được cài đặt), thì JS vẫn được thực thi. Đó là lý do tại sao bạn có thể chuyển hướng đến một giải pháp dự phòng khác sau đó.
Erik

0

Khi tìm cách khắc phục vấn đề về cửa sổ bật lên, tôi phát hiện ra rằng Apple có cách khắc phục mối quan tâm này.

Thật vậy, khi bạn nhấp vào liên kết này , nếu bạn đã cài đặt ứng dụng, nó sẽ được định tuyến lại cho nó; nếu không, bạn sẽ được chuyển hướng đến trang web mà không có bất kỳ cửa sổ bật lên nào.


3
Tôi đã tìm hiểu khá sâu về cách liên kết đó hoạt động và điều tốt nhất tôi có thể nghĩ ra là nó hoàn toàn không phải là một giải pháp JavaScript. Apple dường như đã đăng ký một trình xử lý URL đặc biệt cho ứng dụng của họ không yêu cầu giao thức tùy chỉnh và thay vào đó là một số kết hợp khớp với chuỗi URL. Liên kết bạn gửi chuyển hướng ngay lập tức với số 303 đến đây . Nếu bạn gửi liên kết đó trong email cho chính mình, bạn có thể thấy rằng nhấp vào liên kết đó sẽ trực tiếp hiển thị ứng dụng AppStore nếu được cài đặt
Casey

Rất thú vị. Bạn nói đúng: nếu tôi nhấp vào nó, nó sẽ hiển thị ứng dụng AppStore nếu được cài đặt. Nhưng nếu bạn xóa một số tham số cho đến khi "holydays", nó sẽ xuất hiện trong Safari. Apple có thể đăng ký lược đồ URL đặc biệt ...
Tiêu đề

@Titignes, bạn có thể vui lòng giải thích theo cách này để mở ứng dụng hoặc trang web. Mô hình để xây dựng một url như vậy là gì?
Andrei Shender 2/2/2015
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.