3
votes

Génération de jetons pour Botframework Webchat

J'ai migré mon Bot Direct Line de Webchat v3 vers v4. La nouvelle version exige l'utilisation de jetons plutôt que le secret de ligne directe dans la page d'appel. Voici le code (index.html) utilisé pour démarrer le bot:

POST https://directline.botframework.com/v3/directline/tokens/generate
Authorization: Bearer SECRET

Question: Quel code dois-je écrire pour générer le jeton dans un autre pour être appelé par https: / /bellamspt.azurewebsites.net/Forms/Webchat/directline/token ?? Réalisez que ça doit être quelque chose comme

<!DOCTYPE html>
<html lang="en-US">
<head>
    <title>Web Chat: Full-featured bundle</title>

    <script src="https://cdn.botframework.com/botframework-webchat/master/webchat.js"></script>

    <style>
         html, body {
            height: 100%
        }

         body {
            margin: 0
        }

         #webchat,
         #webchat > * {
             height: 100%;
             width: 100%;

        }


    </style>
</head>
<body>
       <div id="webchat" role="main"></div>

    <script>
    (async function () {
        const res = await fetch('https://bellamspt.azurewebsites.net/Forms/Webchat/directline/token', { method: 'POST' });

      const { token } = await res.json();

      window.WebChat.renderWebChat({
        directLine: window.WebChat.createDirectLine({ token })
      }, document.getElementById('webchat'));

      document.querySelector('#webchat > *').focus();
    })().catch(err => console.error(err));
   </script>
</body>
</html>

mais je ne sais pas si ça doit être un fichier php, js ou autre pour fonctionner.

Merci d'avance


2 commentaires

Essayez-vous d'échanger votre secret DirectLine contre un jeton sur le backend? Si tel est le cas, comment le backend de https://bellamspt.azurewebsites.net/ est-il configuré - utilisez-vous un framework comme Express ou Restify?


Oui. Le bellamspt.azurewebsites.net est un simple site Web asp.net. Pourriez-vous partager quelques conseils sur l'implémentation Express ou Restify? Ce serait également formidable si vous pouviez partager un code source de référence. THX


3 Réponses :


0
votes

Ce que vous devez faire est d'implémenter une sorte de logique côté serveur en utilisant la technologie avec laquelle vous êtes le plus à l'aise et qui utilise le secret, qui est conservé uniquement sur votre serveur, pour générer un nouveau jeton en faisant une requête HTTP au Canal DirectLine comme vous l’indiquez ci-dessus. Ensuite, dans la logique de démarrage de votre page Web, vous faites une demande pour obtenir ce jeton et, avec le jeton, initialisez l'instance de ligne directe dans la page Web. Cette approche garantit que personne d’extérieur ne parvient jamais à saisir votre secret.

Il n'y a donc pas un seul type de fichier pour "le faire fonctionner". Vous devrez choisir Node, PHP, ASP.NET ou toute autre technologie de serveur et l'implémenter comme vous le feriez pour tout autre gestionnaire de requêtes HTTP.

Cet article vous aidera à comprendre les concepts d'authentification et les API et voici un article de blog qui montre comment vous pouvez le faire avec ASP.NET et Node .


1 commentaires

Thx Drew. Toujours du mal à le faire fonctionner. Auriez-vous un pointeur vers un exemple de code fonctionnel de bout en bout? À votre santé



1
votes

J'ai utilisé php pour résoudre ce problème. Vous pouvez essayer.

<?php
$botSecret = '<your secret>';
$response = wp_remote_get( 'https://webchat.botframework.com/api/tokens', array( 'headers' => 'Authorization: BotConnector ' . $botSecret ) );
if( is_array($response) ) {
  $header = $response['headers'];
  $token = $response['body'];
}
?>
<script type="text/javascript">
        var webChatToken = <?php echo $token; ?>;
</script>


0 commentaires

1
votes

J'ai eu le même problème hier, je le publie juste ici au cas où cela aiderait quelqu'un à l'avenir. Si vous modifiez votre code, cela devrait fonctionner:

    <!DOCTYPE html>
<html lang="en-US">
<head>
    <title>Web Chat: Full-featured bundle</title>

    <script src="https://cdn.botframework.com/botframework-webchat/master/webchat.js"></script>

    <style>
         html, body {
            height: 100%
        }

         body {
            margin: 0
        }

         #webchat,
         #webchat > * {
             height: 100%;
             width: 100%;

        }


    </style>
</head>
<body>
       <div id="webchat" role="main"></div>

    <script>
    (async function () {
        const res = await fetch('https://bellamspt.azurewebsites.net/Forms/Webchat/directline/token', 
{ method: 'POST', headers: { Authorization: 'write your direct line secret here' }});

      const { token } = await res.json();

      window.WebChat.renderWebChat({
        directLine: window.WebChat.createDirectLine({ token })
      }, document.getElementById('webchat'));

      document.querySelector('#webchat > *').focus();
    })().catch(err => console.error(err));
   </script>
</body>
</html>

Vous deviez ajouter l'autorisation dans l'en-tête de la demande de publication pour générer le jeton dans la fonction asynchrone. Malheureusement, cela n'est peut-être pas évident de la part de Microsoft documentation sur la manière de générer le jeton


0 commentaires