Hi @tommy Thanks for replying.
We come up with the solution of “Window not define issue” using below code.
And the come up with the solution of “Black screen” using below post.
Now the issue is this.
zoomus-websdk.umd.min.js?478e:2 Uncaught TypeError: $.ajax is not a function
at i (zoomus-websdk.umd.min.js?478e:2)
at y (zoomus-websdk.umd.min.js?478e:2)
at Object.join (zoomus-websdk.umd.min.js?478e:2)
at Object.success (ZoomWindow.vue?2b25:33)
at z (zoomus-websdk.umd.min.js?478e:2)
at t.value (zoomus-websdk.umd.min.js?478e:2)
at m (zoomus-websdk.umd.min.js?478e:2)
at Object.init (zoomus-websdk.umd.min.js?478e:2)
at VueComponent.mounted (ZoomWindow.vue?2b25:29)
at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
Below is the code
zoom.client.js
import Vue from 'vue'
import { ZoomMtg } from '@zoomus/websdk';
console.log("checkSystemRequirements");
console.log(JSON.stringify(ZoomMtg.checkSystemRequirements()));
// CDN version default
ZoomMtg.setZoomJSLib('https://dmogdx0jrul3u.cloudfront.net/1.3.7/lib', '/av');
ZoomMtg.preLoadWasm();
ZoomMtg.prepareJssdk();
var API_KEY = "we use our own key";
var API_SECRET = "we use our own key";
const MeetingCfg = (meetingId, nickname) => ({
apiKey: API_KEY,
apiSecret: API_SECRET,
meetingNumber: meetingId,
userName: nickname,
passWord: "we use meeting crated password",
leaveUrl: "https://zoom.us",
role: 0
})
// what variable you hook into Vue's prototype will be available on ANY vue component
Vue.prototype.$ZoomMtg = ZoomMtg
Vue.prototype.$MeetingCfg = MeetingCfg
ZoomWindow.vue
<template>
<div>
</div>
</template>
<script>
export default {
props: {
nickname: String,
meetingId: String
},
mounted () {
const meetConfig = this.$MeetingCfg(this.meetingId, this.nickname)
const ZoomMtg = this.$ZoomMtg
// Generate Signature function
const signature = ZoomMtg.generateSignature({
meetingNumber: meetConfig.meetingNumber,
apiKey: meetConfig.apiKey,
apiSecret: meetConfig.apiSecret,
role: meetConfig.role,
success: function(res) {
// eslint-disable-next-line
console.log("success signature: " + res.result);
}
});
// join function
ZoomMtg.init({
leaveUrl: "http://www.zoom.us",
isSupportAV: true,
success: () => {
ZoomMtg.join({
meetingNumber: meetConfig.meetingNumber,
userName: meetConfig.userName,
signature: signature,
apiKey: meetConfig.apiKey,
userEmail: "email@gmail.com",
passWord: meetConfig.passWord,
success: function(res) {
// eslint-disable-next-line
console.log("join meeting success");
},
error: function(res) {
// eslint-disable-next-line
console.log(res);
}
});
},
error: function(res) {
// eslint-disable-next-line
console.log(res);
}
});
}
};
</script>
zoom.vue
<template>
<zoom-window />
</template>
<script>
import ZoomWindow from '~/components/ZoomWindow'
export default {
components: {
ZoomWindow
}
}
</script>
nuxt.config.js
plugins: [
'~/plugins/zoom.client.js'
],