Redirigiendo al usuario

En esta sección, encontrarás cómo redirigir al usuario en tus aplicaciones en la experiencia de by Unico

---

El campo userRedirectUrl se usa para redirigir al usuario. Este campo se recibe en la respuesta de éxito de la creación del proceso al realizar la solicitud CreateProcess.

Aquí encontrarás las 3 formas de gestionar la experiencia del usuario en tus aplicaciones:

Web

(1) Usando Redirect:

Se recomienda seguir los siguientes pasos:

• En tu flujo común (que está inserto en el Registro by Unico) redirigirás al cliente al enlace generado a través de la API;

• Después de eso, el cliente dentro de la plataforma realiza los procedimientos necesarios para continuar el flujo;

• Cuando se complete, será redirigido a tu página (utilizando el redirectUrl pasado en la creación del proceso).

(2) Usando window.open():

La opción window.open() consiste en abrir una nueva pestaña en el navegador del usuario para que pueda completar el proceso. Al final, esta pestaña se cierra y se redirige a tu aplicación.

Para esto se recomienda:

• Seguir la documentación pública sobre esto, que se encuentra aquí;

• Monitorear si hubo un cambio de URL (para la redirectUrl) y luego cerrar la pestaña utilizando window.close().

Android

Paso 1: Usando CustomTabs para la integración

1 - Agrega al archivo app/build.gradle la dependencia necesaria para usar CustomTabs:

implementation("androidx.browser:browser:1.5.0")

Paso 2: Abriendo una CustomTab

import android.net.Uri
import androidx.activity.ComponentActivity
import androidx.browser.customtabs.CustomTabsClient
import androidx.browser.customtabs.CustomTabsIntent

class CustomTabActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)

       openCustomTab(<URL_CBU>)
    }

    fun openCustomTab(url: String) {
        val builder = CustomTabsIntent.Builder()
        val customTabsIntent = builder.build()
        customTabsIntent.launchUrl(this, Uri.parse(url))
    }
}

Paso 3: Modificando AndroidManifest

Agrega en AndroidManifest.xml los permisos e intents necesarios en la Activity que recibirá el callback_uri. Es necesario incluir el atributo android:launchMode="singleTop" y también la etiqueta <data> con la información de la URI.

<uses-feature android:name="android.hardware.camera" android:required="false"/>
<uses-permission android:name="android.permission.CAMERA"/> 
// necessário ter as permissões de câmera e geolocalização 

<activity
    android:name=".CustomTabActivity"
    android:exported="true"
    android:label="@string/app_name"
    android:theme="@style/Theme.Customtabs"
    android:launchMode="singleTop">

    <intent-filter android:label="Custom Tab">
        <action android:name="android.intent.action.VIEW" />

        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />

        <!-- scheme e host são os dados fornecidos na criação de um processo no campo callback_uri
        callback_uri: "foobar://success?code=1234" -->
        <data android:scheme="foobar" android:host="success"/>
    </intent-filter>

</activity>

Permisos necesarios para funcionar correctamente:

• Cámara;

• Geolocalización.

Paso 4: Obteniendo la información de retorno

Para capturar la información de redirección con los datos proporcionados, puedes usar el siguiente código en el método onNewIntent de tu Activity:

override fun onNewIntent(intent: Intent) {
    super.onNewIntent(intent)

    val url = intent.data
    val scheme = url.scheme // "foobar"
    val host = url.host // "success"
    val code = url.getQueryParameter("code") // "1234"
}

iOS

Paso 1: Crear el controlador de autenticación

1 - El primer paso es crear el controlador de autenticación. Para esto, crea una clase llamada UnicoAuthenticationController (o el nombre que prefieras).

2 - A continuación, importa el framework AuthenticationServices en la parte superior de la clase.

3 - Declara la clase como NSObject e implementa el protocolo ASWebAuthenticationPresentationContextProviding.

• El resultado debería verse así:

import AuthenticationServices

class UnicoAuthenticationController: NSObject, ASWebAuthenticationPresentationContextProviding {
    func presentationAnchor(for session: ASWebAuthenticationSession) -> ASPresentationAnchor {
           if let windowScene = UIApplication.shared.connectedScenes.first as? UIWindowScene {
               if let mainWindow = windowScene.windows.first {
                   return mainWindow
               }
           }
           return ASPresentationAnchor()
       }
}

Paso 2: Implementar la autenticación

1 - Abre el archivo donde manejas la autenticación y agrega las importaciones necesarias (por ejemplo, ContentView.swift).

import SwiftUI
import AuthenticationServices

2 - Para controlar el estado del flujo, crea una propiedad con @State.

@State private var finished = false

3 - Crea una instancia de la clase UnicoAuthenticationController fuera del cuerpo de la estructura ContentView.

let unicoController = UnicoAuthenticationController()

4 - Para la validación del proceso, crea una función llamada redirectUser.

func redirectUser() {
        guard let url = URL(string: "URL_AUTHENTICATION") else { return }

        var session: ASWebAuthenticationSession?
        session = ASWebAuthenticationSession(url: url, callbackURLScheme: "BUNDLE") { callbackURL, error in
            guard callbackURL != nil else {
                if let error = error {
                    return print("Erro durante o processo: \(error.localizedDescription)")
                }
                return
            }

            // Processa o URL de callback para verificar se o processo foi finalizado
            session?.cancel()
            finished = true
        }

        session?.presentationContextProvider = unicoController
        session?.prefersEphemeralWebBrowserSession = true
        session?.start()
    }

Entornos:

Recuerda cambiar la url URL_AUTHENTICATION por la URL de autenticación proporcionada en tu proceso. También ajusta el callbackURLScheme BUNDLE para el redireccionamiento indicado al crear el proceso (se recomienda usar el Bundle Identifier de tu aplicación).

Autenticación única:

Es importante configurar prefersEphemeralWebBrowserSession en true para asegurar una autenticación única por proceso.

También es posible utilizar el enlace generado por by Unico en frameworks híbridos. Para ello, puedes crear un bridge entre el framework utilizado con el nativo y seguir lo que sugerimos en la documentación o utilizar alguna biblioteca que ofrezca estas opciones de integración.

La integración de la WebView en tu aplicación es de total responsabilidad del cliente, ya que esta funcionalidad no es ofrecida como parte de las bibliotecas o SDKs de Unico. Debido a esto, no ofrecemos soporte técnico para dudas o problemas relacionados con la implementación de la WebView en tu aplicación. Para obtener orientaciones sobre la configuración, recomendamos consultar la documentación oficial de la tecnología utilizada en tu proyecto (por ejemplo, React Native, Flutter, etc).

---

¿Dudas?

¿No encontraste algo o aún necesitas ayuda? Si ya eres cliente o socio, puedes ponerte en contacto a través del Centro de Ayuda.