Directline activities in custom domain - 502 Bad gateway - node js/java script - azure chatbot

Question

I have deployed the azure app service in my custom domain say test.com due to internal company restrictions. So when i try to access the chatbot after deployment through directline i see 502 bad gateway error

customChatbot.html

<!DOCTYPE html>
<html>
   <body>
      <div id="webchat" role="main"></div>
      <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
      <script>
      
            const styleOptions = {
            bubbleBackground: '#E5E8E8',
            bubbleFromUserBackground: '#D9EDF9',
            hideUploadButton: true,
            sendBoxTextWrap: true
        };

        const store = window.WebChat.createStore({}, function (_ref) {
            var dispatch = _ref.dispatch;
            return function (next) {
                return function (action) {
                    if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
                            console.log("inside conversation history");
                            dispatch({
                                type: 'WEB_CHAT/SEND_EVENT',
                                payload: {
                                    name: 'conversationHistory',
                                    value: { id: 'me', name: '[email protected]' },

                                }
                            });
                            }
                    return next(action);
                }

            }


        });

         window.WebChat.renderWebChat(
            {
               directLine: window.WebChat.createDirectLine({
                  token: 'XXXXXXXXXXXXXXXXXXXXXXXXX'
               }),
               userID: '[email protected]',
               bot: { id: 'hpusstoredevbot' },
               username: 'Sivakumar Kandasamy',
               locale: 'en-US',
               botAvatarInitials: 'WC',
               userAvatarInitials: 'WW',
               store: store,
               styleOptions: styleOptions
            },
            document.getElementById('webchat')
         );
      </script>
   </body>
</html>

RESPONSE { "error": { "code": "BotError", "message": "Failed to send activity: bot returned an error" } }

Request Header

I have Azure AD enabled for this application but im not sure how to integrate it with direct line or how it works with direct line. I understand that directline needs a secret/token but in order to enter a custom domain it might need some authentication but how to achieve this with directline? is this an issue with authentication? Can someone give me pointers on this. Im using node js.

Exception that i see in application insights

Message POST to devbot failed: An error occurred while sending the request. An error occurred while sending the request. The remote name could not be resolved: 'devbot.corp.xxcloud.net' Exception type : System.Net.WebException Failed method : System.Net.HttpWebRequest.EndGetRequestStream
Custom Properties Conversation ID XXXXXXX-c
Correlation ID |XXXXXXX
Activity Type conversationUpdate
Bot Endpoint https://devbot.corp.xxcloud.net/api/messages
Recipient ID devbot@NWGv3oCIAyXMXX
Activity ID JiR6p5WTnLOXXX
Channel ID directline
From ID XXXXXXX-c
Bot ID devbot
Background |XXXXXXX

Microsoft.Bot.Schema.BotException:
   at Microsoft.Bot.ChannelConnector.BotAPI+<PostActivityToBotAsync>d__36.MoveNext (Microsoft.Bot.Base.ChannelConnector, Version=3.2.3.11, Culture=neutral, PublicKeyToken=nullMicrosoft.Bot.Base.ChannelConnector, Version=3.2.3.11, Culture=neutral, PublicKeyToken=null: D:\a\1\s\ChannelSDK\Microsoft.Bot.Base.ChannelConnector\API\BotAPI.csMicrosoft.Bot.Base.ChannelConnector, Version=3.2.3.11, Culture=neutral, PublicKeyToken=null: 480)
Inner exception System.Net.Http.HttpRequestException handled at Microsoft.Bot.ChannelConnector.BotAPI+<PostActivityToBotAsync>d__36.MoveNext:
   at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw (mscorlib, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089)
   at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification (mscorlib, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089)
   at Microsoft.Bot.ChannelConnector.BotAPI+<PostActivityToBotAsync>d__36.MoveNext (Microsoft.Bot.Base.ChannelConnector, Version=3.2.3.11, Culture=neutral, PublicKeyToken=nullMicrosoft.Bot.Base.ChannelConnector, Version=3.2.3.11, Culture=neutral, PublicKeyToken=null: D:\a\1\s\ChannelSDK\Microsoft.Bot.Base.ChannelConnector\API\BotAPI.csMicrosoft.Bot.Base.ChannelConnector, Version=3.2.3.11, Culture=neutral, PublicKeyToken=null: 452)
Inner exception System.Net.WebException handled at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw:
   at System.Net.HttpWebRequest.EndGetRequestStream (System, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089)
   at System.Net.Http.HttpClientHandler.GetRequestStreamCallback (System.Net.Http, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a)

Can you give more details about the activities ? Such as` request params` ,beartoken, and header and so on. Pls hide confidential information. — Jason Pan
@JasonPan i tried the same via postman by initializin the conversation directline.botframework.com/v3/directline/conversations and then passing the toke on to directline.botframework.com/v3/directline/conversations{{CONVID}}/activities with a sample message in body {"type": "message","from": {"id": "user1" }, "text": "hello"} . i could replicate 502 bad gateway there too — Shiva

Jason Pan Jason Pan · Accepted Answer · 2020-08-10T07:05:07

Follow the offical document, you can fixed the issue.

Pay attention to the format of Authorization.

Directline activities in custom domain - 502 Bad gateway - node js/java script - azure chatbot

2 Answers