Ir al contenido principal

Integrar Teams en Angular/Spring mediante webhooks

En este sencillo post vamos a ver cómo integrar Teams con Angular/Spring mediante webhooks, lo cual nos permitirá recibir notificaciones en tiempo real sobre el estado de nuestros procesos. Además, veremos ejemplos de código de ambos frameworks. 


 Esto nos abre un inmenso abanico de posibilidades pero, por poner algunos ejemplos, podremos recibir notificaciones sobre la gestión excepciones, tanto del front como del back (que nos permitirá enfocarnos en los posibles errores de ejecución en el momento en el que se produzcan), recibir avisos cuando se ejecute nuestro FIX recién subido, avisos sobre monitorización de inicios de sesión, acciones concretas, etc... 



 Para generar este escenario sólo necesitas crear un equipo en Teams y crear un "Webhook entrante" desde la configuración de conectores del equipo: 




 Implementación del servicio en Angular (JavaScript):

export class TeamsService {
    private resourceUrl = 'https://outlook.office.com/webhook/PUT-YOUR-WEBHOOK-HERE';

    constructor(protected http: HttpClient) {
    }

    sendMessage(message: string): void {
        this.http.post(this.resourceUrl, this.generatePayload(message)).subscribe(
            (val) => {
                // console.log(`Response: ${val}`);
            },
            response => {
                // console.error(response);
            });
    }

    private generatePayload(message: string) {
        return '{\n' +
            '  "@context": "https://schema.org/extensions",\n' +
            '  "@type": "MessageCard",\n' +
            '  "themeColor": "0072C6",\n' +
            '  "title": "Dasubipar Test",\n' +
            '  "text": "' + message + '"' +
            '}';
    }

}
Ejemplo de uso para monitorizar los errores generados en el envío de datos a DB:

    insertRegistry(registry: Registry) {
        this.registryService.create(registry).subscribe(response => {
            if(response && response.body) {
            	this.registry = response.body;
            } else {
            	console.log('dato no encontrado: ' + response);
            }
        }, error => {
            console.error(error);
            this.teamsService.sendMessage('Error al registrar la transacción. Error info: ' + error.message);
        });
    }
Implementación del servicio en Spring (Java):

@Service
public class TeamsService {

    private final Logger log = LoggerFactory.getLogger(TeamsService.class);
    private final String WEBHOOK = "https://outlook.office.com/webhook/PUT-YOUR-WEBHOOK-HERE";

    public void sendNotification(String message) {
        try {
            RestTemplate restTemplate = getRestTemplate();
            HttpEntity request = new HttpEntity<>(generatePayload(message), setHeaders());
            try {
                restTemplate.exchange(WEBHOOK, HttpMethod.POST, request, String.class);
            } catch (HttpClientErrorException ex) {
                if (ex.getStatusCode() != HttpStatus.NOT_FOUND) {
                    throw ex;
                }
            }
        } catch (KeyManagementException | KeyStoreException | NoSuchAlgorithmException e) {
            log.error(e.getMessage());
        }
    }


    private RestTemplate getRestTemplate() throws NoSuchAlgorithmException, KeyStoreException, KeyManagementException {
        SSLContextBuilder sslcontext = new SSLContextBuilder();
        sslcontext.loadTrustMaterial(null, new TrustSelfSignedStrategy());
        CloseableHttpClient httpClient = HttpClients.custom().setSSLContext(sslcontext.build()).setSSLHostnameVerifier(NoopHostnameVerifier.INSTANCE)
            .build();

        HttpComponentsClientHttpRequestFactory requestFactory = new HttpComponentsClientHttpRequestFactory();
        requestFactory.setHttpClient(httpClient);
        return new RestTemplate(requestFactory);
    }

    private HttpHeaders setHeaders() {
        HttpHeaders headers = new HttpHeaders();
        headers.setContentType(MediaType.APPLICATION_JSON);
        return headers;
    }

    private String generatePayload(String message) {
        return new JSONObject().put("@context", "https://schema.org/extensions").put("@type", "MessageCard").put("themeColor", "0072C6").put("title", "Dasubipar Blog Test").put("text", message).toString();
    }

}

Ejemplo de uso para monitorizar los errores generados en la ejecución de nuestra lógica de negocio:


	try {
           executeBusinessLogic()
        } catch (Exception e) {
            log.error("Error on ExecuteBusinessLogic. Error: {}", e.getStackTrace());
            if (isProduction()) {
                teamsService.sendNotification("Error en ExecuteBusinessLogic. ¡Revisión urgente! #microservice-xy");
            }
        }

Las notificaciones tendrán el siguiente aspecto:




Para personalizar estas notificaciones e incluso añadir acciones/botones, podemos encontrar más información en la siguiente url: https://docs.microsoft.com/es-es/microsoftteams/platform/webhooks-and-connectors/how-to/connectors-using

Comentarios