How to fix issue related to 500 error code in web chat channel after clicking submit in Adaptive card in chatbot developed using V4 C#?

Question

How to fix the issue related to 500 error occurring in web chat channel after clicking submit button in Adaptive card in chat bot developed through V4 C#?

Creating t

Answer 1

Below is a summary of the comments on the OPs post that lead to the resolution of the issue.

Debugging techniques

• Ensure that the bot is working locally.
• Check the Log stream or log files via Kudu under Development Tools > Advanced tools for your App Service. You can also turn on Application logs under Monitoring > App Service logs for your App Service then view the log stream via the Log stream section of your App Service while you test your bot in Web Chat in another tab/window.
• Check that the App Settings entries exist and are correct (password, app id etc).
• Debug the remote channel using your local code as per @Kyle Delaney. More instructions are available here, basically this entails the following:

• Ensure that ngrok is installed.
• The following instructions are roughly based on the guide here :
• Open the solution in Visual Studio.
• Start debugging in Visual Studio.
• Note down the port in the localhost address for the web page that is opened (this should be 3978).
• Navigate into the directory where you extracted ngrok.
• Type cmd into the address bar and press enter to open a new command prompt window.
• Create a publicly accessible URL that tunnels all http traffic on a specified port to your machine:
• ngrok http 3978 --host-header=localhost
• Copy the https forwarding URL.
• This should be in the form of https://.ngrok.io.
• Keep the command prompt window running ngrok open because once it is closed the URL will no longer be accessible.
• Stop debugging.
• In the Azure Portal open the Web App Bot resource.
• Go to Bot management > Settings > Configuration and replace the first part of the URL https://.azurewebsites.net with the ngrok URL.
• The final URL should be in the form of https:///api/messages.
• Click Save (you have click outside of the text box for the Save button to be enabled).
• Go to App Service > Settings > Configuration and note down the value for MicrosoftAppId and MicrosoftAppPassword.
• The value in the .bot file is the encrypted value, we need the decrypted value for the emulator.
• In Visual Studio Copy the appId and appPassword key value pairs from the Production endpoint in the .bot file to the Development endpoint.
• Ensure that the endpoint value for the Development endpoint is set to the localhost URL (http://localhost:3978/api/messages ).
• Save your changes in Visual Studio.
• Start debugging in Visual Studio.
• Open Test in Web Chat in Azure.
• Test the bot functionality.

• You should hit any breakpoints that you've set in the code.

• CLEAN UP STEPS - IMPORTANT!!!

• Restore the Messaging endpoint URL for the Web App Bot in Azure to it's original value AND save the change.
• Undo/revert any changes to the .bot file.
• Close the command prompt window running ngrok.
• Close the Bot Framework Emulator

---

Null reference error

This has been covered numerous times by multiple authors but in a nutshell... one of your objects or a property of one of your objects that you are trying to access is null. When you hit your breakpoint, step through your code line by line in the debugger until you find the line that breaks. Once you find the line that breaks you can inspect your variables and their properties by hovering over them.

---

ChannelData not coming through in the WebChat channel

I ran into this problem myself and couldn't find any documentation on why this is the case, but I managed to solve this issue with the following code inside my OnTurnAsync method:

if (dc.Context.Activity.Type == ActivityTypes.Message)
{
    //PropertyInfo channelDataProperty = dc.Context.Activity.GetType().GetProperty("ChannelData");
    Activity activity = dc.Context.Activity;
    object rawChannelData = activity.ChannelData;

    // For the Bot Framework Emulator
    if (rawChannelData != null)
    {
        JObject channelData = JObject.Parse(rawChannelData.ToString());

        if (channelData.Children().Any(c => ((JProperty)c).Name == "postBack") && activity.Value != null)
        {
            dc.Context.Activity.Text = "your-value-here";
        }
    }
    // For the WebChat channel since it doesn't provide ChannelData
    else if (activity.ChannelId == Channels.Webchat && activity.Value != null)
    {
        dc.Context.Activity.Text = "your-value-here";
    }
}

This could be further simplified (if you like) to:

if (dc.Context.Activity.Type == ActivityTypes.Message)
{
    // For the Bot Framework Emulator AND the WebChat channel
    if (dc.Context.Activity.Value != null && dc.Context.Activity.Text == null)
    {
        dc.Context.Activity.Text = "your-value-here";
    }
}

The reason that the simplified version of code above should work is because as you know Adaptive Cards are the only time that the .Value property of the Activity should be populated, the rest of the time the postback data is in the .Text property and it will be automatically picked up by the code in your WaterfallDialog. I would advise testing this simplified code yourself before deciding to go with it as you may have scenarios that I do not where .Value is populated outside of an Adaptive Card.