paint-brush
Cómo automatizar flujos de trabajo de imágenes con la API de Photoshoppor@raymondcamden
2,008 lecturas
2,008 lecturas

Cómo automatizar flujos de trabajo de imágenes con la API de Photoshop

por Raymond Camden7m2023/06/30
Read on Terminal Reader

Demasiado Largo; Para Leer

Pipedream es una solución low-code/no-code para crear flujos de trabajo genéricos. Está en el mismo espacio que Microsoft PowerAutomate y Workfront Fusion. En esta publicación, le mostraremos cómo usar Pipedream para crear un flujo de trabajo basado en Dropbox.
featured image - Cómo automatizar flujos de trabajo de imágenes con la API de Photoshop
Raymond Camden HackerNoon profile picture

Recientemente, discutimos cómo los desarrolladores podrían hacer uso de la API de Photoshop . En esa publicación, compartimos un script simple de Node.js que llamaría a una de las API usando un archivo almacenado en Azure.


Fue simple: obtenga un token de acceso, inicie un trabajo de API con un documento de entrada, realice una encuesta para completarlo y luego verifique el resultado.


Sin embargo, lo simple es bueno, ya que significa que es fácil de integrar en flujos de trabajo personalizados. En la publicación de hoy, haremos precisamente eso.

Nuestro flujo de trabajo

Comencemos definiendo qué va a hacer nuestro flujo de trabajo. Imagina que estamos usando un proveedor de almacenamiento en la nube, en este caso, Dropbox, para almacenar fotos. Nuestro flujo de trabajo monitoreará esta carpeta y se activará cuando se agreguen nuevas imágenes.


Cuando se agrega la imagen, tomamos el archivo y lo enviamos a un punto final que ejecuta la función "AutoTone" de Lightroom. Esta característica intenta corregir la exposición, el contraste y otros problemas en las fotos.


Como ejemplo (que robamos directamente de los documentos ), aquí hay un antes y un después que muestra el impacto de las correcciones:


Antes y después del impacto en la imagen.

Una vez finalizada la API, almacenaremos el resultado en otra carpeta de Dropbox. Podríamos sobrescribir el original, pero lo más probable es que la gente quiera ambas copias para poder hacer una verificación final para ver cuál prefiere.

La plataforma de flujo de trabajo

Para nuestro flujo de trabajo, usaremos Pipedream . Pipedream es una solución low-code/no-code para crear flujos de trabajo genéricos. Está en el mismo espacio que Microsoft PowerAutomate y Workfront Fusion. (Y también puede esperar ver ejemplos nuestros pronto en esas plataformas).


Pipedream realmente ayuda a los desarrolladores al hacer que los aspectos más difíciles, o incluso aburridos, de un proyecto sean "plug and play". Como ejemplo, al definir qué inicia un flujo de trabajo, un disparador, Pipedream viene con un gran conjunto de bloques de código prediseñados.


Cuando comencemos a demostrar cómo construimos nuestro flujo de trabajo, lo verá en acción. Pipedream tiene un nivel gratuito, por lo que aquellos de ustedes que quieran seguirlo pueden hacerlo después de registrarse.


Si nunca antes ha usado Pipedream, consulte su excelente Pipedream University para obtener una introducción a cómo funciona. También tienen excelentes documentos . Finalmente, su amable autor aquí también ha escrito sobre Pipedream.


Con eso fuera del camino, ¡comencemos a construir!

Paso uno: el gatillo

Los flujos de trabajo de Pipedream comienzan con un activador que representa el "evento" que debería iniciar nuestro proceso. Pipedream tiene muchos, muchos de estos disparadores incorporados (y puedes escribir los tuyos propios) y, afortunadamente, se admite un disparador de "Nuevo archivo" en Dropbox:


Configurar el activador de Pipedream


Después de seleccionar el activador "Nuevo archivo", se le proporciona una interfaz simple para configurarlo:


Especificación de opciones para el activador de nuevo archivo de Dropbox


En la parte superior está el aspecto de autenticación. Aquí puedes conectar Pipedream a tu cuenta de Dropbox. Lo mejor de todo es que una vez que haya hecho eso una vez, puede reutilizar esa conexión en múltiples flujos de trabajo.


A continuación, tome nota del valor de Ruta. Puede escribir aquí y Pipedream intentará completar automáticamente según su cuenta, o simplemente ingresar una ruta. Vamos a usar /PSAPI_Input como la carpeta que espera obtener imágenes.


Las siguientes dos configuraciones pueden ignorarse, pero la configuración final, Include Link , debe cambiarse a verdadero. Vamos a necesitar ese enlace para que podamos decirle a la API cómo obtener los datos.


Aquí está el disparador configurado final para nuestro flujo de trabajo:


Paso final de disparo configurado


En resumen, en este punto, hemos configurado el flujo de trabajo para que se active automáticamente tan pronto como se agregue un archivo a una carpeta en particular en nuestra cuenta de Dropbox.

Paso dos: obtenga una URL de carga

Cuando se ejecuta la API de Photoshop, espera como mínimo dos cosas: una URL de entrada y una URL de salida. Básicamente, dónde leer su entrada y dónde almacenar el resultado.


Nuestra entrada será el nuevo archivo agregado a Dropbox. Nuestro resultado será la ubicación de la imagen corregida por Lightroom.


Para respaldar esto, debemos pedirle a Dropbox que genere una URL especial que se pueda usar para almacenar datos. Pipedream tiene muchas acciones de Dropbox incorporadas pero, desafortunadamente, no tiene esta en particular.


Afortunadamente, Pipedream te permite crear un paso con un código personalizado donde ya manejó la autenticación por ti. Recuerde que en el disparador, especificamos una cuenta de Dropbox existente. Debido a que hicimos esto, podemos escribir código y dejar que Pipedream maneje la autenticación.


Al consultar la API de Dropbox , encontramos el punto final get_temporary_upload_link que es exactamente lo que necesitamos.


En Pipedream, agregamos un nuevo paso y seleccionamos "Usar cualquier API de Dropbox en Node.js". Esto nos da un código repetitivo que alcanza un punto final de muestra:

Lo más importante: tenga en cuenta que la información de autenticación se proporciona automáticamente. Todo lo que tenemos que hacer es editar el punto final y establecer nuestra entrada:

Tenga en cuenta que estamos usando una ruta que es una carpeta diferente, /PSAPI_Output . El valor después de eso, ${steps.trigger.event.name} , demuestra el uso de información anterior en nuestro flujo de trabajo, específicamente el nombre de archivo del evento que desencadenó nuestro flujo de trabajo y el nombre del archivo en sí.


El código finaliza devolviendo el resultado de la llamada a la API, que en nuestro caso será una URL especial que podemos usar con nuestra llamada a la API.

Paso tres: obtener un token de acceso

En nuestra publicación de blog anterior , discutimos cómo obtener credenciales para la API de Photoshop y cómo usarlas en el código para obtener un token de acceso. En Pipedream, podemos agregar un paso a nuestro flujo de trabajo para ejecutar código personalizado.


Lo viste en el paso anterior cuando llegamos a la API de Dropbox. Pipedream es compatible con Node.js y Python, por lo que tiene algunas opciones allí. Agregaremos un nuevo paso de código y lo llamaremos getAccessToken .


Este paso será responsable de usar nuestras credenciales para generar un JWT e intercambiarlo por un token de acceso.


En esa publicación de blog anterior, el código utilizó el paquete @adobe/jwt-auth para simplificar el proceso. Sin embargo, este paquete no funciona como una importación de ES6 que admite Pipedream. Afortunadamente, podemos cambiar a otro paquete de NPM, jsonwebtoken . Echemos un vistazo al código:

Así que un par de cosas aquí. Primero, cada paso de código de Node Pipedream usa un formulario como este:

La función run se llama automáticamente y pasa datos de cualquier paso anterior, así como un controlador ( $ ) para otras operaciones que no necesitaremos. Básicamente, pondremos nuestras importaciones en la parte superior y nuestra lógica en el interior.


Puede ver un conjunto de variables que se copian del entorno, ya que, como era de esperar, Pipedream también nos permite definir variables de entorno personalizadas.


El siguiente bloque de código genera nuestro JWT. Esto es en su mayoría repetitivo, pero preste especial atención a la parte jwtOptions . Esta variable, "https://ims-na1.adobelogin.com/s/ent_ccas_sdk": true, es lo que establece el alcance de nuestro token y es necesaria para trabajar con las API.


Una vez que se crea el JWT, se puede enviar a un extremo genérico de Adobe para generar un token de acceso. El último bit de lógica es devolver ese token. Si recuerda en el paso anterior, cualquier cosa que devolvamos se puede usar más tarde. Verás esto en acción pronto.

Paso cuatro: llamar a la API de Lightroom Autotone

Ahora, es hora de ponerse manos a la obra. Nuestro disparador nos dio un enlace a la nueva imagen. El siguiente paso del código generó un enlace para que subamos el resultado final. Luego obtuvimos un token de acceso. Tenemos todo lo necesario para iniciar el proceso.


Una vez más, agregaremos un paso de Node.js a nuestro flujo de trabajo. Aquí está en acción.

La API Autotone requiere algunos parámetros, en este caso, un valor de entrada y salida. En nuestro caso, pasamos el enlace del activador y la URL de carga especial generada anteriormente.


¡Y eso es! El resultado de esta llamada es un enlace al trabajo que le devolvemos al final.

Paso cinco: no hacer nada

Ok, no exactamente nada , pero aquí hay una pregunta interesante. Todo este flujo de trabajo se ejecuta automáticamente sin interacción humana. El paso anterior inicia un proceso que, cuando finaliza, guardará el resultado en Dropbox. ¿Necesitamos hacer algo más? No precisamente.


Es absolutamente posible que la API falle por alguna razón. Es posible que algo más pueda salir mal también. También es posible que queramos alertar a alguien sobre el cambio, quizás por correo electrónico. Honestamente, depende de ti.


En nuestro flujo de trabajo de muestra, decidimos simplemente verificar el trabajo y esperar a que terminara. Aquí está ese paso de código, y es bastante similar a nuestra publicación de blog anterior. Verificamos el trabajo, esperamos y lo volvemos a verificar.

Aquí es donde finalizamos el flujo de trabajo, pero podríamos, y probablemente deberíamos, agregar lógica para verificar el resultado del trabajo y hacer algo. Quizás con un buen resultado, no hacemos nada, pero con un error, enviamos un correo electrónico. (Y, por cierto, Pipedream hace que enviar correos electrónicos sea ridículamente fácil).


Sin embargo, lo bueno es que podemos decidir eso más tarde.


Una característica realmente interesante de Pipedream es que facilita comprobar cuándo se han ejecutado los flujos de trabajo. Por ejemplo, aquí hay una lista de ejecuciones pasadas:


Lista de ejecuciones anteriores de flujos de trabajo de Pipedream


Los errores que ve allí provinieron de mí jugando con la API y descubriendo cómo funcionaba. También puede hacer clic en cualquiera de ellos y ver los datos que fluían a lo largo de él.

El resultado

Con el flujo de trabajo implementado, cargamos una nueva imagen en una carpeta de Dropbox, observamos cómo se activaba el flujo de trabajo en una pestaña abierta y, cuando terminamos, verificamos el resultado. Aquí está antes:


Cayenne, mi gran perro apestoso

Y aquí está después:


Cayenne después de la llamada a la API, más guapa, todavía apestosa.

¡El resultado es más nítido y absolutamente una mejora! Puede crear su propia copia de mi flujo de trabajo aquí: https://pipedream.com/new?h=tch_3xxfJA . Si desea obtener más información, visite nuestros documentos y comparta lo que ha creado.


También publicado aquí