Error For Integrate ZCC SDK In My Natice Code React And Express Js

Contact Center
1

Hi support,

After creating the entry ID and flow in the contact center management, I copied the script code and injected it into my app.js code like this:

useEffect(() => {
const script = document.createElement(‘script’);

script.src = "https://us01ccistatic.zoom.us/us01cci/web-sdk/chat-client.js";
script.async = true;
script.dataset.chatEntryId = "tz4HFewSRHCiNnh7127LtA";
script.dataset.env = "us01";
script.dataset.apikey = "ATzPJiLnQnytPJ-y7SI-eA";

document.body.appendChild(script);

return () => {
  document.body.removeChild(script);
} }, []);

However, it shows me an error in the screenshot. Please advise on how to solve this problem. Additionally, I’m encountering another error for the video call. The call is passed to the agent in the application, but upon response, an error is displayed in the screenshot. Here’s the relevant code:

           // useEffect(() => {
            useEffect(() => {
              // Create a script element
              const script = document.createElement('script');

              // Set script attributes
              script.setAttribute('data-entry-id', 'ScXTlvX3RneMX7C81SZZrQ');
              script.setAttribute('data-env', 'us01');
              script.setAttribute('data-apikey', 'ATzPJiLnQnytPJ-y7SI-eA');
              script.src = 'https://us01ccistatic.zoom.us/us01cci/web-sdk/video-client.js';

              
              // Append the script to the head of the document
              document.head.appendChild(script);

              return () => {
                // Clean up: Remove the script when the component unmounts
                document.head.removeChild(script);
              };
            }, []);

Best Regards,
firas

2

@firas.ghobber1, Thank you for posting in the Zoom Developer Forum. Can you reshare the error you are seeing? This will help in identifying what’s happening.

3

Hi Donte,

I found a problem related to some HTML files where I included the Meeting SDK libraries:

<!-- Add Scripts for Client View -->
<script src="https://source.zoom.us/2.12.0/lib/vendor/react.min.js"></script>
<script src="https://source.zoom.us/2.12.0/lib/vendor/react-dom.min.js"></script>
<script src="https://source.zoom.us/2.12.0/lib/vendor/redux.min.js"></script>
<script src="https://source.zoom.us/2.12.0/lib/vendor/redux-thunk.min.js"></script>
<script src="https://source.zoom.us/2.12.0/lib/vendor/lodash.min.js"></script>

<script src="https://source.zoom.us/zoom-meeting-2.12.0.min.js"></script>

Additionally, the following script seems to be causing an error:

<script data-chat-entry-id="*******************" data-env="us01" data-apikey="***********************" src="https://us01ccistatic.zoom.us/us01cci/web-sdk/video-client.js"></script>

When I comment out the Meeting SDK code, the code works without any errors. It appears there may be a conflict between the two script libraries.

Best regards,

4

@firas.ghobber1,

I really appreciate you taking the time to provide this feedback, it’s incredibly valuable to us! In order to help us better understand and diagnose the issue you’ve encountered, would you be able to provide us with a GitHub repository that reproduces the behavior you’re experiencing? This will allow us to delve deeper into the problem and provide you with a more accurate solution.

6

Hi Donte,

I’d like to share my GitHub repository with you, but sorry that project is private.