No puede conseguir que los nuevos AppLinks funcionen en iOS o Android.

Última actualización a continuación en la actualización # 5

Estoy intentando implementar AppLinks para AMBAS aplicaciones iOS y Android: http://applinks.org

He hecho lo siguiente:

  1. Configurar un esquema de url personalizado para mi aplicación: inacho: //
  2. Configuración en mi aplicación Delegado: - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
  3. Agregue tags meta a mi website en http://www.nachorater.com :

 <meta property="al:ios:app_store_id" content="581815579"/> <meta property="al:ios:app_name" content="iNacho" /> <meta property="al:ios:url" content="inacho://default" /> 

He verificado que el esquema de url funciona muy bien escribiendo un enlace como inacho: // pnetworkingeterminado en Notas y haciendo clic en el enlace que crea. Wa-la! Abre mi aplicación.

Pero cuando trato de hacer clic en un enlace a www.nachorater.com desde Facebook o Quip, ninguna aplicación parece notar automáticamente que el sitio tiene la configuration de estos enlaces de aplicación y simplemente carga el website en su (s) browser (s) en lugar de intentar para abrir mi aplicación

¿Alguien ha conseguido que esto funcione?

Actualizar:

Tuve un problema con algunas metatags que no estaban en la parte <head> de mis templates y lo arreglé.

Ahora, el enlace: http://www.nachorater.com desde la aplicación iOS de Facebook agrega una pequeña y agradable window emergente que le permite abrir la url en la aplicación iNacho así:

captura de pantalla

Pero mis enlaces a mis revisiones dinámicas no parecen funcionar, pero la aplicación de debugging que Ming señaló muestra que las metatags parecen correctas para ellos.

Por ejemplo, http://www.nachorater.com/getReview?reviewID=6396169718595584

meta tags al depurar con https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fwww.nachorater.com%2FgetReview%3FreviewID%3D6396169718595584 :

etiquetas meta

Actualización n. ° 2:

Publiqué un nuevo enlace de revisión de Nacho a mi línea de time de Facebook de iNacho y luego traté de hacer clic en él desde la aplicación mobile de Facebook.

Comenzó a cargar la página y apareció el útil indicador que te permite abrir la aplicación en iNacho, pero una vez que la página se cargó, el indicador desapareció (antes de que pudiera hacer clic).

Actualización n. ° 3:

Desde la aplicación de Facebook, ahora puedo activar una URL inacho para mis revisiones PERO es SÓLO si hago clic en la pequeña window emergente para abrirla en iNacho antes de que desaparezca. Si dejo que la página se cargue por completo en la vista web incorporada de Facebook, la pequeña window emergente desaparecerá.

¿Esto es un problema con Applinks? ¿O un problema con la aplicación de Facebook? ¿O por layout y por qué?

Actualización n. ° 4:

Quizás sepa cuál es el problema. La página de revisión carga a su vez una image dinámica para la revisión de Nacho. Entonces, al cargar la página, tiene una label img src que apunta a una url dinámica que carga la image. ¿Se confunde esto con una acción de "networkingirección" de algún tipo?

Ejemplo de label img (renderizado): <img width="300" src="/getReviewImage?imageID=6125868501958656"></img>

Nota: Hay un montón de otros scripts / ajax que también se cargan dinámicamente (widgets de Facebook y Twitter y similares).

¿Esto es un error en AppLinks o en la aplicación mobile de Facebook? ¿No debería no preocuparse por los objects de carga de background como Ajax y las imágenes dinámicas?

Actualización n. ° 5

15/07/14 – Esto todavía está sucediendo con la última aplicación de Facebook. Cuando hago clic en un enlace desde mi página de Facebook de iNacho a mi website de iNacho, aparece la opción de abrirlo en la aplicación por una fracción de segundo antes de que la página termine de cargarse. Luego lo esconde.

En cuanto a la aplicación de Twitter, ni siquiera me da la window emergente por una fracción de segundo. No parece reconocer que el enlace está habilitado para appslink.

Quip por otro lado, pegué un enlace nacho y la primera vez que hice clic en él, fue a su safari incorporado sin ninguna opción para abrir en mi aplicación. PERO la segunda vez que hice clic en él, abrió directamente mi aplicación en su lugar.

Resumen: Hasta ahora, parece que tal vez algunas aplicaciones están implementando incorrectamente la parte de navigation de AppLinks o algo así. Quip parece funcionar, pero incluso la propia aplicación de Facebook parece que no funciona.

Tenía el mismo problema con AppLinks y decidí renunciar a ellos por completo y simplemente usar el host de enlaces de aplicaciones de Facebook: https://developers.facebook.com/docs/applinks/hosting-api

Mi aplicación es realmente solo mobile, y entendí mal cómo funcionaba AppLinks al principio. Pensé que podría poner las tags meta de al_ios_* en una única página web universal, pero esto es incorrecto. Debería haber una página separada para cada pieza de contenido en mi sitio, y cada una de esas páginas debe tener sus propias tags meta de AppLinks para enviar una URL para ese contenido específico a mi aplicación.

Cuando lo estaba haciendo mal, cuando hice tapping en mi historia de OpenGraph en Facebook, abría mi sitio en el browser web y había un icono de acción en la barra de herramientas inferior que podía tocar y tener la opción de abrir mi aplicación. O tendría que tocar con precisión el nombre de mi aplicación en la historia de OpenGraph. Cualquiera de esos cambios rápidos a mi aplicación, pero la URL no sería específica para el contenido al que quiero dirigir mi aplicación. Además, ambas opciones chupan, solo quiero tocar en cualquier parte de la historia e ir directamente a mi aplicación, por lo que todos estamos aquí.

La solución

Voy a utilizar una historia de OpenGraph con el cuadro de dialog compartir como un ejemplo.

Primero, debe crear un enlace de aplicación alojada en su server, no en la aplicación. Antes de crear su historia de OpenGraph o lo que sea que esté siendo compartido, haga una llamada a su server para lograr 2 cosas:

1.) Haga una llamada API para crear un nuevo enlace de la aplicación de Facebook, que le devolverá una ID

2.) Use esa identificación para realizar una segunda llamada a la API para get la URL en el enlace de la aplicación alojada

Esto debe hacerse en el server porque estas llamadas de API requieren un token de acceso a la aplicación , no un token de acceso de usuario. Este token tiene permissions de nivel de aplicación, no permissions de nivel de usuario. No puede ni debe almacenar su secreto de la aplicación de Facebook en ninguna parte de su aplicación mobile porque alguien podría descomstackr su aplicación y realizar cambios en su aplicación de Facebook. No es bueno. Use su server porque puede conocer de forma segura el secreto de su aplicación.

Mi lado del server está en PHP, así que aquí hay un ejemplo de cómo lograr esto. Tratar con la API no fue una experiencia particularmente agradable, por lo que compartiré con la esperanza de que ayude a otra persona a formatear las requestes:

 # create a new facebook app link using cURL $metadata = <what to handle in AppDelegate application:openURL:sourceApplication:annotation>; $url = "https://graph.facebook.com/v2.1/app/app_link_hosts"; $ch = curl_init($url); # create form post data $deepLinkURL = "<myApp>://" . $metadata; $iosArray = json_encode(array(array("url" => $deepLinkURL, "app_store_id" => <appStoreId (number)>, "app_name" => "<myAppName>") ) ); $webFallbackArray = json_encode(array("should_fallback" => false)); $formQuery = http_build_query(array("access_token" => "<appId>|<appSecret>", "name" => $metadata, "ios" => $iosArray, "web" => $webFallbackArray) ); # options curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_POSTFIELDS, $formQuery); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); # get response $responseJson = curl_exec($ch); curl_close($ch); # decode response from facebook $jsonResponse = json_decode($responseJson, true); $appLinkId = ""; # get appLinkId foreach ($jsonResponse as $key => $val) { # get status if($key == "id") { $appLinkId = $val; } } # if response is good, need to request canonical URL from appLinkId $errorMessage = ""; $canonicalUrl = ""; if(!empty($appLinkId)) { # create another instance of cURL to get the appLink object from facebook using the ID generated by the previous post request $getAppLinkUrl = "https://graph.facebook.com/" . $appLinkId; $ch2 = curl_init(); # cURL options $queryString = http_build_query(array("access_token" => "<appId>|<appSecret>", "fields" => "canonical_url", "pretty" => true) ); curl_setopt($ch2, CURLOPT_URL, $getAppLinkUrl . "?" . $queryString); curl_setopt($ch2, CURLOPT_RETURNTRANSFER, true); # get response $urlResponseJson = curl_exec($ch2); curl_close($ch2); # decode response from facebook $urlJsonResponse = json_decode($urlResponseJson, true); # parse response to get canonical URL foreach ($urlJsonResponse as $key => $val) { # get canonical URL if($key == "canonical_url") { $canonicalUrl = $val; } } # check for result if(empty($canonicalUrl)) { $errorMessage = "Unable to retreive URL."; } } else { $errorMessage = "Unable to publish appLink."; } # encode response back to your app if(empty($errorMessage)) { $response = json_encode(array("result" => "success", "canonical_url" => $canonicalUrl)); } else { $response = json_encode(array("result" => "failed", "errorMessage" => $errorMessage)); } #send response back to your app 

De vuelta en su aplicación, una vez que confirme una buena respuesta, coloque la URL canónica que obtiene como parámetro url en [FBGraphObject openGraphObjectForPostWithType: continuación. Ahora, cuando haces clic en tu historia en la aplicación de Facebook, irá directamente a tu aplicación. Sin tonterías web.

 // Create an action id<FBOpenGraphAction> action = (id<FBOpenGraphAction>)[FBGraphObject graphObject]; // Create an object id<FBGraphObject> object; // set shareDialog parameters FBOpenGraphActionParams *params = [[FBOpenGraphActionParams alloc] init]; params.action = action; params.actionType = @"<myApp>:<myAction>"; params.previewPropertyName = @"<key>"; object = [FBGraphObject openGraphObjectForPostWithType:@"<myApp>:<myObject>" title:<title> image:<urlToPic> url:<fb.me/xyz canonical URL> description:<someDescription>]; [action setObject:object forKey:@"<key>"]; etc... 

Cuando estaba trabajando en mi aplicación, Sweep, puse un muro de pago / participación después de un cierto time en la aplicación. Me enfrenté al mismo problema donde AppLinks realmente me chupaba el hecho de vincularme a Facebook, a pesar de la promise. Sobre la base de este problema, he creado un service llamado branch.io que aloja los enlaces para mí, además inserta automáticamente los metatags de AppLinks correctos para Android / iOS. Los enlaces funcionan de la forma esperada, por más locos que sean. Utiliza una combinación de JS del lado del cliente con AppLinks para hacer que se networkingireccionen correctamente en cada vista web y browser nativo

Aquí hay una guía de alto nivel para crear los enlaces de compartir en iOS:

  1. Para comenzar, solo debes configurar la location de tu aplicación en cualquier tienda en el tablero en dashboard.branch.io. Una vez que esté configurada, obtendrá la key de su aplicación Branch.

  2. pod "Branch" o puede clonar el repository de código abierto aquí: https://github.com/BranchMetrics/Branch-iOS-SDK

  3. Agregue la key de Rama a su file Plist como una cadena con la key 'branch_key'

  4. Agregue el siguiente código a su AppDelegate en los methods apropiados

En didFinishLaunchingWithOptions:

 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // your other init code Branch *branch = [Branch getInstance]; [branch initSessionWithLaunchOptions:launchOptions andRegisterDeepLinkHandler:^(NSDictionary *params, NSError *error) { // previously initUserSessionWithCallback:withLaunchOptions: if (!error) { // params are the deep linked params associated with the link that the user clicked before showing up // params will be empty if no data found // here is the data from the example below if a new user clicked on Joe's link and installed the app NSString *name = [params objectForKey:@"user"]; // returns Joe NSString *profileUrl = [params objectForKey:@"profile_pic"]; // returns https://s3-us-west-1.amazonaws.com/myapp/joes_pic.jpg NSString *description = [params objectForKey:@"description"]; // returns Joe likes long walks on the beach... // route to a profile page in the app for Joe // show a customer welcome } }]; } 

En openUrl para manejar llamadas URI:

 - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation { // pass the url to the handle deep link call // if handleDeepLink returns YES, and you registenetworking a callback in initSessionAndRegisterDeepLinkHandler, the callback will be called with the data associated with the deep link if (![[Branch getInstance] handleDeepLink:url]) { // do other deep link routing for the Facebook SDK, Pinterest SDK, etc } return YES; } 
  1. Por último, para crear los enlaces alojados, es muy simple. Solo tiene que llamar a getShortUrl para crear uno de forma dinámica. Puede poner tantas llaves y valores en los enlaces como sea posible (para recuperarlos en la callback de initSession)

Puede colocar este fragment en cualquier lugar que desee para crear un enlace:

 NSMutableDictionary *params = [[NSMutableDictionary alloc] init]; [params setObject:@"Joe" forKey:@"user"]; [params setObject:@"url.to.picture/mypic.png" forKey:@"profile_pic"]; [params setObject:@"Joe likes long walks on the beach..." forKey:@"description"]; // Customize the display of the link [params setObject:@"Joe's MyApp Referral" forKey:@"$og_title"]; [params setObject:@"url.to.picture/mypic.png" forKey:@"$og_image_url"]; [params setObject:@"Join Joe in MyApp - it's awesome" forKey:@"$og_description"]; // Customize the networkingirect performance [params setObject:@"http://myapp.com/desktop_splash" forKey:@"$desktop_url"]; Branch *branch = [Branch getInstance]; [branch getShortURLWithParams:params andCallback:^(NSString *url, NSError *error) { // show the link to the user or share it immediately }]; 

Android es muy similar en las llamadas a methods y la funcionalidad y se puede encontrar en el sitio.

perdón si mi respuesta no es exactamente lo que esperas, pero solo para compartir lo que hicimos en nuestros sitios web y aplicaciones.

Por ejemplo, sé que tuvimos que agregar más tags para que funcione con las tarjetas de twitter y aquí está la list de properties de meta que tenemos en nuestras páginas:

 meta property="twitter:card" content="" meta property="twitter:title" content="" meta property="twitter:description" content="" meta property="twitter:image:src" content="" meta property="twitter:app:id:iphone" content="" meta property="twitter:app:name:iphone" content="Marmiton" meta property="twitter:app:url:iphone" content="" meta property="twitter:app:id:googleplay" content="" meta property="twitter:app:name:googleplay" content="" meta property="twitter:app:url:googleplay" content="" 

y la metha también tienes:

 meta property="al:iphone:app_store_id" content="" meta property="al:iphone:app_name" content="" meta property="al:iphone:url" content="" meta property="al:android:package" content="" meta property="al:android:app_name" content="" meta property="al:android:url" content="" 

También tenemos el metaóptico de facebook opengraph definido como fb: app_id. Menciono eso porque cuando recibes el vínculo profundo en tu aplicación, también tienes el ID de la aplicación de Facebook en el enlace applinks.

Y de lo que probamos:

  • Facebook no abre el enlace profundo directamente en iOS, mientras que Android te ofrece la opción de la aplicación. A veces aparece la window emergente azul en la parte inferior de la pantalla y, a veces, solo tienes un enlace agregado en la hoja de acciones que tienes cuando tocas el button compartir en la vista web de Facebook (safari) (solo en la primera carga) -> esta presentación del enlace depende de cómo se compartió el contenido en Facebook.

  • Twitter agrega un enlace a la aplicación dentro de la tarjeta en iOS.

No sé qué puedo agregar más.

Espero que ayude un poco.