# WebSDK: Black screen, no errors. \[1.7.5\]

**URL:** <https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142>\
**Category:** Web\
**Created:** [April 14, 2020, 4:31pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142 "2020-04-14T16:31:31Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 14, 2020, 4:31pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/1 "2020-04-14T16:31:31Z")

</div>

**Description**  
I very recently migrated from the API to the web SDK due to recent events in Zooms security updates. I used NPM to acquire the project, as per the docs found here: [https://github.com/zoom/websdk](https://github.com/zoom/websdk) and followed the instructions as closely as I could. The system appears to run the ZoomMtg.init function and throws the success log in the console, as seen in the screenshot but the join function doesn’t seem to call. I have added the preloaders and the JSLib call at the top of the file, along with the import as per the docs. Any assistance with this would be appreciated.

**Error**  
No error messages in console… just a success on ZoomMtg.init()

**Which version?**  
1.7.5

**Screenshots**

 ![Screen Shot 2020-04-14 at 17.14.04](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/2X/c/c6706b6b855788567989d90341116fe145045216.png)

---

<div class="post-metadata">

**Author:** ![michael\_p.zoom](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/michael_p.zoom/32/18105_2.png) [@michael\_p.zoom](https://devforum.zoom.us/u/michael_p.zoom)\
**Post date:** [April 14, 2020, 6:28pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/3 "2020-04-14T18:28:00Z")

</div>

Hi @dannyjs

Thanks for alerting us about this. Did the ZoomMtg.join function error out or succeeded? If the init was a success then the ZoomMtg.join should of ran afterwards.

```
ZoomMtg.init({
            leaveUrl: 'http://www.zoom.us',
            isSupportAV: true,
            success: function () {
                ZoomMtg.join(
                    {
                        meetingNumber: meetConfig.meetingNumber,
                        userName: meetConfig.userName,
                        signature: signature,
                        apiKey: meetConfig.apiKey,
                        passWord: meetConfig.passWord,
                        success: function(res){
                            $('#nav-tool').hide();
                            **console.log('join meeting success');**
                        },
                        error: function(res) {
                            **console.log(res);**
                        }
                    }
                );
```

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 14, 2020, 9:28pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/4 "2020-04-14T21:28:39Z")

</div>

Hi @michael_p.zoom

It did not trigger join success or error despite the init function succeeding.

---

<div class="post-metadata">

**Author:** ![michael\_p.zoom](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/michael_p.zoom/32/18105_2.png) [@michael\_p.zoom](https://devforum.zoom.us/u/michael_p.zoom)\
**Post date:** [April 15, 2020, 12:11am UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/5 "2020-04-15T00:11:06Z")

</div>

@dannyjs Can you post your codebase that includes the init and join functions?

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 15, 2020, 6:59am UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/6 "2020-04-15T06:59:09Z")

</div>

```
ZoomMtg.init({
            leaveUrl: meetConfig.leaveUrl,
            isSupportAV: true,
            success: (success) => {
                console.log(success)

                ZoomMtg.join({
                    signature: meetConfig.signature,
                    meetingNumber: meetConfig.meetingNumber,
                    userName: meetConfig.userName,
                    apiKey: meetConfig.apiKey,
                    userEmail: meetConfig.userEmail, 
                    password: meetConfig.password,

                    success: (success) => {
                        console.log(success);
                    },

                    error: (error) => {
                        console.log(error)
                    }
                })		
            },
            error: (error) => {
                console.log(error)
            }
        })

```

All of the data in meetConfig was acquired server side then passed through as data attributes (apart from the api key). Not sure if there is a smoother way of doing this?

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 15, 2020, 3:43pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/7 "2020-04-15T15:43:29Z")

</div>

@michael_p.zoom any luck with the above? Appreciate the support.

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 16, 2020, 3:15pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/8 "2020-04-16T15:15:28Z")

</div>

@michael_p.zoom 🙃 😃

 ![please_respond](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/2X/f/f9514087bcfdb7609bc6d176026a85dda0d4ea2a.png)

---

<div class="post-metadata">

**Author:** ![michael\_p.zoom](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/michael_p.zoom/32/18105_2.png) [@michael\_p.zoom](https://devforum.zoom.us/u/michael_p.zoom)\
**Post date:** [April 16, 2020, 8:20pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/9 "2020-04-16T20:20:11Z")

</div>

Hi @dannyjs

+1 for the image.

I’m not sure if the join parameters have to be in a specific order or not. I was able to get it working using the below code. Can you try and see if it works for you?

```
ZoomMtg.init({
            leaveUrl: meetConfig.leaveUrl,
            isSupportAV: true,
            success: (success) => {
                console.log(success)

                ZoomMtg.join({
                    meetingNumber: meetConfig.meetingNumber,
                    userName: meetConfig.userName,
                    signature: signature,
                    apiKey: meetConfig.apiKey,
                    passWord: meetConfig.passWord,

                    success: (success) => {
                        console.log(success);
                    },

                    error: (error) => {
                        console.log(error)
                    }
                })              
            },
            error: (error) => {
                console.log(error)
            }
        });
```

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 17, 2020, 6:39am UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/10 "2020-04-17T06:39:25Z")

</div>

Hi @michael_p.zoom

Thanks for getting back in touch.

Tried your suggestion but no joy, unfortunately. I did wonder the same during development of it so i did make sure that my list matched the list in the github documentation here: [https://github.com/zoom/websdk#usage](https://github.com/zoom/websdk#usage)

I also just ran a test in the browser (on the zoom website and hosted with desktop application) to make sure the meeting was set up correctly and all seems okay, just the SDK wont join.

Is there a particular way that I need to pass or format any of the data? I’m getting the data from the Zoom object / form, storing it in data attributes in the DOM, then putting it in the meetConfig object as seen above in my script.

---

<div class="post-metadata">

**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\
**Post date:** [April 20, 2020, 5:04pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/11 "2020-04-20T17:04:10Z")

</div>

Hey @dannyjs,

Make sure you have the following towards the [top of your file](https://www.npmjs.com/package/@zoomus/websdk#usage):

`ZoomMtg.setZoomJSLib(path to files)`  
`ZoomMtg.preLoadWasm();`  
`ZoomMtg.prepareJssdk();`

Please send me your code with those lines included so I can debug.

Thanks,  
Tommy

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 21, 2020, 3:14pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/12 "2020-04-21T15:14:03Z")

</div>

Hi @tommy,

No problem at all:

```
import $ from 'jquery';
import { ZoomMtg } from '@zoomus/websdk';
ZoomMtg.setZoomJSLib('/js/zoom', '/av');

ZoomMtg.preLoadWasm();
ZoomMtg.prepareJssdk();

let meeting = {
    init: function() {
        let meetingDOM = $('#meeting-active');

        if(meetingDOM.length > 0){
            const meetConfig = {
                apiKey: 'XXXXXXXXXXXX',
                signature: $(meetingDOM).data('hash'),
                leaveUrl: $(meetingDOM).data('exit'),
                meetingNumber: $(meetingDOM).data('id'),
                userName: $(meetingDOM).data('username'),
                userEmail: $(meetingDOM).data('email'), // required for webinar
                passWord: $(meetingDOM).data('pass'), // if required
                role: 0 // 1 for host; 0 for attendee or webinar
            };

            ZoomMtg.init({
                leaveUrl: meetConfig.leaveUrl,
                isSupportAV: true,
                success: (success) => {
                    console.log(success)

                    ZoomMtg.join({
                        signature: meetConfig.signature,
                        meetingNumber: meetConfig.meetingNumber,
                        userName: meetConfig.userName,
                        apiKey: meetConfig.apiKey,
                        userEmail: meetConfig.userEmail, 
                        password: meetConfig.password,

                        success: (success) => {
                            console.log(success);
                        },

                        error: (error) => {
                            console.log(error)
                        }
                    })		
                },
                error: (error) => {
                    console.log(error)
                }
            })
        }
    },
}

$(document).ready(function(){
    meeting.init();
});

```

Followed the updated documentation as closely as I could, I’ve done as much as I could programmatically in PHP (Laravel), then passed the safe data to the DOM for the SDK to use. The files referenced in setZoomJSLib have been hosted locally rather than trying to reference node\_modules from here.

Please do let me know if I have misunderstood the documentation anywhere and any assistance guiding me in the right direction would be greatly appreciated. The sooner we can have this up and running again, the better.

Thanks for your patience so far guys

Danny

---

<div class="post-metadata">

**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\
**Post date:** [April 23, 2020, 2:16am UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/13 "2020-04-23T02:16:57Z")

</div>

Hey @dannyjs,

I think I figured it out! 🙂

Can you try using `passWord` instead of `password` in your `ZoomMtg.join` function?

Thanks,  
Tommy

---

<div class="post-metadata">

**Author:** ![dannyjs](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dannyjs/32/2151_2.png) [@dannyjs](https://devforum.zoom.us/u/dannyjs)\
**Post date:** [April 23, 2020, 3:27pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/14 "2020-04-23T15:27:10Z")

</div>

@tommy Result! We now have something to work with. Cant believe it was that simple 🤦‍♂️

I now seem to be getting a “Password wrong” popup. Double checked and the password matches what I set. Even tried the password thats appended into the join link it generates. I’ll continue to debug my end, but in the meantime, any ideas would be a great help.

 ![Screenshot 2020-04-23 at 16.24.15](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/2X/6/68c3b273a9eee4b57bade67cb518bb76187696b0.png)

Thanks for everything so far, guys!

Danny

---

<div class="post-metadata">

**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\
**Post date:** [April 27, 2020, 6:32pm UTC](https://devforum.zoom.us/t/websdk-black-screen-no-errors-1-7-5/13142/15 "2020-04-27T18:32:01Z")

</div>

Hey @dannyjs,

Glad we are moving in the right direction! 🙂

Did you figure out the password issue? Can you private message me what password you are trying to use?

Thanks,  
Tommy