En esta página, se explica cómo integrar reCAPTCHA en tu app para iOS.
Debido a la variación de los dispositivos móviles en cuanto al tamaño de pantalla, el rendimiento y de las aplicaciones, el desafío de reCAPTCHA de la casilla de verificación visual (no soy un robot) no está disponible en aplicaciones para dispositivos móviles con iOS. En su lugar, puedes implementar tu propia solución estrategia de aplicación por niveles, como un flujo de MFA para proporcionar una alternativa la ruta de canje correspondiente al tráfico sospechoso.
El SDK hace uso de reflexión y código dinámico para permitir la actualización y el perfeccionamiento del sistema de detección en aplicaciones o SDKs ya implementados. Para evitar interferencias en la aplicación, el conjunto de clases disponibles en el sistema está restringido a una lista cuidadosamente controlada.
Antes de comenzar
Establece el SDK mínimo de tu app en iOS 12 o crea una app para dispositivos móviles nueva.
Crea una clave de reCAPTCHA para la plataforma de apps para iOS.
Como alternativa, puedes copiar el ID de una clave reCAPTCHA existente para iOS si realizas uno de los siguientes pasos:
Para copiar el ID de una clave existente desde la consola de Google Cloud, haz lo siguiente:
Ve a la página reCAPTCHA.
- 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 de 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 de vista única para iOS en blanco.
Descarga el SDK con una de las siguientes opciones:
CocoaPods
- Descarga e instala CocoaPods.
Crea un Podfile y agrega las siguientes líneas a tu Podfile:
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.6.0" ... end
Ejecuta
pod update
para instalar las dependencias requeridas.
Swift Package Manager
- En Xcode, selecciona File > Add Packages y, luego, ingresa el
siguiente URL en el campo Search o Enter Package URL:
https://github.com/GoogleCloudPlatform/recaptcha-enterprise-mobile-sdk
En el 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 Token de acceso personal debe tener los permisos que se indican en el diálogo de Acceso con XCode.
Xcode instala el SDK y sus dependencias necesarias.
Flutter
Si deseas obtener instrucciones detalladas para usar reCAPTCHA a través de Flutter, consulta la documentación de Flutter.
ReactNative
Para obtener instrucciones detalladas sobre el uso de reCAPTCHA a través de React Native, consulta la documentación de React Native.
Descarga directa
Si quieres descargar el SDK y sus dependencias como xcframeworks, descarga el cliente.
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, incluye la siguiente importación:
import RecaptchaEnterprise
Objective-C
Si tu app está escrita en Objective-C, crea un archivo Swift ficticio y agrega 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 enYes
.
Integra reCAPTCHA en tu app para iOS
Para integrar reCAPTCHA en tu app para iOS, sigue estos pasos en Xcode:
Para crear una instancia del SDK con la clave de reCAPTCHA (KEY_ID) que creaste, actualiza la app con el siguiente código:
Swift con Storyboard
Actualiza
ViewController.swift
.import RecaptchaEnterprise class ViewController: UIViewController { var recaptchaClient: RecaptchaClient? override func viewDidLoad() { super.viewDidLoad() Task { do { self.recaptchaClient = try await Recaptcha.fetchClient(withSiteKey: "KEY_ID") } 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 inferior a 13, usa un cierre final en su lugar:
import RecaptchaEnterprise class ViewController: UIViewController { var recaptchaClient: RecaptchaClient? override func viewDidLoad() { super.viewDidLoad() Recaptcha.fetchClient(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
ViewModel
.import RecaptchaEnterprise @MainActor class ViewModel: ObservableObject { private var recaptchaClient: RecaptchaClient? init() { Task { do { self.recaptchaClient = try await Recaptcha.fetchClient(withSiteKey: "KEY_ID") } 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 inferior a 13, usa un cierre final en su lugar:
import RecaptchaEnterprise class ViewController: UIViewController { var recaptchaClient: RecaptchaClient? override func viewDidLoad() { super.viewDidLoad() Recaptcha.fetchClient(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
enContentView.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 fetchClientWithSiteKey:@"KEY_ID" completion:^void(RecaptchaClient* recaptchaClient, NSError* error) { if (!recaptchaClient) { NSLog(@"%@", (RecaptchaError *)error.errorMessage); return; } self->_recaptchaClient = recaptchaClient; } ]; @end
La inicialización del SDK puede tardar varios segundos en completarse. Para mitigar esta latencia, inicializa el cliente lo antes posible, por ejemplo, durante la llamada
onCreate()
de una claseApplication
personalizada. No debes hacer que los elementos de la IU se bloqueen en el SDK de reCAPTCHA.Crea un botón para llamar a reCAPTCHA 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 crear. Llama al método
execute()
pasando una acciónLogin
para mostrar un token de reCAPTCHA mediante 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 inferior a 13, usa un cierre final en su lugar:
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 inferior a 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()
y pasa una acciónLogin
para mostrar un token de reCAPTCHA: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); }];
La API de
execute
del cliente puede tardar varios segundos en completa, por ejemplo, en condiciones de redes lentas o si está esperando se complete la inicialización en segundo plano. Asegúrate de que elexecute()
llame no bloquees un evento de la IU, como presionar un botón.Prueba tu aplicación:
reCAPTCHA 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:
En Xcode, agrega la función de App Attest a la app.
En el archivo
.entitlements
de tu proyecto, configura el entorno de App Attest comoproduction
.
Para limpiar el entorno de compilación de Xcode, en el menú Producto, haz clic en Limpiar la carpeta de compilación.
Para ejecutar la aplicación, en el menú Producto, haz clic en Ejecutar.
En la aplicación cargada, haz clic en el botón que creaste. anteriormente.
Observa tu ventana de salida de depuración para ver un token reCAPTCHA (cadena alfanumérica), que se muestra si la integración se realiza correctamente.
Migra de la API del método al método fetchClient
El método fetchClient
muestra un RecaptchaClient
que vuelve a intentar la inicialización en caso de fallas de red. Si la app no tiene
el acceso a la red cuando se crea el cliente, este sigue reintentando
cuando se adquiere una red.
Si llamas a execute(timeout)
y el cliente aún no está listo, intenta
para inicializarse antes de mostrar un token o un RecaptchaErrorCode.
En el siguiente ejemplo, se muestra cómo migrar de getClient
a fetchClient
.
Swift con guion gráfico
// Migrate from getClient
func initializeWithGetClient() {
Task {
do {
self.recaptchaClient = try await Recaptcha.getClient(withSiteKey: "KEY_ID")
} catch let error as RecaptchaError {
print("RecaptchaClient creation error: \(String(describing: error.errorMessage)).")
}
}
}
// Migrate to fetchClient
func initializeWithFetchClient() {
Task {
do {
self.recaptchaClient = try await Recaptcha.fetchClient(withSiteKey: "KEY_ID")
} 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 inferior a 13, usa un cierre final:
// Migrate from getClient
override func initializeWithGetClient() {
Recaptcha.getClient(withSiteKey: "KEY_ID") { client, error in
guard let client = client else {
print("RecaptchaClient creation error: \(error).")
return
}
self.recaptchaClient = client
}
}
// Migrate to fetchClient
override func initializeWithFetchClient() {
Recaptcha.fetchClient(withSiteKey: "KEY_ID") { client, error in
guard let client = client else {
print("RecaptchaClient creation error: \(error).")
return
}
self.recaptchaClient = client
}
}
Swift con SwiftUI
// Migrate from getClient
initializeWithGetClient() {
Task {
do {
self.recaptchaClient = try await Recaptcha.getClient(withSiteKey: "KEY_ID")
} catch let error as RecaptchaError {
print("RecaptchaClient creation error: \(String(describing: error.errorMessage)).")
}
}
}
// Migrate to fetchClient
initializeWithFetchClient() {
Task {
do {
self.recaptchaClient = try await Recaptcha.fetchClient(withSiteKey: "KEY_ID")
} 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 inferior a 13, usa un cierre final en su lugar:
// Migrate from getClient
func initializeWithGetClient() {
super.viewDidLoad()
Recaptcha.getClient(withSiteKey: "KEY_ID") { client, error in
guard let client = client else {
print("RecaptchaClient creation error: \(error).")
return
}
self.recaptchaClient = client
}
}
// Migrate to fetchClient
func initializeWithFetchClient() {
super.viewDidLoad()
Recaptcha.fetchClient(withSiteKey: "KEY_ID") { client, error in
guard let client = client else {
print("RecaptchaClient creation error: \(error).")
return
}
self.recaptchaClient = client
}
}
Objective-C
// Migrate from getClient
@implementation ViewController
[Recaptcha getClientWithSiteKey:@"KEY_ID"
completion:^void(RecaptchaClient* recaptchaClient, NSError* error) {
if (!recaptchaClient) {
NSLog(@"%@", (RecaptchaError *)error.errorMessage);
return;
}
self->_recaptchaClient = recaptchaClient;
}
];
@end
// Migrate to fetchClient
@implementation ViewController
[Recaptcha fetchClientWithSiteKey:@"KEY_ID"
completion:^void(RecaptchaClient* recaptchaClient, NSError* error) {
if (!recaptchaClient) {
NSLog(@"%@", (RecaptchaError *)error.errorMessage);
return;
}
self->_recaptchaClient = recaptchaClient;
}
];
@end
Establece un tiempo de espera para las llamadas a la API
Puedes especificar un valor de tiempo de espera para las APIs de execute
con el comando
propiedad withTimeout
.
Swift
Establece el tiempo de espera cuando llames 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 inferior a 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 cuando llames 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); }];
Soluciona errores
Si la app no se puede comunicar con el servicio de reCAPTCHA correctamente, es posible que la API haya detectado un error. Debes agregar en tu app para manejar correctamente estos errores.
Para obtener más detalles sobre las mitigaciones de errores comunes de la API, consulta RecaptchaErrorCode.
Referencia de 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.