Construye en Flow: Aprende FCL - 4. Como resolver identidades en .find a direcciones en Flow
Tags: javascript, fcl, flow, web3
Published: 2022-06-09 22:38:39

*Esta es una traducción al español del cuarto artículo de la serie Build on Flow | Learn FCL escrita por [Maksimus Starka](https://twitter.com/MaxStalker).*

**Resumen**

En este artículo, aprenderemos como usar un contrato desplegado e interactuar con él. Interactuar con contractos existentes en la blockchain es un parte esencial de lo que hace a la Web3 especial.

En este tutorial específico:

- Resolveremos un identificador de nombre en `.find` a una dirección `0x` en Flow  (**.find** → 0x)
- Busca el nombre `.find` para una cuenta para una dirección `0x` en Flow (0x0 → **.find**

**Previamente en “Aprende FCL”**

Si trabajaste a través de alguno de nuestros posts previos deberías saber como pasar argumentos a scripts en Cadence. Necesitaremos este conocimiento ya que en este tutorial pasaremos valores `String` y `Address`.

Empecemos! 💪

**Preparación**

Cuando quieras interactuar con algún contrato desplegado, primero necesitas descubrir donde esta desplegado 😅. En nuestro ejemplo específico, .find es un servicio conocido y con la ayuda de su creador [Bjarte](https://github.com/bjartek) fuimos capaces de encontrar la dirección del repositorio en GitHub en [https://github.com/findonflow/find](https://github.com/findonflow/find).

> 💡 Pro Tip: puedes encontrar cualquier contrato que quieras, mientras tengas un hash de la transacción o una dirección de una cuenta que haya interactuado con el contrato en el pasado. Solo visita su historia en [flowscan.org](https://flowscan.org/)!
> 

De vuelta a .find! Excavando un poco, puedes encontrar toda la información que necesitas dentro del archivo [integration.md](https://github.com/findonflow/find/blob/main/integrating.md). Específicamente, dos bloques de código en Cadence que usaremos como nuestros resolvedores. Este método para encontrar un nombre a través de una dirección:

```jsx
import FIND from 0x097bafa4e0b48eef

pub fun main(name: String): Address?{
  return FIND.lookupAddress(name)
}

```

Y este otro para el proceso reverso:

```jsx
import FIND from 0x097bafa4e0b48eef

pub fun main(address: Address) : String?{
  return FIND.reverseLookup(address)
}

```

# Paso 1 - Instalación

Agrega `"onflow/fcl": "1.0.0"` como tu dependencia.

# **Paso 2 - Setup**

Como la última vez importaremos los métodos necesarios para configurar FCL:

```jsx
//Importamos métodos de FCL
import { query, config } from "@onflow/fcl";

// Especifica el endpoint de la API - esta vez usaremos Mainnet
const api = "<https://rest-mainnet.onflow.org>";

// Configurar FCL para usar Testnet como el nodo de acceso
config().put("accessNode.api", api);

```

# Paso 3 - Resolver una Alias de Identidad a una dirección

Ahora crearemos una función llamada `resolveName`. Esta función aceptará un parametro `String`, pasa este a la blockchain junto con nuestro código resolvedor e imprime el resultado:

```jsx
const resolveName = async (name) => {
  // El codigo Cadence que podemos obtener del script "resolve.cdc":
  // <https://github.com/findonflow/find/blob/main/scripts/resolve.cdc>
  // El contrato de .find está deployado en la Mainnet de Flow en la dirección "0x097bafa4e0b48eef"
	// usaremos esta direccion en la declaración de importación
  const cadence = `
    import FIND from 0x097bafa4e0b48eef

    pub fun main(name: String): Address?{
      return FIND.lookupAddress(name) // we'll use .find's native lookupAddress method.
    }
  `;

  const args = (arg, t) => [arg(name, t.String)];

	// "query" es usado para operaciones de sólo lectura en la blockchain.
	// lee más acerca del método "query" en la pagina web de la documentación de Flow:
	// <https://docs.onflow.org/fcl/reference/api/#query>
  const address = await query({ cadence, args });

  console.log(
    `${name} identity has address %c${address}`,
    "color: #36ad68; font-weight: bold"
  );
};

```

# **Paso 4 - Resolver una dirección a un Alias de Identidad**

Hagamos algo similar para revertir el proceso. Crearemos una función llamada `resolveAddress` que acepta una dirección pasada como `String`.

```jsx
const resolveAddress = async (address) => {
	// El código Cadence para resolver una direccion como argumento 
	// a una Address lo podemos obtener del script "name.cdc"
	// <https://github.com/findonflow/find/blob/main/scripts/name.cdc>
	// El contrato de .FIND esta deployado en la dirección "0x097bafa4e0b48eef" - usaremos esa dirección en la declaración de importación.
  const cadence = `
    import FIND from 0x097bafa4e0b48eef

    pub fun main(address: Address) : String?{
      return FIND.reverseLookup(address) // nota la nueva función
    }
  `;

  const args = (arg, t) => [arg(address, t.Address)];
	// "query" pasara código en Cadence para acceder al nodo para su ejecución y nos retornará un resultado
	// lee más acerca del método "query" en la documentación de Flow.
	// <https://docs.onflow.org/fcl/reference/api/#query>
  const name = await query({ cadence, args });

  console.log(
    `${address} address is aliased to %c${name}`,
    "color: #36ad68; font-weight: bold"
  );
};

```

# **Finalmente**

Llamemos las funciones que creamos al final del archivo usando algunos parámetros de prueba.

> ❕Nota: Estamos llamando a esos métodos dentro de una IIFE por simplicidad. Uno puede imaginar ejecutándolos con un botón o como parte de un procedimiento más complejo.
> 

Ejecutar este código debería emitir esto a la consola:

```jsx
bjartek identity has address 0x886f3aeaf848c535
0x886f3aeaf848c535 address is aliased to bjartek
```

Puedes encontrar el código completo en [este Codesandbox](https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e?file=/src/index.js).

Hasta la próxima! 👋

# **Recursos**

- **Código del ejemplo**: [https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e](https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e)
- **Cadence Imports** - [https://docs.onflow.org/cadence/language/imports/](https://docs.onflow.org/cadence/language/imports/) - documentación sobre declaraciones `import` en Cadence.
- **.find GitHub Repository** - [https://github.com/findonflow/find](https://github.com/findonflow/find) - código completo y documentación de la plataforma .find.

 Otros recursos que podrías encontrar útil:

- **Documentación de Flow** - [https://docs.onflow.org/](https://docs.onflow.org/) - Más información detallada acerca de la blockchain de Flow y como interactuar con ella.
- **Flow Portal** - [https://flow.com/](https://flow.com/) - Tu portal de entrada a Flow.
- **FCL JS** - [https://github.com/onflow/fcl-js](https://github.com/onflow/fcl-js) - Código fuente y la habilidad de contribuir a la libreria de FCL JS.
- **Cadence** - [https://docs.onflow.org/cadence/](https://docs.onflow.org/cadence/) - Introduccion a Cadence.
- **Codesandbox** - [https://codesandbox.io](https://codesandbox.io/) - Un editor de texto genial para prototipar en el navegador.