When the bot is loaded with the custom HTML, the bot throws "Unable to Connect"

[abhishekkumar717]

I have been using the codebase for disabling the hero card as suggested in my previous ticket https://github.com/microsoft/BotFramework-Composer/issues/9460#issuecomment-1370126330. However, the codebase is working for few bot IDs, it is not working for others. I raised a ticket with Microsoft Support, below are their inputs :-

Issue : When the bot is loaded with the custom HTML, the bot throws "Unable to Connect" , we reached out to MS support and they confirmed that Request URL : https://directline.botframework.com/v3/directline/conversations does not work,  we need to specify the domain / region on the endpoint to force it using a European endpoint, which should be Request URL as:

https://europe.directline.botframework.com/v3/directline/conversations to continue working. From F12 network traces:-

code: "RegionNotAllowed"message: "The request received in india but target regional bot belongs to europe. Please check BaseURI https://docs.microsoft.com/azure/bot-service/rest-api/bot-framework-rest-direct-line-3-0-api-reference?view=azure-bot-service-4.0#base-uri." Ask from MS is to update the domain as below, but there is no where we can find the domain in the custom HTML to update.

Ask : Please help us to update the domain to call the regional endpoint as following : https://europe.directline.botframework.com/v3/directline/conversations

[stevkan]

@abhishekkumar717 - I just tested passing in domain: 'https://europe.directline.botframework.com/v3/directline' into my Web Chat implementation and I didn't encounter any errors. The directline object showed the passed in domain property and value. However, it should be noted that my bot was created in the global domain vs a regional one. I also attempted to pass in a bogus domain value which did cause Web Chat to fail. So, I can verify the domain property is valid and does respect the value passed in.

• Can you tell me which region, if any, the bot was originally created in? You can find this in the Overview tab of the resource group in the displayed list of resources.

• Can you elaborate on what you mean in the below statement? Are you running multiple bots and attempting to use one Web Chat instance? Or does 'bot IDs' refer to something else? For example, the activity ID of each message? Or something else?

  However, the codebase is working for few bot IDs, it is not working for others.

• Which version of Web Chat are you running?

• Was your bot published from Composer or PVA?

• Are you able to share your Web Chat code (sanitized of any keys or secrets)?

[abhishekkumar717]

@stevkan Thanks a lot for your analysis. Please find my responses below :-

1) This is a PVA bot with topics developed in both PVA & Bot Framework Composer and hosted in Europe. Hence, this is a PVA Bot integrated with skill developed using Bot framework Composer, and not a web App Bot.

2) By multiple BOT ids I meant the value for "var theURL" i.e the mobile token endpoint value in the attached TestBot.html file. The bot works fine for one value of mobile token endpoint and does not work for the other value.

To give more context, currently I have developed two bots, one for demo purpose and the other is the actual bot. When I use the corresponding token endpoint of the Demo bot in "var theURL" the chatbot works fine. But when I use the corresponding token endpoint for the Actual Bot in "var theURL", the bot does not work and displays error message "Unable to Connect".

Below is the network trace for the erroneous bot :-

"code: "RegionNotAllowed"message: "The request received in india but target regional bot belongs to europe. Please check BaseURI https://docs.microsoft.com/azure/bot-service/rest-api/bot-framework-rest-direct-line-3-0-api-reference?view=azure-bot-service-4.0#base-uri.""

3) As this is a PVA integrated bot framework composer BOT, I am not sure about the version of Webchat but I have been using Bot Framework Composer v2.1.1 for Developing the Topics.

4) This is the process I follow : Open Bot in PVA -> Open Topics in Bot Framework Composer -> Develop topics in Bot Framework Composer -> Publish from Bot Framework Composer -> Check the Changes on PVA -> Publish the Bot from PVA -> Open Settings in PVA -> Channels -> Mobile -> Copy Token Endpoint -> Use the copied token endpoint in "var theURL" in TestBot.html file

5) Please find the attached TestBot.html file for your reference.

I have referred to below 3 documents for creating the TestBot.html file a) https://learn.microsoft.com/en-us/power-virtual-agents/customize-default-canvas b) https://learn.microsoft.com/en-us/power-virtual-agents/configure-bot-greeting c) https://github.com/microsoft/BotFramework-WebChat/blob/main/samples/05.custom-components/l.disable-adaptive-cards/index.html

TestBot.zip

[stevkan]

@abhishekkumar717 - Thank you for the detailed response. Regarding 'request received in india', is India mentioned because that is where you are attempting to communicate with the bot from (i.e., you are located in India)? Or is there some other reason India is mentioned?

[stevkan]

@abhishekkumar717 - You can disregard the above question as I was able to repro the issue. I created an environment with the region set to 'Europe'. I then created a PVA bot in that environment. I published the bot and then copied the Mobile channel's token endpoint. Using the HTML file you provided in the TestBot.zip file, I pasted the token endpoint in the theURL variable.

When I opened the site up and clicked the button to start the chat, I received the error you posted above (in my case, it listed 'unitedstates' instead of 'india'). However, when I added the domain property as shown below, refreshed the page, and attempted a conversation, I did NOT receive any additional errors. The bot was able to communicate without issue at that point.

const App = () => {
  const directLine = useMemo( () => window.WebChat.createDirectLine( {
    token,
    domain: 'https://europe.directline.botframework.com/v3/directline'
  } ), [] );
  console.log(directLine);
  return <ReactWebChat attachmentMiddleware={ attachmentMiddleware } directLine={ directLine } store={ store } styleOptions={ styleOptions } />;
};

Please note these two points:

1. I suspected that this was not a Composer issue as the generated token came from PVA, the environment (and associated region) is set via the Power Platform admin center, and the bot is published into production from PVA. Composer is only being used to help build the bot. As such, I did not integrate Composer into this test.
2. I discovered a few coding errors in the HTML file you provided. They were minor things like extra characters in the style, an extra closing div element, two Web Chat CDN scripts in the <head>, etc. Nothing that should really affect this. However, I included the updated HTML file in case of interest/help.

Please try the updated code to see if it makes a difference and let me know. If there is no change then I will work to find someone on the PVA team that can further assist you with this issue.

TestBot-updated.zip

[abhishekkumar717]

@stevkan Apologies for late reply, I was on holiday. Yes, the above solution works indeed. Thanks a lot for your quick help.

[kkdubey]

how to get bot domain or base url if i'm using directline speech token url. Getting below error "error": { "code": "RegionNotAllowed", "message": "The request received in france but target regional bot belongs to europe. Please check BaseURI https://docs.microsoft.com/azure/bot-service/rest-api/bot-framework-rest-direct-line-3-0-api-reference?view=azure-bot-service-4.0#base-uri." }