webchat | Websocket project on vue ( real-time chat project | Runtime Evironment library
kandi X-RAY | webchat Summary
kandi X-RAY | webchat Summary
:speaker: Websocket project based on vue (real-time chat project based on vue2.0)
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
- Connect to the server
- Helper function to upload a promise
- Initialize the room
- blur the page
- Returns a promise for an image item .
- Get a query string from a URL
- Get item from storage
- Main entry point .
- Return an array of files to upload .
- Upload a list to a promise
webchat Key Features
webchat Examples and Code Snippets
Community Discussions
Trending Discussions on webchat
QUESTION
I am currently looking at using Microsoft Web Chat to interact with my existing Node Js application built on MS Bot Framework Core but uses DialogFlow as NLU.
Current implementation: Web Page -> Custom UI Widget -> Connects to Node.js app built on MS Botframework Core -> Queries DialogFlow NLU to identify Intent -> Node.js app constructs the Dialog -> Gives response to user.
Looking at the Web Chat component, I cannot find references using any other NLU except Azure Bot Service. Is it mandatory to use Azure Bot Service/LUIS NLU to integrate with Web Chat?
I have also looked at offline-directline npm module but the last dev on the module is more than 3 years ago.
...ANSWER
Answered 2022-Mar-17 at 22:25Firstly, responding with a quick message about using offline-directline, you should feel reasonably comfortable with it. It is a few years old, but seems to stand the test of time with continued use and little in the way of issues that I have heard.
Another option would be to use a 'browser bot'. In this scenario, the bot is contained within the hosting page's html/scripts. So, there is no reliance on using Direct Line. I don't know your whole setup, so this may or may not align with your overall needs and architecture.
As for using Web Chat with something other than the Azure Bot Service, this would be an uphill battle. In theory, this is probably achievable to some degree. The issue is that Web Chat is heavily integrated with the BotFramework-DirectLineJS library. You might be able to cherry pick specific components from Web Chat, replace the Direct Line library with a make of your own, and modify the remaining code to work with your 'service'. But, I'm not certain the effort is worth it. That is something you would have to decide for yourself.
If you do go this direction, you will likely need to configure your 'service' to send messages that conform to the BotFramework schemas when communicating with Web Chat. Even without the dependency on Direct Line for connecting to the service, much of Web Chat is still oriented towards what an incoming message looks like (i.e. a BotFramework Activity) and handling it according to the properties it contains.
To start, here are a few areas you should review in order to correctly configure you service to handle inbound and outbound messages going to and coming from Web Chat:
- BotFramework Activity schema
- BotFramework Card schema
- BotFramework Transcript schema
- Web Chat's Activity, Card, Attachments, etc. Types - at present, these are loosely defined. I would expect that to change at some point in the future which may prove to be a changing break in your specific scenario.
This is not exhaustive and would require greater research as there are likely other considerations than the few I've listed above. But, again, this may not be necessary if you decide to utilize offline-directline.
QUESTION
I'm just started exploring botframework webchat with React. I have tried to come until below UI.
In docs, its mentioned like we can control each parts of the UI using React. But I couldn't see samples that could modify webchat message styles like (user/bot message height, customize message input field). In the ReactWebChat component, there is a className prop.
...ANSWER
Answered 2022-Feb-15 at 11:03This document should get you started. Most basic styling is available via configuration-settings.
The border of a textmessage for instance could be implemented via styleoptions:
QUESTION
I am using Twilio Flex WebChat to send and receive messages. I have a requirement to modify a message before sending it. Hence I added a listener beforeSendMessage in componentDidMount() where I am collecting the body of the message, transforming it, and sending the message. Here the issue is that it's sending both the original message and transformed message. My target is to send the transformed message alone. Can you possibly help me. Thank you.
ANSWER
Answered 2022-Jan-19 at 12:52The reason this is happening is because you are doing a SendMessage Twice.
What you can do with the Listener is modify the payload and let the execution continue and it will continue to execute. If you want to block the message sending you can call abortFunction()
QUESTION
I have created an Azure Bot. I have an echo bot running on my local machine. I have exposed my bot using ngrok. It is running fine when I use the Bot Framework Emulator.
I entered my ngrok bot url on the Azure Bot Configuration tab. When I tested my bot in the Azure Bot webchat ("Test in Web Chat" tab), I see multiple calls on the "/" which are not handled. What I am supposed to implement?
...ANSWER
Answered 2021-Dec-08 at 17:57What is the actual path that your bot is expecting messages to come in on, and have you entered that in Azure? The samples and templates are all expecting messages to come in on api/messages.
So, in your Azure configuration, when you set your messaging endpoint to your ngrok endpoint, you need to append the path.
For example: https://.ngrok.io/api/messages. If you notice, in the emulator as well, you're typically connecting to http://localhost:3978/api/messages, not just http://localhost:3978.
Thus, if you just use https://.ngrok.io, your bot will never respond because it has no code that tells it what to do with requests on that endpoint.
QUESTION
I am trying to show the "sendTypingIndicator" when the chatBot (Microsoft Bot Framework) is processing any requests.
I added sendTypingIndicator: true and sendTyping: true but still it does not show any animation, I searched in Microsoft documentation but i didn't find any specific.
This what I have:
ANSWER
Answered 2021-May-04 at 22:00so what you need is sending a typing activity from the bot when it receives a message request.
There's the ShowTypingMiddleware middleware that does just that.
You just have to add it in the adapter like this:
QUESTION
I am attempting to proof of concept a simple support & ticketing bot using Microsoft Bot Framework v4 and Azure. I have successfully created a bot via the Bot Framework Composer and deployed it to Azure using a Web App Bot. I have configured and installed the BotFramework-WebChat component on my test site and successfully connected the bot to it. The BotFramework-WebChat component is installed via cdn.botframework.com. The test site is a single page application and the bot sits alongside this such that it can be accessed at the users convivence.
Everything is working as expected. I would like however to post certain contextual information to the Bot depending on the current browser state. For example, if a user is looking at product ABC when they converse with the bot I'd like the bot to know this. To achieve it I'd like to update the user state on the bot channel, preferably via vanilla JavaScript when the main application state changes. I'd like to do this seamlessly in the background and I do not want to rely on additional frameworks such as React (the Microsoft Documentation references React heavily and I unfortunately have no understanding of the particular product so find it difficult/impossible to follow).
My question is therefore in two parts. Is the above possible using the API provided by the BotFramwork-WebChat component and if so how would one go about doing so? If it is not possible I would also appreciate any assistance on alternative methods should such alternatives exist.
...ANSWER
Answered 2021-Mar-02 at 14:11If you just want to capture information at the time the user renders the webchat session, you can do this by sending a custom event, which you'll also need to handle in your bot code. This specific code will not work if you are trying to create a single instance of the bot that persists across multiple pages, and you are wanting the page details sent every time, but the same concept should apply. This method sends the details only on the initial connection to the bot.
First you need to send an event from your bot rendering via custom store. Here is how I did it.
QUESTION
I have this react component. It works just fine for me.
...ANSWER
Answered 2021-Jan-15 at 05:48Nextjs is a frame work that allows you to build Static and Server Side rendered apps. So, it uses Nodesj under hood and window is not defined in nodejs. Only way to accessing window in react ssr frameworks is useEffect hook. Your dynamic import solution is right , becuase you are getting file on client side. I hope it makes sense.
Have a great day
QUESTION
I'm trying to integrate botframework-webchat to a gatsby.js website, gatsby develop builds successfully, however when i run the production build using the command gatsby build, it throws the following error.
...ANSWER
Answered 2020-Dec-24 at 08:57I've been aware of you have followed up the suggested link https://www.gatsbyjs.com/docs/debugging-html-builds/#fixing-third-party-modules to fix window issue.
BUT it this way is likely to prevent webpack compile the commonjs web chat packages properly which ended up with the issue.
I was also aware of the configuration the stage of build-html isn't called during dev that's why you wouldn't see the error as you yarn start // gatsby develop.
However, the document also suggests another way to fix is to use code splitting technique by using loadable-component. Personally, I think this way is best for you project since the chat is supposed to be rendered at the client side only.
Here's a few thing you would change:
- Remove your configuration in
gatsby-node:
QUESTION
Hi I am new to Microsoft's Bot Framework, pardon me for my questions.
I was trying out to change the styling for the chatbots and I came upon an issue where I was not able to disable my upload button via styleSet.
...ANSWER
Answered 2020-Dec-01 at 22:18It seems there is a small bug with styleOptions, at the moment. In the mean time, you can do the following to achieve hiding the upload button.
QUESTION
I'm implementing webchat with token based along with chat persistence everything works fine when user is online, but after some idle time if user is offline with no internet connectivity, for about 30-45 mins then later he gets back online and when ever he texting anything bot went to state DIRECT_LINE/POST_ACTIVITY_REJECTED and user was unable to chat with the bot its giving away send retry on my message bubble. Is there any way possible to handle?.
...ANSWER
Answered 2020-Nov-17 at 08:02I made a few adjustments to the code you supplied. I believe your token value was getting overwritten or corrupted, so I separated out the assigning of the token in the API call (token) and the variable assignment in the script (dl_token).
I was also getting an error on the refresh token call wrapped in the setInterval() function, which is why I use Babel, as shown below. (For testing, it helps identify errors that would otherwise have been missed.). Removing the actual API call from setInterval() and calling it as a separate function seemed to fix this.
After these changes, everything seems to be working smoothly. I only tested a few times waiting until the 45-50 minute, but didn't experience any issues with the token, needing to refresh, or receiving DIRECT_LINE/POST_ACTIVITY_REJECTED.
(Note that I made calls to my own 'token' server for generating and refreshing the token.)
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install webchat
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page
