¿Cómo integrar Instagram en App Studio?


Hace unos días en un evento llevado a cabo en Bogotá, Colombia, me hicieron una pregunta la cual dejaré plasmada en este blog y es ¿Cómo integrar Instagram en una aplicación hecha con App Studio?.

Para ello supongo que ya se tendrán las bases necesarias para hacer una aplicación base en esta plataforma, aquí usaré la plantilla de “Mi banda favorita” y haré alusión a un grupo de música electrónica llamado Disclosure.


Luego de que se haya cargado la plantilla, hacer los cambios necesarios y en mi caso dejé toda la aplicación sin secciones para no tener distracciones.

En las secciones básicas se podrán encontrar varias opciones, en este caso solo nos interesa Instagram, pinchamos en esta opción donde nos aparecerá el siguiente cuadro de diálogo.

En esta opción lo más importante es la llave de API, ya que esto proporciona seguridad a ambas aplicaciones, la que estamos haciendo para que ningún factor externo acceda a nuestros permisos y pueda hacer suplantación de identidad como al mismo tiempo proporciona seguridad a Instagram ya que puede identificar quién y cómo está accediendo a la aplicación.

En el dialogo se puede ver un texto como el siguiente “You need a Instagram Key to use this datasource. Click here to create a new Instagram Key.” a donde dice Click here, hacer click. Esto nos llevará a otra ventana para administrar la creación de claves.

En esta ventana se pueden apreciar 3 cosas importantes, la primera el nombre el cual queremos darle a nuestra llave, es recomendable ponerle un nombre alusivo ya que podremos contar con varias llaves. Lo segundo es en la parte inferior un botón que dice “How to create” que es básicamente este tutorial pero en inglés y junto con las otras llaves. Lo tercero y no menos importante es el botón para ir directamente al Centro de desarrolladores para Instragram, este botón (que no tiene pinta de botón) dice “Click here to create and maintain your Instagram Clients“; si se hace click ahí nos dirigirá a Instagram y se verá algo parecido a lo siguiente.

Aquí hacer click en el botón verde ubicado en la parte superior derecha que dice “Register a new client“, cuando cargue la página nos pedirá información básica, en la parte de la URL solo es por referencia ya que como se está haciendo un producto nuevo se sobre-entiende que debe tener una página web. Sin embargo si es con fines educativos pueden usar la URL de este blog.

Cuando se haya registrado correctamente toda la información de la llave podemos volver a la ventana de creación de llave dentro de App Studio, allí nos pide un dato llamado “Client ID” que lo podemos encontrar en Instagram, dar click en el botón que dice “Validate” y cuando finalice de validar se verán todas las llaves que tenemos hasta el momento en App Studio.

En este momento podemos volver a la página de App Studio donde estamos creando la aplicación y donde dice “API Keys” hay un botón que dice “Refresh“, luego de refrescar seleccionar la llave correspondiente.y se podrá seleccionar entre Tag o User ID, en mi caso es User ID; este lo obtengo haciendo click en el botón con un ícono de lupa y buscando el usuario @disclosure.

Si todo fue exitoso se verá algo parecido a lo siguiente y listo!.

2 comentarios en “¿Cómo integrar Instagram en App Studio?

Los comentarios están cerrados.