amazon-connect / amazon-connect-chat-interface

Amazon Connect Chat Interface - a browser-based customer chat widget for your website integrating with Amazon Connect ChatJS
https://docs.aws.amazon.com/connect/latest/adminguide/what-is-amazon-connect.html
MIT No Attribution
40 stars 43 forks source link

Audio notifications not working #238

Closed SanathTech closed 1 month ago

SanathTech commented 7 months ago

I have embedded this app within this custom chat widget: https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/customChatWidget

I am currently trying to implement audio notifications to our chat as outlined in your docs: https://github.com/amazon-connect/amazon-connect-chat-interface/blob/master/.github/docs/AudioNotificationsFeature.md

The issue I'm facing is that the chat is unable to detect the audio file I am using. I believe the reason for this may be because of how the chat code is configured.

Basically, the amazon connect chat interface is embedded within the custom chat widget. To build our code, we must go into the amazon-connect-chat-interface folder and run the build. Then we take the amazon-connect-chat-interface.js that is generated, and put it inside the outer folder where the custom chat widget public folder lies.

image (2)

xiajon commented 7 months ago

Could you give more detail on how you are importing the audio file in the code and where you are hosting the audio file and the amazon-connect-chat-interface.js? From the error it looks like there is an issue when referencing the audio file

SanathTech commented 7 months ago

The audio file is imported from an assets folder under src under amazon-connect-chat-interface into ChatSession.js like so: import sound from "../../assets/sounds/livechat-129007.mp3" When I run the build, it generates a static folder with all media files, which I take along with the amazon-connect-chat-interface.js file and put them into the public folder of the chat widget, which is then hosted on s3. When I ctrl+F the amazon-connect-chat-interface.js file, I can see that it references the audio file along the lines of "exports = 'static/media/livechat...'" I'm guessing you're right that I'm not referencing the audio file correctly, any idea what I'm doing wrong?

chauhuynh97 commented 7 months ago

Hello, instead of importing sound, could you try this for sanity check:

const audioContext = new AudioContext();
this.audio = new Audio('../../assets/sounds/livechat-129007.mp3');
const source = audioContext.createMediaElementSource(this.audio);
source.connect(audioContext.destination);
this.audio.play();
mrajatttt commented 2 months ago

Hi @SanathTech, Any updates on this?

mhiaror commented 1 month ago

No response from issue creator, seems like incorrect path reference for the audio file. The feature is working as expected, closing the issue.