paint-brush
Como automatizar fluxos de trabalho de imagem com a API do Photoshoppor@raymondcamden
2,425 leituras
2,425 leituras

Como automatizar fluxos de trabalho de imagem com a API do Photoshop

por Raymond Camden7m2023/06/30
Read on Terminal Reader

Muito longo; Para ler

O Pipedream é uma solução de baixo código/sem código para criar fluxos de trabalho genéricos. Está no mesmo espaço que o Microsoft PowerAutomate e o Workfront Fusion. Nesta postagem, mostraremos como usar o Pipedream para criar um fluxo de trabalho baseado no Dropbox.
featured image - Como automatizar fluxos de trabalho de imagem com a API do Photoshop
Raymond Camden HackerNoon profile picture

Recentemente, discutimos como os desenvolvedores podem usar a API do Photoshop . Nessa postagem, compartilhamos um script Node.js simples que chamaria uma das APIs usando um arquivo armazenado no Azure.


Era simples — obter um token de acesso, iniciar um trabalho de API com um documento de entrada, pesquisar a conclusão e, em seguida, verificar o resultado.


Simples é bom, pois significa que é fácil de integrar em fluxos de trabalho personalizados. No post de hoje, faremos exatamente isso.

Nosso fluxo de trabalho

Vamos começar definindo o que nosso fluxo de trabalho fará. Imagine que estamos usando um provedor de armazenamento em nuvem, neste caso, o Dropbox, para armazenar fotos. Nosso fluxo de trabalho vai monitorar esta pasta e disparar quando novas imagens forem adicionadas.


Quando a imagem for adicionada, pegaremos o arquivo e o enviaremos para um terminal que executa o recurso “AutoTone” do Lightroom. Este recurso tenta corrigir a exposição, o contraste e outros problemas nas fotos.


Como exemplo (que roubamos direto dos documentos ), aqui está um antes e depois mostrando o impacto das correções:


Antes e depois do impacto na imagem.

Depois que a API estiver concluída, armazenaremos o resultado em outra pasta no Dropbox. Poderíamos sobrescrever o original, mas provavelmente as pessoas vão querer ambas as cópias para que possam fazer uma verificação final para ver qual delas preferem.

A Plataforma Worflow

Para o nosso fluxo de trabalho, usaremos o Pipedream . O Pipedream é uma solução de baixo código/sem código para criar fluxos de trabalho genéricos. Está no mesmo espaço que o Microsoft PowerAutomate e o Workfront Fusion. (E você pode esperar ver exemplos nossos em breve nessas plataformas também.)


O Pipedream realmente ajuda os desenvolvedores tornando os aspectos mais difíceis, ou mesmo chatos, de um projeto “plug and play”. Por exemplo, ao definir o que inicia um fluxo de trabalho, um gatilho, o Pipedream vem com um enorme conjunto de blocos de código pré-construídos.


Quando começarmos a demonstrar como construímos nosso fluxo de trabalho, você verá isso em ação. O Pipedream tem um nível gratuito, portanto, aqueles que estão lendo e desejam acompanhar podem fazê-lo após se inscrever.


Se você nunca usou o Pipedream antes, confira a excelente Pipedream University para uma introdução de como ele funciona. Eles também têm excelentes documentos . Finalmente, seu amigo autor aqui também escreveu sobre o Pipedream.


Com isso fora do caminho, vamos construir!

Passo Um - O Gatilho

Os fluxos de trabalho do Pipedream começam com um gatilho que representa o “evento” que deve iniciar nosso processo. O Pipedream tem muitos, muitos desses gatilhos embutidos (e você pode escrever o seu próprio) e, felizmente, um “Novo arquivo” no gatilho do Dropbox é suportado:


Configurando o gatilho do Pipedream


Depois de selecionar o gatilho “Novo arquivo”, você terá uma interface simples para configurá-lo:


Especificando opções para o gatilho Novo arquivo do Dropbox


No topo está o aspecto de autenticação. Aqui, você pode conectar o Pipedream à sua conta do Dropbox. O melhor de tudo é que, depois de fazer isso uma vez, você pode reutilizar essa conexão em vários fluxos de trabalho.


Em seguida, anote o valor Path. Você pode digitar aqui e o Pipedream tentará preencher automaticamente com base na sua conta ou simplesmente inserir um caminho. Vamos usar /PSAPI_Input como a pasta que espera obter as imagens.


As próximas duas configurações podem ser ignoradas, mas a configuração final, Include Link , deve ser alterada para true. Vamos precisar desse link para podermos dizer à API como buscar os dados.


Aqui está o gatilho configurado final para nosso fluxo de trabalho:


Etapa final do gatilho configurado


Para recapitular, neste ponto, configuramos o fluxo de trabalho para disparar automaticamente assim que um arquivo é adicionado a uma pasta específica em nossa conta do Dropbox.

Etapa dois - obtenha um URL de upload

Quando a API do Photoshop é executada, ela espera no mínimo duas coisas — um URL de entrada e um URL de saída. Basicamente, onde ler sua entrada e onde armazenar o resultado.


Nossa entrada será o novo arquivo adicionado ao Dropbox. Nossa saída será a localização da imagem corrigida pelo Lightroom.


Para suportar isso, precisamos pedir ao Dropbox para gerar um URL especial que pode ser usado para armazenar dados. O Pipedream tem muitas ações do Dropbox integradas, mas, infelizmente, não tem essa em particular.


Felizmente, o Pipedream permite que você crie uma etapa com código personalizado onde ele já cuidou da autenticação para você. Lembre-se de que no gatilho especificamos uma conta existente do Dropbox. Como fizemos isso, podemos escrever o código e deixar o Pipedream lidar com a autenticação.


Ao consultar a API do Dropbox , encontramos o endpoint get_temporary_upload_link que é exatamente o que precisamos.


No Pipedream, adicionamos uma nova etapa e selecionamos “Usar qualquer API do Dropbox em Node.js”. Isso nos dá um código clichê atingindo um exemplo de endpoint:

Mais importante - observe que as informações de autenticação são fornecidas automaticamente. Tudo o que precisamos fazer é editar o endpoint e definir nossa entrada:

Observe que estamos usando um caminho que é uma pasta diferente, /PSAPI_Output . O valor depois disso, ${steps.trigger.event.name} , demonstra o uso de informações anteriores em nosso fluxo de trabalho, especificamente o nome do arquivo do evento que acionou nosso fluxo de trabalho e o nome do próprio arquivo.


O código termina retornando o resultado da chamada de API, que no nosso caso será uma URL especial que podemos usar com nossa chamada de API.

Passo Três — Obtendo um Token de Acesso

Em nossa postagem de blog anterior , discutimos como obter credenciais para a API do Photoshop e como usá-las no código para obter um token de acesso. No Pipedream, podemos adicionar uma etapa ao nosso fluxo de trabalho para executar código personalizado.


Você viu isso na etapa anterior, quando acessamos a API do Dropbox. O Pipedream oferece suporte a Node.js e Python, então você tem algumas opções. Adicionaremos uma nova etapa de código e a nomearemos getAccessToken .


Esta etapa será responsável por usar nossas credenciais para gerar um JWT e trocá-lo por um token de acesso.


Na postagem anterior do blog, o código utilizou o pacote @adobe/jwt-auth para simplificar o processo. No entanto, este pacote não funciona como uma importação ES6 suportada pelo Pipedream. Felizmente, podemos trocar para outro pacote NPM, jsonwebtoken . Vamos dar uma olhada no código:

Então, algumas coisas aqui. Primeiro, cada etapa de código do Node Pipedream usa um formulário como este:

A função run é chamada automaticamente e passa dados de qualquer etapa anterior, bem como um manipulador ( $ ) para outras operações que não precisaremos. Basicamente, colocaremos nossas importações em cima e nossa lógica dentro.


Você pode ver um conjunto de variáveis sendo copiadas do ambiente, pois - não surpreendentemente - o Pipedream também nos permite definir variáveis de ambiente personalizadas.


O próximo bloco de código gera nosso JWT. Isso é basicamente clichê, mas preste atenção especial à parte jwtOptions . Esta variável, "https://ims-na1.adobelogin.com/s/ent_ccas_sdk": true, , é o que define o escopo do nosso token e é necessária para trabalhar com as APIs.


Depois que o JWT é criado, ele pode ser enviado a um endpoint genérico da Adobe para gerar um token de acesso. A parte final da lógica é retornar esse token. Se você se lembra da etapa anterior, qualquer coisa que retornarmos poderá ser usada posteriormente. Você verá isso em ação em breve.

Etapa quatro — Chamando a API Lightroom Autotone

Agora, é hora de começar a trabalhar. Nosso gatilho nos deu um link para a nova imagem. A próxima etapa do código gerou um link para carregarmos o resultado final. Em seguida, recebemos um token de acesso. Temos tudo o que é necessário para iniciar o processo.


Mais uma vez, adicionaremos uma etapa Node.js ao nosso fluxo de trabalho. Aqui está em ação.

A API Autotone requer alguns parâmetros, neste caso, um valor de entrada e saída. No nosso caso, passamos o link do gatilho e a URL de upload especial gerada anteriormente.


E é isso! O resultado desta chamada é um link para o trabalho que retornamos no final.

Passo Cinco – Não Faça Nada

Ok, não exatamente nada , mas aqui está uma pergunta interessante. Todo esse fluxo de trabalho é executado automaticamente sem interação humana. A etapa anterior inicia um processo que, quando concluído, salvará o resultado no Dropbox. Precisamos fazer mais alguma coisa? Na verdade.


É absolutamente possível que a API falhe por algum motivo. É possível que algo mais possa dar errado também. Também é possível que queiramos alertar alguém sobre a alteração, talvez por e-mail. Honestamente, cabe a você.


Em nosso fluxo de trabalho de amostra, decidimos simplesmente verificar o trabalho e aguardar sua conclusão. Aqui está a etapa do código, e é bem semelhante à nossa postagem anterior no blog. Verificamos o trabalho, esperamos e verificamos novamente.

É aqui que terminamos o fluxo de trabalho, mas poderíamos, e provavelmente deveríamos, adicionar lógica para verificar o resultado do trabalho e fazer algo. Talvez com um bom resultado, não façamos nada, mas com erro, enviamos um e-mail. (E, a propósito, o Pipedream torna o envio de e-mails absurdamente fácil.)


O que é bom, porém, é que podemos decidir isso mais tarde.


Um recurso muito bom do Pipedream é que facilita a verificação quando os fluxos de trabalho são executados. Por exemplo, aqui está uma lista de execuções anteriores:


Lista de execuções anteriores do fluxo de trabalho do Pipedream


Os erros que você vê aqui vieram de mim brincando com a API e descobrindo como ela funcionava. Você também pode clicar em qualquer um deles e ver os dados que fluíram por ele.

O resultado

Com o fluxo de trabalho pronto, carregamos uma nova imagem em uma pasta do Dropbox, observamos o disparo do fluxo de trabalho em uma guia aberta e, quando concluído, verificamos o resultado. Aqui está antes:


Cayenne, meu grande cachorro fedorento

E aqui está depois:


Pimenta de Caiena após a chamada da API, com melhor aparência, ainda fedorenta.

O resultado é mais nítido e absolutamente uma melhoria! Você pode criar sua própria cópia do meu fluxo de trabalho aqui: https://pipedream.com/new?h=tch_3xxfJA . Se quiser saber mais, visite nossos documentos e compartilhe o que você construiu!


Também publicado aqui