Desarrollo de Aplicaciones con APIs de Blizzard: Guía Completa

Clase 3 de 27Curso Avanzado de Vue.js 2

> En esta sección vamos a explicar algunos conceptos del portal de desarrolladores de Blizzard que vamos a necesitar para el desarrollo de nuestra app.

Main

Este es el portal oficial de desarrolladores de Blizzard. Aquí encontrarás toda la información necesaria. > 📗 https://develop.battle.net/

Crear Cuenta

> 📗 https://us.battle.net/account/creation/es/

Para poder usar las APIs de Blizzard es necesario crearse una cuenta. Crea tu cuenta desde el siguiente enlace: https://us.battle.net/account/creation/es/

Blizzard Authenticator

Una vez hayas creado tu cuenta, el siguiente paso es que te instales en el móvil la aplicación "Blizzard Authenticator".
El Authenticator de Blizzard es obligatorio y ofrece una capa extra de seguridad contra accesos no autorizados a tu cuenta.

Descarga la aplicación Blizzard Authenticator de la App Store o desde Google Play para continuar.

Uso

Cuando entres a tu cuenta, recibirás una solicitud de autenticación en tu equipo. Si el código de tu equipo es el mismo que el de tu ordenador, presiona Aprobar.

Abre la aplicación de Blizzard Authenticator, verás algo parecido a esto:
mobile-1

Desde el formulario de iniciar sesión, pon tu usuario y tu contraseña. Antes de terminar el inicio de sesión, te pedirán que confirmes el acceso
auth-1

Ahora, en la app Blizzard Authenticator, te aparecerá el código. Pulsa el botón de "Autorizar"
mobile-2

Una vez que hayas aceptado desde la app en tu teléfono móvil verás algo como esto:
auth-2

Seguridad

Si inicias sesión siempre desde la misma ubicación, puede que no se te pida un código de Authenticator. Esto permite iniciar sesión más rápido cuando te encuentras en una ubicación segura.

Si recibes una solicitud de autenticación que no hayas iniciado, haz clic en Denegar y cambia tu contraseña de Blizzard.


Client Credentials Flow

> 📗 https://develop.battle.net/documentation/guides/using-oauth/client-credentials-flow

Para consumir las APIs de Diablo III (o cualquier otro juego de Blizzard) es necesario previamente haber obtenido un token de acceso, que a partir de ahora lo llamaremos el "token". El token de acceso es una credencial usada para acceder a los recursos protegidos de la API. Este tipo de flujo, el flujo "Client Credentials Flow" se usa para la mayoría de las solicitudes a las APIs de Blizzard.

Cuando entras en la aplicación (https://diablo3.netlify.com/), lo primero que ves es un "Loading". Eso es porque la aplicación está obteniendo el token. Más adelante entenderás cómo se hace.

Loading


Puedes ver el RFC de OAuth si quieres saber más acerca del "Client Credentials Flow"

Regiones

> 📗 https://develop.battle.net/documentation/guides/regionality-and-apis

Blizzard emplea varios conceptos basados en la región para administrar y servir los datos de los juegos.

Los datos de las APIs están limitados a regiones específicas. Por ejemplo, las APIs de Europa (eu) a las que se acceden a través de eu.battle.net solo contienen datos de grupos de batalla y reinos de Europa.

En este caso nos vamos a centrar en las regiones para Diablo III. Puede ser que esta información cambie para otros juegos como Starcraft o WoW. Las regiones y los datos a los que tienen acceso son los siguientes:

RegiónDatos
USBattle.net, WoW, D3, SC2
EUBattle.net, WoW, D3, SC2
KRBattle.net, WoW, D3, SC2
TWBattle.net, WoW, D3, SC2
CNBattle.net, WoW, D3, SC2

Aunque estas son todas las regiones que podemos utilizar, la región de China (CN) no la vamos a usar en nuestra aplicación. Tiene un funcionamiento distinto al resto de las regiones. Por eso, para este curso la dejaremos de lado.

Diablo III APIs

Diablo III nos ofrece dos tipos de APIs, que tienen URLs diferentes y usaremos de forma distinta en nuestra aplicación.

En este curso, construirás la aplicación de D3PF utilizando estos dos tipos de APIs. Guárdate los enlaces a la documentación de las APIs, pues las usaremos a menudo para consultar cómo se traen los datos, parámetros requeridos, etc.

APIs de comunidad

Las APIs de comunidad de Diablo III, nos van a traer datos del perfil del usuario que estemos buscando, como por ejemplo, los héroes que tiene o élites que ha matado a lo largo del tiempo.

Consulta la información detallada aquí: https://develop.battle.net/documentation/diablo-3/community-apis

APIs de datos

A través de las APIs de datos del juego de Diablo III, podemos obtener información sobre las temporadas, los rankings y las eras (las eras son parecidas a las temporadas, un espacio temporal limitado)

> 📗 Consulta la información detallada aquí: https://develop.battle.net/documentation/diablo-3/game-data-apis

Acceso a las APIs: Clientes

Para poder consumir las APIs de Diablo III, como ya sabes, vas a necesitar un token. Dicho token es el resultado de hacer una llamada http de tipo POST a un servidor de Blizzard con unos parámetros específicos.
Lo que nos devuelva dicha llamada será, si todo ha ido bien, el token. Una vez que tengamos el token, lo guardaremos en nuestra aplicación de forma temporal. Y cada vez que hagamos una llamada a una API del juego usaremos este token.

Para poder obtener el token, vas a tener que crear un cliente. Deberías crear un cliente por cada aplicación, no utilices el mismo cliente en varias aplicaciones.

Crea tu cliente de acceso a APIs desde este enlace: https://develop.battle.net/access/clients/create

Formulario

Rellena el formulario y dale a crear:

  • Client Name: te va a servir para identificar los distintos clientes que tengas. Puedes poner, por ejemplo, "D3PF" que es el nombre de la app.
  • Redirect URIs: Este campo no lo vamos a usar por el tipo de flujo OAuth que estamos usando.
  • Service URL: De momento lo dejas en blanco. No te olvides de marcar el checkbox de "I do not have a service URL for this client." Cuando tengas tu app subida en la nube, deberás volver a editar la información de este cliente y actualizar este campo.
  • Intended Use: ¿Para qué lo vas a usar? ¿Cómo lo vas a usar? Responde a estas preguntas.
    Para el caso de esta app puedes poner algo parecido a esto: "Try the new apis and provide players information about their D3 characters", que significa que vas a usar las APIs para "probar las nuevas APIs y proporcionar información sobre los personajes de D3"

Una vez se haya creado, deberías ver algo parecido a esto: Client

Durante este curso, aprenderás a obtener un token de acceso de los servidores de Blizzard. Para ello, vas a usar el clientID y el clientSecret.

No compartas tu clienteSecret con nadie, intenta guardarlo en un lugar seguro.
Más adelante verás un posible método para tener estos datos de forma privada, pero accesibles desde la aplicación. ¿Cómo te imaginas que lo haremos?

Todos los clientes tienen unos límites a la hora de consumir APIs. Para evitar sobrecargas en los servidores, las APIs tienen las siguientes restricciones:

  • Cuota a largo plazo: 36,000 peticiones por hora
  • Cuota a corto plazo: 100 peticiones por segundo

Puedes gestionar todos tus clientes desde aquí: https://develop.battle.net/access/clients


Antes de pasar a la siguiente lectura deberías haber creado tu cliente y tener tu ClientId y tu ClientSecret.

¡Perfecto! Ya tienes todo lo necesario para empezar a darle forma a la app en Vue. ¡Dejemos la teoría de lado y empecemos a picar código!