Cómo gestionar enlaces profundos en SwiftUI

Aprenda a implementar y gestionar tanto esquemas de URL personalizados como enlaces universales │ en su aplicación SwiftUI para dirigir a los usuarios a contenidos específicos.

Intermediate

El manejo de enlaces profundos en SwiftUI implica configurar tu aplicación para que responda a URL específicas y luego analizar esas URL para navegar al contenido apropiado dentro de tu aplicación. Hay dos tipos principales de enlaces profundos: esquemas de URL personalizados y enlaces universales.

1. Esquemas de URL personalizados

Los esquemas de URL personalizados te permiten definir un prefijo único (por ejemplo, myapp://) que, al pulsarlo, abrirá la aplicación.

Configuración:

  1. Añadir tipo de URL en Xcode:
    • En el proyecto de Xcode, seleccione el destino.
    • Vaya a la pestaña «Información».
    • En «Tipos de URL», haga clic en el botón «+» para añadir un nuevo tipo de URL.
    • Establezca el «Identificador» (por ejemplo, com.yourcompany.yourapp). Se recomienda utilizar el ID del paquete de su aplicación como prefijo.
    • Establece los «Esquemas de URL» en el esquema que desees (por ejemplo, myapp).

Manejo en SwiftUI:

Utilice el modificador de vista .onOpenURL para gestionar las URL entrantes. Este modificador está disponible desde iOS 14.

import SwiftUI

struct ContentView: View {  @State private var receivedURL: URL?  var cuerpo: algunos Ver {  VStack {
 Texto(«Deep Link Handler»)
 if let url = receivedURL {  Text("URL recibida: \(url.absoluteString)")  // Analizar la URL y navegar en consecuencia
 // Ejemplo: myapp://product?id=123  if url.host == "product",  let components = URLComponents(url: url, resolvingAgainstBaseURL: false),  let id = componentes.queryItems?.primero(donde: { $0.name == "id" })?.valor {
 Texto("ID del producto: \(id)")
 }  } else {
 Texto(«Aún no se ha recibido ningún enlace profundo.»)  }
 }
 .onOpenURL { url in  url recibida = url  imprimir("Esquema de URL personalizado recibido: \(url)")
 }  } } 

2. Enlaces universales

Los enlaces universales son enlaces HTTPS estándar (por ejemplo, https://yourwebsite.com/path) que pueden abrir tu aplicación directamente si está instalada o, si no lo está, redirigir a tu sitio web. Proporcionan una experiencia de usuario fluida.

Configuración:

  1. Derecho de dominios asociados:

    • En su proyecto Xcode, seleccione su objetivo.
    • Vaya a la pestaña «Firma y capacidades».
    • Haga clic en «+ Capacidad» y añada «Dominios asociados».
    • Añada una entrada con el formato applinks:yourwebsite.com (por ejemplo, applinks:example.com).
  2. apple-app-site-association Archivo:

    • Cree un archivo JSON llamado apple-app-site-association (sin la extensión .json).
    • Aloja este archivo en tu sitio web en la raíz o en el directorio .well-known (por ejemplo, https://yourwebsite.com/apple-app-site-association o https://yourwebsite.com/.well-known/apple-app-site-association).
    • El archivo especifica qué rutas de su sitio web deben abrir su aplicación. Necesitará su ID de equipo y su ID de paquete para este archivo.

    Ejemplo de archivo apple-app-site-association:

    json { "applinks": { "details": [ { "appIDs": [ "YOUR_TEAM_ID.com.yourcompany.yourapp" ], "components": [ { "/": "/products/*", "comment": "Coincide con cualquier URL en la ruta /products/" }, { "/": "/profile/*", "comment": "Coincide con cualquier URL en la ruta /profile/" } ] } ] } }

Manejo en SwiftUI:

Al igual que con los esquemas de URL personalizados, se utiliza el modificador .onOpenURL.

import SwiftUI struct ContentView: View {
 @State private var receivedUniversalLink: URL?  var cuerpo: some View {  VStack {
 Texto("Manejador de enlaces universales")  si let url = receivedUniversalLink {  Texto("Enlace universal recibido: \(url.absoluteString)")  // Analizar la URL y navegar
 // Ejemplo: https://yourwebsite.com/products/123  if url.pathComponents.contains("products"),  let productId = url.lastPathComponent {
 Texto("ID del producto del enlace universal: \(productId)")
 }
 } else {  Texto("Aún no se ha recibido ningún enlace universal.")  }  }
 .onOpenURL { url in
 receivedUniversalLink = url
 print("Enlace universal recibido: \(url)")
 }  }
} 

3. Análisis y navegación

Para aplicaciones más complejas, necesitarás analizar la URL entrante y utilizar las herramientas de navegación de SwiftUI para dirigir al usuario a la vista correcta.

import SwiftUI

enum AppRoute: Hashable {
 caso inicio  caso producto(id: String)  caso perfil(id: String)  caso configuración }

clase DeepLinkManager: ObservableObject {  @Publicado var navigationPath = NavigationPath()  func handleURL(_ url: URL) {  guard let host = url.host else { return }  // Ejemplo de esquema de URL personalizado: myapp://product?id=123  // Ejemplo de enlace universal: https://yourwebsite.com/products/123  if host == "product" || url.pathComponents.contains("productos") {  si deja componentes = URLComponents(url: url, resolvingAgainstBaseURL: false),  let id = components.queryItems?.primero(donde: { $0.nombre == "id" })?.valor ?? url.últimoComponenteDeLaRuta {
 navigationPath.append(AppRoute.product(id: id))  }  } else if host == "profile" || url.pathComponents.contiene(«perfil») {
 if let components = URLComponents(url: url, resolvingAgainstBaseURL: false),
 let id = components.queryItems?.first(where: { $0.name == "id" })?.valor ?? url.últimoComponenteDeLaRuta {  navigationPath.append(AppRoute.profile(id: id))  }  }
 // Añadir más lógica de enrutamiento para otras rutas  } }