# Zoom web sdk integration is not working

**URL:** <https://devforum.zoom.us/t/zoom-web-sdk-integration-is-not-working/13798>\
**Category:** Web\
**Created:** [April 18, 2020, 11:24am UTC](https://devforum.zoom.us/t/zoom-web-sdk-integration-is-not-working/13798 "2020-04-18T11:24:56Z")\
**Posts on this page:** 1\
**Showing post:** 15

<div class="post-metadata">

**Author:** ![taushifali](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/taushifali/32/2065_2.png) [@taushifali](https://devforum.zoom.us/u/taushifali)\
**Post date:** [May 23, 2020, 2:58pm UTC](https://devforum.zoom.us/t/zoom-web-sdk-integration-is-not-working/13798/15 "2020-05-23T14:58:01Z")

</div>

Hey @hrondor,  
What are you getting for checkSystemRequirements in console?  
Is your ZoomMtg loading fine?

Did you managed properly the zmmtg-root display properties as from the post [Zoom Meeting Custom Ui](https://devforum.zoom.us/t/zoom-meeting-custom-ui/5281/20).

What are you seeing in DOM’s network tab for the bootstrap.css and react-select.css?

I am pasting my current code, let me know if you get it worked with this.

```
import React, { Component } from 'react';
import { ZoomMtg } from '@zoomus/websdk';
import connect from 'src/apiClient';
import PropTypes from 'prop-types';
import { PromiseState } from 'react-refetch';
import PromiseStateContainer from '../../PromiseStateContainer';
import { createVideoConference } from '../../../services/videoConferencing.service';
import { selfUrl } from 'src/config';

const zoomMeeting = document.getElementById('zmmtg-root');

class ZoomConference extends Component {
  static propTypes = {
    match: PropTypes.object.isRequired,
    meetingDetails: PropTypes.instanceOf(PromiseState).isRequired
  };

  constructor(props) {
    super(props);
    this.state = {
      userEmail: 'myemail'
    };
  }

  componentDidMount() {
    ZoomMtg.setZoomJSLib('https://source.zoom.us/1.7.7/lib', '/av');
    ZoomMtg.preLoadWasm();
    ZoomMtg.prepareJssdk();
  }

  launchMeeting = () => {
    
    // change state of meeting
    this.setState({ meetingLaunched: !this.state.meetingLaunched })

    // generateSignature should only be used in development
    ZoomMtg.generateSignature({
        meetingNumber: meetConfig.meetingNumber,
        apiKey: meetConfig.apiKey,
        apiSecret: meetConfig.apiSecret,
        role: meetConfig.role,
        success(res) {
            console.log('signature', res.result);
            ZoomMtg.init({
                leaveUrl: 'http://www.zoom.us',
                success() {
                    ZoomMtg.join(
                        {
                            meetingNumber: meetConfig.meetingNumber,
                            userName: meetConfig.userName,
                            signature: res.result,
                            apiKey: meetConfig.apiKey,
                            userEmail: 'email@gmail.com',
                            passWord: meetConfig.passWord,
                            success() {
                                console.log('join meeting success');
                            },
                            error(res) {
                                console.log(res);
                            }
                        }
                    );
                },
                error(res) {
                    console.log(res);
                }
            });
        }
    });
}

  render() {
    zoomMeeting.style.display = 'none';
    zoomMeeting.style.height = '0px';
    zoomMeeting.style.width = '0px';
    zoomMeeting.style.position = 'relative';
    zoomMeeting.style.backgroundColor = 'black';
    zoomMeeting.style.zIndex = '1';
    return (
      <span>{this.launchMeeting()}</span>
    );
  }
}

```

Index.html

```
<!DOCTYPE html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0" />
  <link type="text/css" rel="stylesheet" href="https://source.zoom.us/1.7.7/css/bootstrap.css" />
  <link type="text/css" rel="stylesheet" href="https://source.zoom.us/1.7.7/css/react-select.css" />
</head>
<body>
<div id='root'></div>
<script src="https://source.zoom.us/1.7.7/lib/vendor/jquery.min.js"></script>
</body>
```

---

_[View the full topic](https://devforum.zoom.us/t/zoom-web-sdk-integration-is-not-working/13798)._
