I’m working with angular and integrated zoom ,it is working in local but in production is not working.
I have imported zoom-jssdk module into project.
Reason: zoom-jssdk error my assumption.
How can I resolve this problem?
Hey @goalstreets
Thanks for reaching out!
Can you give me more details? Specifically how to reproduce your issue so I can debug on my end?
Try reproducing it here, I’ve installed the zoomus-jssdk into it https://stackblitz.com/edit/angular-q5maje
Thanks,
Tommy
I have installed zoom-jssdk it is working in local but not in production due to this app not getting loaded
Error in /turbo_modules/zoomus-jssdk@1.4.2/dist/zoomus-jssdk.umd.min.js (37:45859)
$ is not defined
this is the error jquery module is already installed
import { ZoomMtg } from ‘zoomus-jssdk’;
import { Injectable } from ‘@angular/core’;
@Injectable()
export class zoomService {
constructor() {
let dynamicScripts = ‘https://source.zoom.us/zoom-meeting-1.3.8.min.js’;
for (var i = 0; i < dynamicScripts .length; i++) {
let node = document.createElement(‘script’);
node.src = dynamicScripts [i];
node.type = ‘text/javascript’;
node.async = false;
node.charset = ‘utf-8’;
document.getElementsByTagName(‘head’)[0].appendChild(node);
}
}
API_KEY:any=‘xxxxxx’;
API_SECRET:any=‘xxxx’;
zoomJoinmeeting(url,meetingId,emailid) {
ZoomMtg.setZoomJSLib('https://dmogdx0jrul3u.cloudfront.net/1.3.7/lib', '/av');
document.getElementById('zmmtg-root').style.display="block"
debugger;
ZoomMtg.preLoadWasm();
ZoomMtg.prepareJssdk();
const meetConfig = {
'apiKey': this.API_KEY,
'apiSecret': this.API_SECRET,
'meetingNumber': meetingId,
'userName': emailid,
'leaveUrl': url,
'role': 0
};
var signature = ZoomMtg.generateSignature({
meetingNumber: meetConfig.meetingNumber,
apiKey: meetConfig.apiKey,
apiSecret: meetConfig.apiSecret,
role: meetConfig.role,
success: function(res) {
console.log(res.result);
}
});
ZoomMtg.init({
leaveUrl: 'mainschedule',
isSupportAV: true,
success() {
ZoomMtg.join({
meetingNumber: meetConfig.meetingNumber,
userName: meetConfig.userName,
signature: signature,
apiKey: meetConfig.apiKey,
userEmail: meetConfig.userName,
success() {
console.log('join meeting success');
},
error(res) {
console.log("hai",res);
}
});
},
error(res) {
console.log('hi',res);
}
});
}
// console.log(‘checkSystemRequirements’);
// console.log(JSON.stringify(ZoomMtg.checkSystemRequirements()))
}
this is my service file
Hey @goalstreets!
Thanks for sending me this info, I was able to reproduce the issue!
Can you try adding this line after your <app-root></app-root> in index.html
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
I know you said you already imported jquery, but try adding it to your index.html and let me know if that works.
Here is my index.html file
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>AngularZoomDebug</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</body>
</html>
And here is my component where I am using Zoom
import { Component } from '@angular/core';
import { ZoomMtg } from 'zoomus-jssdk';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'angular-zoom-debug';
constructor() {
console.log(ZoomMtg.checkSystemRequirements())
}
}
Let me know if this fixed it, if not we can try something else!
Hi,
We implemented given suggestion and able to resolve to some extent. Now the issue is when it is geting loaded, dynamically few code is getting generated including styles, which is affecting our portal styles.
I have attached the code that is getting generated dynamically. Please help us in how to handle this or change this so that zoom windows shouldn’t affect and also our pages shouldn’t affect.
Thanks in advance
Swarnalatha
Hi @goalstreets,
Can you send us the code logic related to zoom, which is having issues? You can either push it to a github repo or you can email us it at developersupport@zoom.us
Let me know if you have questions.
Thanks
Hi,
I have attached the project . When we are publishing this, we are getting screen with black screen , with background as black color.
Also, dynamically code with styles is getting generated. For reference, I have attached dynamically generated code.
Please let us the process how to modify or manage the generated code. We need the solution on high priority.
Thanks in advance
Swarnalatha
Hi,
I have attached the project . When we are publishing this, we are getting screen with black screen , with background as black color.
Also, dynamically code with styles is getting generated. For reference, I have attached dynamically generated code.
Please let us the process how to modify or manage the generated code. We need the solution on high priority.
Thanks in advance
Swarnalatha
zoom.rarI run with your demo, and see the block page background because of generating those two codes and use the whole page when invoking checkSystemRequirements().
Zoom websdk use window.innerWidth, window.innerHeight, it uses the entire page, SPA(simple page application), you can redirect to dependent component page use Websdk. In the feature. We plan to let customer Websdk page size instead use the whole page.
Hi,
The issue is still exists. Please can we have chat and resolve the issue as emails through is taking much turn around time.
We are paying the amounts for the plan from last 3 months and till now we couldn’t deploy in the server and using the services.
We are loosing the business. I request to you to come in the chat and will work together and resolve the issue.
We will be available any time.
Thanks in advance
Swarnalatha
direct message to me use zoom client, My work time is GMT+8,
Hi,
I am facing the same error for my react js website.
Everything is working fine on local but its not working in production.
Can you guys suggest me what I might be missing.
Thanks
Taushif
Hey @taushifali,
Please share additional details about your issue. What is the error, version of Web SDK you are using, and steps to reproduce the issue?
Thanks,
Tommy