> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

> Un widget que ofrece una experiencia de Login y registro sin fricciones para tus aplicaciones nativas de iOS.

# Lock.swift

export const AuthCodeBlock = ({filename, icon, language, highlight, children}) => {
  const [displayText, setDisplayText] = useState(children);
  const [copyText, setCopyText] = useState(children);
  const wrapperRef = React.useRef(null);
  useEffect(() => {
    let unsubscribe = null;
    function init() {
      if (!window.autorun || !window.rootStore) {
        return;
      }
      unsubscribe = window.autorun(() => {
        let processedChildrenForDisplay = children;
        let processedChildrenForCopy = children;
        for (const [key, value] of window.rootStore.variableStore.values.entries()) {
          const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
          let displayValue = value;
          if (key === "{yourClientSecret}" && value !== "{yourClientSecret}") {
            displayValue = value.substring(0, 3) + "*****ENMASCARADO*****";
          }
          processedChildrenForDisplay = processedChildrenForDisplay.replaceAll(new RegExp(escapedKey, "g"), displayValue);
          processedChildrenForCopy = processedChildrenForCopy.replaceAll(new RegExp(escapedKey, "g"), value);
        }
        setDisplayText(processedChildrenForDisplay);
        setCopyText(processedChildrenForCopy);
      });
    }
    if (window.rootStore) {
      init();
    } else {
      window.addEventListener("adu:storeReady", init);
    }
    return () => {
      window.removeEventListener("adu:storeReady", init);
      unsubscribe?.();
    };
  }, [children]);
  useEffect(() => {
    if (!wrapperRef.current) return;
    const originalWriteText = navigator.clipboard.writeText.bind(navigator.clipboard);
    let isOverriding = false;
    const handleClick = e => {
      const button = e.target.closest('[data-testid="copy-code-button"]');
      if (!button || !wrapperRef.current.contains(button)) return;
      isOverriding = true;
      navigator.clipboard.writeText = text => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
          return originalWriteText(copyText);
        }
        return originalWriteText(text);
      };
      setTimeout(() => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
        }
      }, 100);
    };
    const wrapper = wrapperRef.current;
    wrapper.addEventListener('click', handleClick, true);
    return () => {
      wrapper.removeEventListener('click', handleClick, true);
      if (navigator.clipboard.writeText !== originalWriteText) {
        navigator.clipboard.writeText = originalWriteText;
      }
    };
  }, [copyText]);
  return <div ref={wrapperRef}>
      <CodeBlock filename={filename} icon={icon} language={language} lines highlight={highlight}>
        {displayText}
      </CodeBlock>
    </div>;
};

Esta guía de referencia le mostrará cómo implementar la interfaz de usuario de Lock y le dará detalles sobre cómo configurar y personalizar Lock para usarlo como interfaz para sus necesidades de autenticación. Sin embargo, si desea aprender a hacer más con Auth0 y Swift, como guardar, usar y renovar <Tooltip tip="Token de acceso: credencial de autorización, en forma de una cadena opaca o JWT, que se usa para acceder a una API." cta="Ver glosario" href="/es/docs/glossary?term=Access+Tokens">Tokens de acceso</Tooltip>, obtener información del perfil de usuario y mucho más, consulte el [SDK Auth0.swift](/es/docs/libraries/auth0-swift). O bien, eche un vistazo al [Quickstart de Swift](/es/docs/quickstart/native/ios-swift) para ver ejemplos completos y las opciones disponibles, tanto para usar Lock como interfaz como para usar una interfaz personalizada.

Consulte el [repositorio de Lock.swift](https://github.com/auth0/Lock.swift) en GitHub.

<div id="requirements">
  ## Requisitos
</div>

* iOS 9+
* Xcode 11.4+ / 12.x
* Swift 4.x / 5.x

<div id="install">
  ## Instalación
</div>

<div id="cocoapods">
  ### Cocoapods
</div>

Si utiliza [Cocoapods](https://cocoapods.org), añada esta línea a su `Podfile`:

`pod 'Lock', '~> 2.0'`

A continuación, ejecute `pod install`.
Para obtener más información sobre Cocoapods, consulte [la documentación oficial](https://guides.cocoapods.org/using/getting-started.html).

<div id="carthage">
  ### Carthage
</div>

Si usas [Carthage](https://github.com/Carthage/Carthage), agrega la siguiente línea a tu `Cartfile`:

`github "auth0/Lock.swift" ~> 2.0`
Después, ejecuta `carthage bootstrap`.
Para obtener más información sobre cómo usar Carthage, consulta [la documentación oficial](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos).

<div id="spm">
  ### SPM
</div>

Si utiliza Swift Package Manager, abra la siguiente opción del menú en Xcode:

**File > Swift Packages > Add Package Dependency...**

En la pantalla **Choose Package Repository**, agregue esta URL:

`https://github.com/auth0/Lock.swift.git`

Luego, haga clic en **Next** y complete los pasos restantes.

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  Para obtener más información sobre SPM, consulte la [documentación oficial](https://developer.apple.com/documentation/xcode/adding-package-dependencies-to-your-app).
</Callout>

<div id="set-up">
  ## Configuración
</div>

<div id="integrate-with-your-application">
  ### Integra Lock con tu aplicación
</div>

Hay que notificar a Lock cuando se solicite a la aplicación abrir una URL. Puedes hacerlo en el archivo `AppDelegate`.

```swift lines theme={null}
func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
  return Lock.resumeAuth(url, options: options)
}
```

<div id="import-lock">
  ### Importa Lock
</div>

Importa **Lock** donde lo necesites

`import lock`

<div id="auth0-credentials">
  ### Credenciales de Auth0
</div>

Para usar Lock, debe proporcionar su Auth0 <Tooltip tip="ID de cliente: valor de identificación asignado por Auth0 a su recurso registrado." cta="Ver glosario" href="/es/docs/glossary?term=Client+Id">ID de cliente</Tooltip> y su dominio, que puede encontrar en la configuración de su aplicación dentro del [Auth0 Dashboard](https://manage.auth0.com/#).

En el paquete de su aplicación, puede agregar un archivo `plist` llamado `Auth0.plist` que incluya sus credenciales con el siguiente formato.

export const codeExample = `<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>ClientId</key>
  <string>{yourClientId}</string>
  <key>Domain</key>
  <string>{yourDomain}</string>
</dict>
</plist>`;

<AuthCodeBlock children={codeExample} language="xml" />

<div id="implementation-of-lock-classic">
  ## Implementación de Lock Classic
</div>

Lock Classic gestiona la autenticación mediante conexiones de base de datos, sociales y empresariales.

<div id="oidc-conformant-mode">
  ### Modo OIDC Conformant
</div>

Se recomienda encarecidamente usar este SDK en modo OIDC Conformant. Cuando este modo está activado, obliga al SDK a usar el flujo de autenticación actual de Auth0 e impide que acceda a endpoints legados. El valor predeterminado es `false`

```swift lines theme={null}
.withOptions {
    $0.oidcConformant = true
}
```

Para mostrar Lock, agrega el siguiente fragmento a tu UIViewController.

```swift lines theme={null}
Lock
    .classic()
    // withConnections, withOptions, withStyle, y demás
    .withOptions {
      $0.oidcConformant = true
      $0.scope = "openid profile"
    }
    .onAuth { credentials in
      // Guardemos el valor de credentials.accessToken
    }
    .present(from: self)
```

<div id="use-auth0swift-library-to-access-user-profile">
  ## Use la biblioteca Auth0.Swift para acceder al perfil de usuario
</div>

Para acceder a la información del perfil de usuario, deberá usar la biblioteca `Auth0.Swift`:

```swift lines theme={null}
Auth0
   .authentication()
   .userInfo(withAccessToken: accessToken)
   .start { result in
       switch result {
       case .success(let profile):
           print("User Profile: \(profile)")
       case .failure(let error):
           print("Failed with \(error)")
       }
   }
```

Consulta la [documentación de la biblioteca Auth0.Swift](/es/docs/libraries/auth0-swift) para obtener más información sobre cómo usarla.

<div id="specify-connections">
  ## Especificar conexiones
</div>

Lock cargará automáticamente las conexiones configuradas para su aplicación. Si desea anular el comportamiento predeterminado, puede especificar manualmente qué conexiones debe mostrar a los usuarios como opciones de autenticación. Para ello, llame al método y proporcione un closure que permita especificar la(s) conexión(es).

Agregar una conexión de base de datos:

```swift lines theme={null}
.withConnections {
    connections.database(name: "Username-Password-Authentication", requiresUsername: true)
}
```

Agregar varias conexiones sociales:

```swift lines theme={null}
.withConnections {
    connections.social(name: "facebook", style: .Facebook)
    connections.social(name: "google-oauth2", style: .Google)
}
```

<div id="styling-and-customization">
  ## Estilo y personalización
</div>

Lock ofrece muchas opciones de estilo para ayudarte a aplicar la identidad de tu marca a Lock con `withStyle`. Por ejemplo, puedes cambiar el color principal y el texto del encabezado de tu widget de Lock:

<div id="customize-your-title-logo-and-primary-color">
  ### Personaliza el título, el logotipo y el color principal
</div>

```swift lines theme={null}
.withStyle {
  $0.title = "Company LLC"
  $0.logo = LazyImage(named: "company_logo")
  $0.primaryColor = UIColor(red: 0.6784, green: 0.5412, blue: 0.7333, alpha: 1.0)
}
```

Puedes consultar el conjunto completo de opciones de estilo para modificar la apariencia de Lock en tu aplicación en la [Guía de personalización](/es/docs/libraries/lock-swift/lock-swift-customization).

<div id="configuration-options">
  ## Opciones de configuración
</div>

Hay numerosas opciones para configurar el comportamiento de Lock. A continuación, se muestra un ejemplo de Lock configurado para que se pueda cerrar, limitarlo únicamente a usernames (y no a correos electrónicos) y mostrar solo las pantallas de Login y Restablecer contraseña.

```swift lines theme={null}
Lock
  .classic()
  .withOptions {
    $0.closable = true
    $0.usernameStyle = [.Username]
    $0.allow = [.Login, .ResetPassword]
  }
```

Puede consultar el conjunto completo de opciones de configuración del comportamiento para modificar la forma en que funciona Lock en su aplicación en la [Guía de configuración](/es/docs/libraries/lock-swift/lock-swift-configuration-options).

<div id="password-manager-support">
  ## Compatibilidad con gestores de contraseñas
</div>

De forma predeterminada, la compatibilidad con gestores de contraseñas mediante [1Password](https://1password.com/) está habilitada para las conexiones de base de datos. La compatibilidad con 1Password sigue requiriendo que el usuario tenga instalada la aplicación 1Password para que la opción sea visible en las pantallas de Login y registro. Puede deshabilitar la compatibilidad con 1Password mediante la propiedad enabled de passwordManager.

```swift lines theme={null}
.withOptions {
    $0.passwordManager.enabled = false
}
```

De forma predeterminada, `appIdentifier` se establecerá con el identificador de paquete de la app y `displayName` con el nombre para mostrar de la app. Puede personalizarlos de la siguiente manera:

```swift lines theme={null}
.withOptions {
    $0.passwordManager.appIdentifier = "www.myapp.com"
    $0.passwordManager.displayName = "My App"
}
```

Deberá añadir lo siguiente al archivo `info.plist` de su aplicación:

```xml lines theme={null}
<key>LSApplicationQueriesSchemes</key>
<array>
    <string>org-appextension-feature-password-management</string>
</array>
```

<div id="learn-more">
  ## Más información
</div>

* [Lock.swift: Opciones de personalización del estilo](/es/docs/libraries/lock-swift/lock-swift-customization)
* [Lock.swift: Opciones de configuración](/es/docs/libraries/lock-swift/lock-swift-configuration-options)
* [Lock.swift: Campos personalizados al registrarse](/es/docs/libraries/lock-swift/lock-swift-custom-fields-at-signup)
* [Internacionalización de Lock.swift](/es/docs/customize/internationalization-and-localization/lock-swift-internationalization)
* [Logout](/es/docs/authenticate/login/logout)