Unexpected token < - React app

Meeting SDK Web
1

Description
I’m just setting up a component to test zoom into a react app and im getting an error. I guess is something related to jquery library or zoom source but i was not able to find the solution yet.
Im using jwtApp

Error
Uncaught SyntaxError: Unexpected token ‘<’
VM101 5510_js_media.min.js:1 Uncaught SyntaxError: Unexpected token ‘<’

Which version?

“@zoomus/websdk”: “^1.7.10”,

To Reproduce(If applicable)
Steps to reproduce the behavior:
just after component render

Additional context
This is the component code:

import React, { useEffect, useState } from 'react';
import styled from 'styled-components';
import axios from 'axios';

import { ZoomMtg } from '@zoomus/websdk';

import { Column, Row } from '../../components/Layout';

export const Container = styled(Column)`
  height: 100vh;
  margin: 20px;
  background-color: darkgrey;
`;

export const Section = styled(Row)`
  padding-top: ${(props) => props.withPadding && '15px'};
  border-bottom: ${(props) => props.withBorder && '1px solid whitesmoke'};
`;

const meetConfig = {
  apiKey: '',
  meetingNumber: '',
  leaveUrl: 'www.google.com.ar',
  userName: 'Test',
  role: 1 // 1 for host; 0 for attendee or webinar
};

export default () => {
  const [currentSignature, setCurrentSignature] = useState();

  useEffect(() => {
    const init = async () => {
      const {
        data: { signature }
      } = await axios.post('http://localhost:5001', {
        data: { meetingNumber: meetConfig.meetingNumber, role: 1 }
      });
      setCurrentSignature(signature);
    };
    ZoomMtg.preLoadWasm();
    ZoomMtg.prepareJssdk();
    ZoomMtg.setZoomJSLib('https://source.zoom.us/1.7.4/lib', '/av');

    console.log('checkSystemRequirements');
    console.log(JSON.stringify(ZoomMtg.checkSystemRequirements()));

    init();
  }, []);

  const onClick = () => {
    ZoomMtg.init({
      debug: true,
      leaveUrl: 'www.google.com',
      success: () => {
        ZoomMtg.join({
          signature: currentSignature,
          apiKey: meetConfig.apiKey,
          meetingNumber: meetConfig.meetingNumber,
          userName: meetConfig.userName,
          userEmail: meetConfig.userEmail,
          passWord: meetConfig.passWord,
          success: (success) => {
            console.log(success);
          },
          error: (error) => {
            console.log(error);
          }
        });
      }
    });
  };

  return (
    <button type="button" onClick={onClick}>
      Empezar
    </button>
  );
};

and from the console, seems that is able to execute the loaders:

Navigated to http://localhost:5000/zoomtest
log.js:24 [HMR] Waiting for update signal from WDS…
index.js:47 checkSystemRequirements
zoomus-websdk.umd.min.js:2 Zoom support you browser. Chrome/84.0.4147.105
zoomus-websdk.umd.min.js:2 You browser support below features
index.js:48 {“browserInfo”:“Chrome/84.0.4147.105”,“browserName”:“Chrome”,“browserVersion”:“84.0.4147.105”,“features”:[“viewSharing”,“screenShare”,“computerVideo”,“computerAudio”,“callIn”,“callOut”,“chat”,“closedCaption”,“QA”]}
zoomus-websdk.umd.min.js:2 pre load wasm success: http://localhost:5000/node_modules/@zoomus/websdk/dist/lib/av/5510_audio.encode.wasm
zoomus-websdk.umd.min.js:2 pre load wasm success: http://localhost:5000/node_modules/@zoomus/websdk/dist/lib/av/5510_video.decode.wasm
zoomus-websdk.umd.min.js:2 pre load wasm success: http://localhost:5000/node_modules/@zoomus/websdk/dist/lib/av/5510_video.mt.wasm
webpackHotDevClient.js:138 ./src/components/MakeAQuestion.js
Line 74:6: React Hook useEffect has a missing dependency: ‘urlAlias’. Either include it or remove the dependency array react-hooks/exhaustive-deps
printWarnings @ webpackHotDevClient.js:138
handleWarnings @ webpackHotDevClient.js:143
push…/node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage @ webpackHotDevClient.js:210
webim.min.js:1 Uncaught SyntaxError: Unexpected token ‘<’
5510_js_media.min.js:1 Uncaught SyntaxError: Unexpected token ‘<’
[Violation] ‘load’ handler took 150ms
zoomtest:1 Unchecked runtime.lastError: The message port closed before a response was received.
[Violation] ‘load’ handler took 230ms

Thanks in advance.

2

Hey @avglive.developer,

I believe the issue is this line, notice how you are using a deprecated version of the Web SDK, 1.7.4.

Please try matching it with the version you stated you are using, 1.7.10. :slight_smile:

Thanks,
Tommy

3

Thanks! that’s the problem. Sorry i’m pretty new on this, i didn’t knew that those have to match. Many thanks!

1 Like
4

No worries! Happy to hear it is working now! :slight_smile:

Let us know if you have additional questions!

-Tommy

5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.