Black screen when trying to join meeting

Description
I am trying to implement zoom web sdk (tried with 1.8.3 as well as 1.8.1) but when I try to join then the screen becomes black and I cant find any error in console nor do I see anything on the screen.

Error
I am trying to join zoom meeting using zoom web sdk on angular. But while joining I only see a black screen and cant find any error in console except one warning “DevTools failed to load SourceMap: Could not load content for https://source.zoom.us/1.8.1/lib/webim.min.js.map: HTTP error: status code 403, net::ERR_HTTP_RESPONSE_CODE_FAILURE”

This is present in my other project too but there the meeting works fine (though it is admin panel so I pass role 1 there). On further investigation I put some logs in init success just before I can ZoomMtg.join() but I dont see that log as well so my guess is init() is not working. Please help.

Which version?
1.8.1 and 1.8.3

To Reproduce(If applicable)
Steps to reproduce the behavior:
I have no idea on this.

Screenshots

Device (please complete the following information):

  • Device :laptop
  • OS: windows
  • Browser: Chrome

Additional context
Below is the code
in zoom component

ZoomMtg.setZoomJSLib(‘https://source.zoom.us/1.8.3/lib’, ‘/av’);

ZoomMtg.preLoadWasm();

ZoomMtg.prepareJssdk();

@Component({

selector: ‘app-zoom’,

templateUrl: ‘./zoom-class.component.html’,

styleUrls: [’./zoom-class.component.css’],

})

export class ZoomComponent implements OnInit {

currentClassroom;

constructor(

// public liveclassService: LiveClassService,

public httpClient: HttpClient,public zoomService:ZoomClassService

) {}

ngOnInit(): void {
document.getElementById(‘zmmtg-root’).style.display =“none”;

this.zoomService.getClassroom().subscribe((classroomData)=>{

console.log("classroom",classroomData);

/*this.currentClassroom = this.liveclassService.getCurrentClassroom();*/

    this.currentClassroom=classroomData[0];

this.currentClassroom.signature = ZoomMtg.generateSignature({

  meetingNumber: this.currentClassroom.meetingNumber,

  apiKey: this.currentClassroom.apiKey,

  apiSecret: this.currentClassroom.apiSecret,

  role: "0",

  success: function (res) {

    console.log("signature",res);

  },

});

this.startMeeting();

startMeeting() {

document.getElementById('zmmtg-root').style.display = 'block';

ZoomMtg.init({

  debug: true,

  leaveUrl: "https://localhost:4200",

  isSupportAV: true,

  success: (success) => {

    console.log("sucess",success);

    ZoomMtg.join({

      signature: this.currentClassroom.signature,

      meetingNumber: this.currentClassroom.meetingNumber,

      userName: this.currentClassroom.userName,

      apiKey: this.currentClassroom.apiKey,

      userEmail: this.currentClassroom.userEmail,

      passWord: this.currentClassroom.passWord,

      success: (success) => {

        ZoomMtg.showRecordFunction({

          show: true,

        });

      },

      error: (error) => {

        console.log(error);

      },

    });

  },

  error: (error) => {

    console.log("error",error);

  },

});

console.log("after init");

}

Hey @aamirjsiddiqui,

Thanks for reporting this. Do you by chance have a screenshot you could share? This will help us confirm the issue.

Thanks,
Tommy

hi @tommy I am also facing the same issue while integrating in angular

hi @tommy i am getting the same issue i am attaching the screenshot.please help me with this.

Hey @princebala19,

What version of the Web SDK are you using? Can you please provide steps to reproduce the issue?

Thanks,
Tommy

Hi @tommy I am using 1.8.3 web sdk version.Black screen is coming when i try to join meeting but i could able to see the admit message for the user name trying to join in main meeting id (host).exact same issue @aamirjsiddiqui has posted