Intégration Microsoft Teams

Envoyez des notifications de soumission de photos directement dans vos canaux Microsoft Teams.

Aperçu

Connectez Visiono à Microsoft Teams pour recevoir des notifications instantanées quand des photos sont soumises. Gardez votre équipe informée sans quitter leur plateforme de collaboration.

Prérequis

• Compte Visiono avec accès API
• Espace de travail Microsoft Teams
• Permission d'ajouter des connecteurs aux canaux Teams
• Clé API de Visiono (pour les workflows avancés)

Étapes de configuration

1. Créer un Webhook entrant dans Teams

1. Ouvrez Microsoft Teams
2. Naviguez vers le canal où vous voulez les notifications
3. Cliquez sur les ... (plus d'options) à côté du nom du canal
4. Sélectionnez Connecteurs
5. Trouvez Incoming Webhook et cliquez sur Configurer
6. Donnez un nom à votre webhook (ex. : "Photos Visiono")
7. Optionnellement uploadez une icône personnalisée
8. Cliquez sur Créer
9. Copiez l'URL du webhook (conservez-la pour l'étape suivante)

2. Ajouter le Webhook à Visiono

1. Allez dans Paramètres de l'espace de travail → Webhooks
2. Cliquez sur Ajouter un Webhook
3. Collez l'URL du webhook Teams
4. Sélectionnez les événements à déclencher :
   • photo_request.submitted - Quand toutes les photos sont soumises
   • photo_submission.created - Quand une nouvelle soumission arrive
5. Enregistrez le webhook

3. Tester la connexion

1. Soumettez une photo de test dans Visiono
2. Vérifiez votre canal Teams pour la notification
3. Ajustez les paramètres si nécessaire

Format du message

Teams recevra des notifications formatées comme Adaptive Cards :

{
  "@type": "MessageCard",
  "@context": "http://schema.org/extensions",
  "themeColor": "0076D7",
  "summary": "Nouvelle soumission de photos",
  "sections": [{
    "activityTitle": "Nouvelles photos reçues",
    "activitySubtitle": "De : Inspection véhicule",
    "facts": [{
      "name": "Photos",
      "value": "5"
    }, {
      "name": "Soumis",
      "value": "2024-01-15 10:30"
    }],
    "markdown": true
  }],
  "potentialAction": [{
    "@type": "OpenUri",
    "name": "Voir dans le tableau de bord",
    "targets": [{
      "os": "default",
      "uri": "https://..."
    }]
  }]
}

Intégration avancée avec Power Automate

Pour des workflows plus complexes, utilisez Microsoft Power Automate :

1. Créer un flux Power Automate

1. Allez sur Power Automate
2. Cliquez sur Créer → Flux de cloud automatisé
3. Recherchez Quand une requête HTTP est reçue
4. Configurez le déclencheur HTTP

2. Ajouter des actions Teams

Actions populaires :

Action	Cas d'usage
Publier un message	Envoyer au canal
Publier une carte adaptative	Notification riche
Créer un canal	Organiser par projet
Ajouter un membre	Inviter les parties prenantes

3. Exemple : Flux de notification riche

1. Déclencheur : Requête HTTP (webhook depuis Visiono)
2. Action : Parser JSON (extraire les données photo)
3. Action : Publier une Adaptive Card dans Teams

Modèle d'Adaptive Card :

{
  "type": "AdaptiveCard",
  "body": [
    {
      "type": "TextBlock",
      "size": "Medium",
      "weight": "Bolder",
      "text": "Nouvelle soumission de photos"
    },
    {
      "type": "FactSet",
      "facts": [
        {"title": "Demande", "value": "${request_name}"},
        {"title": "Photos", "value": "${photos_count}"},
        {"title": "Soumis", "value": "${submitted_at}"}
      ]
    },
    {
      "type": "Image",
      "url": "${first_photo_url}",
      "size": "Large"
    }
  ],
  "actions": [
    {
      "type": "Action.OpenUrl",
      "title": "Voir les photos",
      "url": "${dashboard_url}"
    }
  ]
}

Payload du Webhook

Visiono envoie ces données à votre webhook Teams :

{
  "event": "submission.created",
  "timestamp": "2024-01-15T10:30:00Z",
  "data": {
    "submission_id": "sub_abc123",
    "permanent_link": {
      "id": "pl_xyz789",
      "slug": "inspection-vehicule",
      "name": "Inspection Véhicule"
    },
    "photos": [
      {
        "id": "photo_001",
        "url": "https://...",
        "slot": 1,
        "slot_name": "Vue de face"
      }
    ],
    "metadata": {
      "unique_field": "ABC-123",
      "full_name": "Jean Dupont",
      "submitted_at": "2024-01-15T10:30:00Z"
    }
  }
}

Organisation des canaux

Bonnes pratiques

• Créez un canal dédié pour les notifications de photos
• Utilisez les onglets de canal pour intégrer le tableau de bord Visiono
• Épinglez les demandes importantes pour la visibilité
• Utilisez les @mentions pour les soumissions urgentes

Nommage des canaux

Structure suggérée :

• #visiono-photos - Toutes les soumissions
• #visiono-urgent - Haute priorité uniquement
• #visiono-[projet] - Spécifique au projet

Dépannage

Notifications non affichées

1. Vérifiez que l'URL du webhook est correcte dans Visiono
2. Vérifiez que le webhook est activé (statut vert)
3. Assurez-vous que le connecteur Teams est toujours actif
4. Testez avec une nouvelle soumission

URL du Webhook invalide

1. Créez un nouveau Incoming Webhook dans Teams
2. Mettez à jour l'URL dans Visiono
3. Testez la connexion

Problèmes de format de message

1. Vérifiez que le type d'événement webhook correspond au format attendu
2. Vérifiez la structure JSON dans les paramètres webhook Visiono
3. Testez avec Power Automate pour un formatage personnalisé

Considérations de sécurité

• Les URLs de webhook doivent être gardées privées
• Effectuez une rotation des webhooks périodiquement
• Utilisez des canaux privés pour les données sensibles
• Vérifiez régulièrement les applications connectées

Ressources connexes

• Webhooks - Configuration des événements
• Référence API - Accès direct à l'API
• Intégration Zapier - Automatisation alternative
• Intégration Make - Automatisation visuelle