Direct Line App Service uzantısıyla Web Sohbeti kullanma

Makale
10/24/2023

1 Eylül 2023'te ağ yalıtımı için Azure Hizmet Etiketi yönteminin kullanılması önemle tavsiye edilir. DL-ASE kullanımı yüksek oranda belirli senaryolarla sınırlı olmalıdır. Bu çözümü bir üretim ortamında uygulamadan önce, rehberlik için destek ekibinize danışmanızı öneririz.

ŞUNLAR IÇIN GEÇERLIDIR: SDK v4

Bu makalede Direct Line App Service uzantısıyla Web Sohbeti nasıl kullanılacağı açıklanmaktadır. Yerel Direct Line App Service uzantısı desteği için Web Sohbeti sürüm 4.9.1 veya üzeri gereklidir.

Web Sohbeti istemciyi tümleştirme

Dekont

Direct Line App Service uzantısı aracılığıyla gönderilen Uyarlamalı Kartlar, Direct Line kanalının diğer sürümleri aracılığıyla gönderilenlerle aynı işlemeye tabi tutulmaz. Bu yüzden Direct Line App Service uzantısından Web Sohbeti gönderilen Uyarlamalı Kartın JSON gösterimi, kart oluşturulduğunda alanlar bot tarafından atlanırsa kanal tarafından varsayılan değerler eklenmez.

Genel olarak, yaklaşım öncekiyle aynıdır. Web Sohbeti 4.9.1 veya sonraki sürümlerinde iki yönlü WebSocket oluşturmak için yerleşik destek olması dışında. Bu, Web Sohbeti'a bağlanmak yerine botunuzla barındırılan Direct Line App Service uzantısına doğrudan bağlanmasını https://directline.botframework.com/sağlar. Botunuzun Direct Line URL'si, app service uzantınızdaki Direct Line uç noktası olacaktırhttps://<your_app_service>.azurewebsites.net/.bot/. Kendi etki alanı adınızı yapılandırdıysanız veya botunuz bağımsız bir Azure bulutunda barındırılıyorsa, uygun URL'yi değiştirin ve Direct Line App Service uzantısının /.bot/ REST API'lerine erişmek için yolu ekleyin.

Kimlik doğrulaması makalesindeki yönergeleri izleyerek bir belirteç için gizli diziyi değiştirme. adresinden https://directline.botframework.com/v3/directline/tokens/generatebelirteç almak yerine doğrudan adresinden https://<your_app_service>.azurewebsites.net/.bot/v3/directline/tokens/generateDirect Line App Service uzantınızdan belirteci oluşturacaksınız.

Bir belirtecin nasıl getirildiğini gösteren bir örnek için bkz. Web Sohbeti Örnekler.

<!DOCTYPE html>
<html lang="en-US">
  <head>
    <title>Web Chat</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script
      crossorigin="anonymous"
      src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"
    ></script>
    <style>
      html,
      body {
        background-color: #f7f7f7;
        height: 100%;
      }

      body {
        margin: 0;
      }

      #webchat {
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
        height: 100%;
        margin: auto;
        max-width: 480px;
        min-width: 360px;
      }
    </style>
  </head>
  <body>
    <div id="webchat" role="main"></div>
    <script>
      (async function() {
        <!-- NOTE: You should replace the below fetch with a call to your own token service as described in step 2 above, to avoid exposing your channel secret in client side code. -->
        const res = await fetch('https://<your_app_service>.azurewebsites.net/.bot/v3/directline/tokens/generate', 
          {
            "method": "POST",
            "headers": {
              "Authorization": "Bearer " + "<Your Bot's Direct Line channel secret>"
            },
            "body": "{'user': {'id': 'my_test_id', 'name': 'my_test_name'}}"
          }
        );
        const { token } = await res.json();

        window.WebChat.renderWebChat(
          {
            directLine: await window.WebChat.createDirectLineAppServiceExtension({
              domain: 'https://<your_app_service>.azurewebsites.net/.bot/v3/directline',
              token
            })
          },
          document.getElementById('webchat')
        );

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

Bahşiş

JavaScript botu uygulamasında, aşağıda gösterildiği gibi web.config dosyasında WebSockets'in etkinleştirildiğinden emin olun.

<configuration>
    <system.webServer>
        <webSocket enabled="true"/>
        ...
    </system.webServer>
</configuration>

Aracılığıyla paylaş

Direct Line App Service uzantısıyla Web Sohbeti kullanma

Web Sohbeti istemciyi tümleştirme

Ek kaynaklar