Integra reCAPTCHA Enterprise en apps para iOS

En esta página, se explica cómo integrar reCAPTCHA Enterprise en tu app para iOS.

Debido a la variación en los dispositivos móviles en términos de tamaño de pantalla, rendimiento y IU de las apps, el desafío de reCAPTCHA de la casilla de verificación visual (No soy un robot) no está disponible en apps para dispositivos móviles con iOS. En su lugar, puedes implementar tu propia estrategia de aplicación por niveles, como un flujo de MFA para proporcionar una ruta de canje alternativa para el tráfico sospechoso.

Antes de comenzar

Establezca el SDK mínimo de su aplicación en iOS 11 o cree una aplicación para dispositivos móviles nueva.
Prepara tu entorno para reCAPTCHA Enterprise.
Crea una clave reCAPTCHA para la plataforma de apps para iOS.

Como alternativa, puedes copiar el ID de una clave de reCAPTCHA existente para iOS mediante uno de los siguientes pasos:
- Para copiar el ID de una clave existente desde Google Cloud Console, haz lo siguiente:
  1. Ve a la página de reCAPTCHA Enterprise.
    
    Ir a reCAPTCHA Enterprise
  2. En la lista de claves de reCAPTCHA, mantén el puntero sobre la clave que deseas copiar y, luego, haz clic en .
- Para copiar el ID de una clave existente con la API de REST, usa el método projects.keys.list.
- Para copiar el ID de una clave existente con la gcloud CLI, usa el comando gcloud recaptcha keys list.
Tener una cuenta de GitHub
Consulta los detalles sobre privacidad de Apple.

Prepara tu entorno de iOS

Para preparar el entorno de desarrollo, haz lo siguiente:

Descarga e instala la versión más reciente de Xcode y crea una nueva aplicación iOS en blanco de vista única.
Descarga el SDK mediante una de las siguientes opciones:
CocoaPods
1. Descarga e instala CocoaPods.
2. Crea un Podfile y agrega las siguientes líneas a él:
```
source "https://github.com/CocoaPods/Specs.git"

target 'AppTarget' do

  # Podfiles must include use_frameworks! or
  # use_frameworks! :linkage => :static
  use_frameworks!

  pod "RecaptchaEnterprise", "18.5.0-beta02"
  ...

end
```
3. Ejecuta pod update para instalar las dependencias necesarias.
  
  Nota: La ejecución de pod clone no instala las dependencias requeridas.
Swift Package Manager
1. En Xcode, selecciona File > Add Packages y, luego, ingresa la siguiente URL en el campo Search o Enter Package URL: https://github.com/GoogleCloudPlatform/recaptcha-enterprise-mobile-sdk
2. En el cuadro de diálogo XCode, ingresa los siguientes detalles:
  - Nombre de usuario de GitHub
  - Un token de acceso personal que creaste con las instrucciones de GitHub. El Personal Access Token debe tener los alcances que se indican en el diálogo XCode Sign In.
  Xcode instala el SDK y sus dependencias requeridas.
Flutter
Si quieres obtener instrucciones detalladas para usar reCAPTCHA Enterprise a través de Flutter, consulta la documentación de Flutter.

ReactNative
Si necesitas instrucciones detalladas para usar reCAPTCHA Enterprise mediante React Native, consulta la documentación de React Native.
Descarga directa
1. Si quieres descargar el SDK y sus dependencias como xcframeworks, descarga el client.
  
  Nota: Agrega todos los objetos binarios como xcframeworks estáticos.

Configura la app

Puedes escribir tus apps en Swift o en Objective-C.

Para configurar tu app, agrega los siguientes archivos:

Swift

Si tu app está escrita en Swift, crea un encabezado de puente de Objective-C y agrega la siguiente importación:
```
#import <RecaptchaEnterprise/RecaptchaEnterprise.h>
```

Objective-C

Si tu app está escrita en Objective-C, crea un archivo de Swift ficticio e incluye la siguiente importación para asegurarte de que Xcode pueda encontrar y vincular las bibliotecas de Swift.
```
import Foundation
```
Para asegurarte de que el código Swift esté vinculado correctamente, navega a Target > Build Settings > Always Embed Swift Standard Libraries y verifica que la opción esté configurada en Yes.

Integra reCAPTCHA Enterprise a tu app para iOS

Si deseas integrar reCAPTCHA Enterprise a tu app para iOS, sigue estos pasos en Xcode:

Para crear una instancia del SDK con la clave reCAPTCHA (KEY_ID) que creaste, actualiza la app con el siguiente código:

Swift con guion gráfico

Actualiza ViewController.swift.

Si usas CocoaPods, ignora la línea import RecaptchaEnterprise, ya que la sentencia de importación #import <RecaptchaEnterprise/RecaptchaEnterprise.h> del archivo *-Bridging-Header.h es suficiente.

import RecaptchaEnterprise

class ViewController: UIViewController {
  var recaptchaClient: RecaptchaClient?

  override func viewDidLoad() {
    super.viewDidLoad()
    Task {
      do {
        let client = try await Recaptcha.getClient(withSiteKey: "KEY_ID")
        self.recaptchaClient = client
      } catch let error as RecaptchaError {
         print("RecaptchaClient creation error: \(String(describing: error.errorMessage)).")
      }
    }
  }
}

Si la versión mínima del SO de tu aplicación es anterior a la 13, usa un cierre final:

import RecaptchaEnterprise

class ViewController: UIViewController {
  var recaptchaClient: RecaptchaClient?

  override func viewDidLoad() {
    super.viewDidLoad()
    Recaptcha.getClient(withSiteKey: "KEY_ID") { client, error in
      guard let client = client else {
          print("RecaptchaClient creation error: \(error).")
        return
      }
      self.recaptchaClient = client
    }
  }
}

Swift con SwiftUI

Crea una clase de ViewModel.

import RecaptchaEnterprise

@MainActor class ViewModel: ObservableObject {
  private var recaptchaClient: RecaptchaClient?

  init() {
     Task {
      do {
        let client = try await Recaptcha.getClient(withSiteKey: "KEY_ID")
        self.recaptchaClient = client
      } catch let error as RecaptchaError {
         print("RecaptchaClient creation error: \(String(describing: error.errorMessage)).")
      }
    }
  }
}

Si la versión mínima del SO de tu aplicación es anterior a la 13, usa un cierre final:

import RecaptchaEnterprise

class ViewController: UIViewController {
  var recaptchaClient: RecaptchaClient?

  override func viewDidLoad() {
    super.viewDidLoad()
    Recaptcha.getClient(withSiteKey: "KEY_ID") { client, error in
      guard let client = client else {
          print("RecaptchaClient creation error: \(error).")
        return
      }
      self.recaptchaClient = client
    }
  }
}

Crea una instancia de ViewModel en ContentView.swift.

import SwiftUI
import RecaptchaEnterprise

struct ContentView: View {
  @StateObject private var viewModel = ViewModel()

  var body: some View {
  }
}

struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}

Objective-C

Actualiza ViewController.h.

#import <RecaptchaEnterprise/RecaptchaEnterprise.h>

@interface ViewController : UIViewController
@property (strong, atomic) RecaptchaClient *recaptchaClient;
@end

Actualiza ViewController.m.

@implementation ViewController
[Recaptcha getClientWithSiteKey:@"KEY_ID"
      completion:^void(RecaptchaClient* recaptchaClient, NSError* error) {
        if (!recaptchaClient) {
          NSLog(@"%@", (RecaptchaError *)error.errorMessage);
          return;
        }
        self->_recaptchaClient = recaptchaClient;
      }
];
@end

Crea un botón para llamar a reCAPTCHA Enterprise y activar execute().

Swift con guion gráfico

En el storyboard, crea un botón.
Crea una acción en ViewController vinculada al botón que creaste.

Llama al método execute() pasando una acción Login para mostrar un token de reCAPTCHA usando el siguiente fragmento de código:

guard let recaptchaClient = recaptchaClient else {
  print("RecaptchaClient creation failed.")
  return
}
Task {
  do {
    let token = try await recaptchaClient.execute(withAction: RecaptchaAction.login)
    print(token)
  } catch let error as RecaptchaError {
    print(error.errorMessage)
  }
}

Si la versión mínima del SO de tu aplicación es anterior a la 13, usa un cierre final:

guard let recaptchaClient = recaptchaClient else {
  print("RecaptchaClient creation failed.")
  return
}
recaptchaClient.execute(withAction: RecaptchaAction.login) { token, error in
  if let token = token {
    print(token)
  } else {
    print(error)
  }
}

Swift con SwiftUI

Actualiza ViewModel.swift con el código de ejecución:

import RecaptchaEnterprise

@MainActor class ViewModel: ObservableObject {

  func execute() {
    guard let recaptchaClient = self.recaptchaClient else {
      print("Client not initialized correctly.")
      return
    }

    Task {
      do {
        let token = try await recaptchaClient.execute(withAction: RecaptchaAction.login)
        print(token)
      } catch let error as RecaptchaError {
        print(error.errorMessage)
      }
    }
  }
}

Si la versión mínima del SO de tu aplicación es anterior a la 13, usa un cierre final:

guard let recaptchaClient = recaptchaClient else {
  print("RecaptchaClient creation failed.")
  return
}
recaptchaClient.execute(withAction: RecaptchaAction.login) { token, error in
  if let token = token {
    print(token)
  } else {
    print(error)
  }
}

Actualiza ContentView.swift.

import SwiftUI
import RecaptchaEnterprise

struct ContentView: View {
  @StateObject private var viewModel = ViewModel()

  var body: some View {

    Button {
      viewModel.execute()
    } label: {
      Text("Execute")
    }.padding()

    Spacer()
  }
}

struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}

Objective-C

En el guión gráfico, crea un botón.
Crea una acción en ViewController vinculada al botón que creaste.

Llama al método execute() pasando una acción Login para mostrar un token de reCAPTCHA usando el siguiente fragmento de código:

if (!self->_recaptchaClient) {
  return;
}

[recaptchaClient execute:RecaptchaAction.login
    completion:^void(NSString* _Nullable  token, NSError* _Nullable error) {
  if (!token) {
    NSLog (@"%@", (RecaptchaError *)error.errorMessage);
    return;
  }
  NSLog (@"%@", token);
}];

Prueba tu aplicación:
1. reCAPTCHA Enterprise usa AppAttest de Apple como parte de su motor de detección. Si no planeas usar una clave de prueba con una puntuación fija para el desarrollo local, haz lo siguiente:
  1. En Xcode, agrega la función de App Attest a la app.
  2. En el archivo .entitlements de tu proyecto, configura el entorno de App Attest como production.
2. Para limpiar el entorno de compilación de Xcode, en el menú Producto, haz clic en Limpiar carpeta de compilación.
3. Para ejecutar la aplicación, en el menú Product, haz clic en Run.
4. En la aplicación cargada, haz clic en el botón que creaste antes.
5. Observa tu ventana de salida de depuración para un token de reCAPTCHA (string alfanumérica), que se muestra si la integración se realiza correctamente.

Establece un tiempo de espera para las llamadas a la API

Puedes especificar un valor de tiempo de espera para las APIs de getClient y execute con la propiedad withTimeout de cada API.

Swift

Establece el tiempo de espera para llamar a getClient.

    Task {
      do {
        self.recaptchaClient = try await Recaptcha.getClient(
          withSiteKey: "KEY_ID",
          withTimeout: 15000
        )
      } catch let error as RecaptchaError {
          print("RecaptchaClient creation error: \(String(describing: error.errorMessage)).")
      }
    }

Si la versión mínima del SO de tu aplicación es anterior a la 13, usa un cierre final:

  Recaptcha.getClient(
    withSiteKey: "KEY_ID",
    withTimeout: 15000
  ) { client, error in
    guard let client = client else {
        print("RecaptchaClient creation error: \(error).")
      return
    }
    self.recaptchaClient = client
  }

Establece el tiempo de espera para llamar a execute.

  Task {
    do {
      let token = try await recaptchaClient.execute(
        withAction: RecaptchaAction.login,
        withTimeout: 10000)
      print(token)
    } catch let error as RecaptchaError {
      print(error.errorMessage)
    }
  }

Si la versión mínima del SO de tu aplicación es anterior a la 13, usa un cierre final:

  recaptchaClient.execute(
    withAction: RecaptchaAction.login,
    withTimeout: 10000
  ) { token, error in
    if let token = token {
      print(token)
    } else {
      print(error)
    }
  }

Objective-C

Establece el tiempo de espera para llamar a getClient.

  [Recaptcha getClientWithSiteKey:@"KEY_ID"
              withTimeout:15000.0
               completion:^void(RecaptchaClient *recaptchaClient, NSError *error) {
                 if (!recaptchaClient) {
                   NSLog(@"%@", (RecaptchaError *)error.errorMessage);
                   return;
                 }
                 self->_recaptchaClient = recaptchaClient;
               }];

Establece el tiempo de espera para llamar a execute.

  [recaptchaClient execute:RecaptchaAction.login
      witTimeout:10000.0
      completion:^void(NSString* _Nullable  token, NSError* _Nullable error) {
    if (!token) {
      NSLog (@"%@", (RecaptchaError *)error.errorMessage);
      return;
    }
    NSLog (@"%@", token);
  }];

Referencia de la API

Para obtener una referencia completa de la API de reCAPTCHA para iOS, consulta RecaptchaEnterprise.

¿Qué sigue?

Para evaluar el token de respuesta de reCAPTCHA, crea una evaluación.

Nota: Los tokens de respuesta de reCAPTCHA se evalúan y anotan desde tu servidor de backend, no desde el dispositivo móvil.

Integra reCAPTCHA Enterprise en apps para iOS

Antes de comenzar

Prepara tu entorno de iOS

CocoaPods

Swift Package Manager

Flutter

ReactNative

Descarga directa

Configura la app

Swift

Objective-C

Integra reCAPTCHA Enterprise a tu app para iOS

Swift con guion gráfico

Swift con SwiftUI

Objective-C

Swift con guion gráfico

Swift con SwiftUI

Objective-C

Establece un tiempo de espera para las llamadas a la API

Swift

Objective-C

Referencia de la API

¿Qué sigue?