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


Última actualización a continuación en la actualización 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 delegado de la aplicación: - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
  3. Agregar metaetiquetas a mi sitio web 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" />

Comprobé que el esquema de URL funciona muy bien escribiendo un enlace como inacho: // predeterminado en Notas y haciendo clic en el enlace que crea. Wa-la! Abre mi aplicación.

Pero cuando intento hacer clic en un enlace a www.nachorater.com desde Facebook o Quip, ninguna aplicación parece tomar nota automáticamente de que el sitio tiene configurados estos enlaces de aplicaciones y simplemente carga el sitio web en sus exploradores en lugar de intentarlo. para abrir mi aplicación

¿Alguien ha conseguido esto funcionando?

Actualizar:

Tuve un problema con algunas metaetiquetas que no estaban en la parte <head> de mis plantillas y las solucioné.

Ahora el enlace: http://www.nachorater.com desde la aplicación iOS de Facebook agrega una pequeña ventana emergente que le permite abrir la url en la aplicación iNacho de la siguiente manera:

screenshot

Pero mis enlaces a mis revisiones dinámicas no parecen estar funcionando, sin embargo, la aplicación Debug que Ming señaló muestra que las etiquetas meta parecen correctas para ellos.

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

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

meta tags

Actualización # 2:

Publiqué un nuevo enlace de revisión nacho en mi línea de tiempo de iNacho en Facebook y luego intenté hacer clic en él desde la aplicación móvil de Facebook.

Comenzó a cargar la página y apareció el práctico indicador que le permite abrir la aplicación en iNacho pero una vez cargada la página, el indicador se fue (antes de que yo pudiera hacer clic).

Actualización # 3:

Desde la aplicación de Facebook, ahora puedo activar una URL inaccesible para mis revisiones, PERO SOLO es que haga clic en la pequeña ventana emergente para abrir 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 ventana desaparecerá.

¿Es esto un problema con Applinks? O un problema con la aplicación de Facebook? ¿O por diseño y por qué?

Actualización # 4:

Puedo saber cuál es el problema. La página de revisión a su vez carga una imagen dinámica para la revisión de nacho. Entonces al cargar la página, tiene una etiqueta img src que apunta a una url dinámica que carga la imagen. ¿Esto se confunde con una acción de "redirección" de algún tipo?

Ejemplo de etiqueta img (representada): <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, etc.).

¿Es esto un error en AppLinks o en la aplicación móvil de Facebook? ¿No debería importarle cargar objetos de fondo como ajax e imágenes dinámicas?

Actualización # 5

7/15/14 - Esto todavía está sucediendo con la última aplicación de Facebook. Cuando hago clic en un enlace de mi página de iNacho en Facebook a mi sitio web de iNacho, aparece la opción para 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 ventana 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 opción de abrir en mi aplicación. PERO la segunda vez que hice clic en él, en su lugar, abrió mi aplicación directamente.

Resumen: hasta ahora, parece que algunas aplicaciones están implementando la porción de navegación de AppLinks incorrectamente o algo así. Quip parece funcionar, pero incluso la propia aplicación de Facebook parece que no funciona.


32
2018-05-09 07:45


origen


Respuestas:


Estaba teniendo el mismo problema con AppLinks y decidí renunciar a ellos por completo y simplemente usar el host del enlace de la aplicación de Facebook: https://developers.facebook.com/docs/applinks/hosting-api

Mi aplicación es realmente solo móvil, y no entendí cómo funcionaba AppLinks al principio. Pensé que podría simplemente poner el al_ios_* meta tags en una sola página web universal, pero esto está mal. Tendría que haber una página separada para cada contenido en mi sitio, y cada una de esas páginas debe tener sus propias metaetiquetas 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, abriría mi sitio en el navegador web y había un ícono de acción en la barra de herramientas inferior al que podía tocar y tenía 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 estos cambios rápidos a mi aplicación, pero la URL no sería específica para el contenido al que quiero que navegue mi aplicación. Además, ambas opciones apestan; solo quiero tocar en cualquier parte de la historia e ir directamente a mi aplicación, que es la razón por la que todos estamos aquí.

La solución

Voy a usar una historia de OpenGraph con el cuadro de diálogo Compartir como un ejemplo.

Primero, necesitas crear un enlace de aplicación alojada en tu servidor, no en la aplicación. Antes de crear su historia de OpenGraph o lo que sea que se esté compartiendo, haga una llamada a su servidor para lograr 2 cosas:

1.) Realice 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 hacer una segunda llamada de API para obtener la URL de su enlace de la aplicación alojada.

Esto tiene que hacerse en el servidor porque estas llamadas API requieren una acceso a la aplicación token, no un token de acceso de usuario. Este token tiene permisos de nivel de aplicación, no permisos de nivel de usuario. No puede y no debe almacenar su aplicación de Facebook en secreto en cualquier lugar de su aplicación móvil porque alguien podría descompilar su aplicación y realizar cambios en su aplicación de Facebook. No es bueno. Use su servidor porque puede conocer su secreto de forma segura.

Mi servidor está en PHP así que aquí hay un ejemplo de cómo lograr esto. Tratar con la API no fue una experiencia particularmente agradable, así que lo compartiré con la esperanza de que ayude a alguien más a formatear las solicitudes:

# 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 recibe como el urlparámetro en [FBGraphObject openGraphObjectForPostWithType: abajo. Ahora, cuando hagas clic en tu historia en la aplicación de Facebook, irá directamente a tu aplicación. No hay tonterías en la 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...

8
2017-09-29 20:38



Cuando estaba trabajando en mi aplicación, Barrido, pongo un muro de pago / participación después de una cierta cantidad de tiempo en la aplicación. Me enfrenté al mismo problema en el que AppLinks realmente apestaba a la vinculación de Facebook, a pesar de la promesa. Basado en este problema, construí un servicio llamado branch.io que aloja los enlaces para mí, además inserta automáticamente las metatags de AppLinks correctas para Android / iOS. Los enlaces en realidad funcionan como se esperaba, por más loco que eso sea. Utiliza una combinación de JS del lado del cliente con los AppLinks para hacerlos redirigir correctamente en cada vista web y navegador nativo

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

  1. Para comenzar, solo necesita configurar la ubicación de su aplicación en cualquiera de las tiendas en el tablero en dashboard.branch.io. Una vez que todo está configurado, obtienes la clave de tu aplicación Branch.

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

  3. Agregue la clave de sucursal a su archivo plist como una cadena con la clave 'branch_key'

  4. Agregue el siguiente código a su AppDelegate en los métodos apropiados

En el 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 registered 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 necesita llamar a getShortUrl para crear dinámicamente uno. Puede poner tantas claves y valores en los enlaces como sea posible (que se recuperarán en la devolución de llamada de initSession)

Puede poner este fragmento 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 redirect 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 llamadas de método y funcionalidad y se puede encontrar en el sitio.


5
2018-06-02 05:15



lo siento si mi respuesta no es exactamente lo que espera pero solo para compartir lo que hicimos en nuestros sitios web y aplicaciones.

Por ejemplo, sé que tuvimos que agregar más etiquetas para que funcione con las tarjetas de twitter y aquí está la lista de las meta propiedades 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 el meta también tiene:

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 facebook opengraph meta definido como fb: app_id. Menciono eso porque cuando recibes el deeplink en tu aplicación, también tienes la id de la aplicación de Facebook en el enlace de las aplicaciones.

Y de lo que probamos:

  • Facebook no abre el deeplink directamente en iOS, mientras que Android te da la opción de aplicación. A veces aparece la ventana emergente azul en la parte inferior de la pantalla y a veces solo tienes un enlace agregado en la hoja de acción que tienes cuando tocas el botón 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é lo que puedo agregar más.

Espero que ayude un poco.


3
2017-08-01 22:34