I have exhausted all efforts to join the meeting, encountering a persistent error in the console. Despite a month of troubleshooting, I remain stuck in resolving this issue. My seniors are growing increasingly dissatisfied with the lack of progress. The problem persists both on localhost and the live server, leaving me in a critical situation.
Your urgent attention and assistance in addressing this matter would be highly appreciated.
I have include component , jwt signature, error ,zoom version
I am using "@zoomus/websdk": "^2.17.0",
{type: 'JOIN_MEETING_FAILED', reason: 'Invalid Parameter', errorCode: 4003}
errorCode
:
4003
reason
:
"Invalid Parameter"
type
:
"JOIN_MEETING_FAILED"
[[Prototype]]
:
Object
here is the jwt signature
redacted
and here is the full component that I am implemented
import * as React from 'react';
import ZoomMtgEmbedded from '@zoomus/websdk/embedded';
const modalBg = {
width: '100%',
height: '100%',
background: '#121212',
position: 'absolute',
zIndex: '9999',
top: '50%',
left: '50%',
transform: 'translate(-50%, -50%)',
}
const style = {
position: 'absolute',
zIndex: '9999',
top: '50%',
left: '50%',
transform: 'translate(-50%, -50%)',
width: '100%',
height: '100%' ,
bgcolor: 'black',
border: '1px solid #e1e1e1',
borderRadius: '10px',
boxShadow: 24,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
p: 4,
};
const joinMeet = {
background: '#1BA9A0',
color: '#fff',
padding: '6px 20px',
border: '0px',
fontSize: '14px',
borderRadius: '8px',
'&:hover': {
background: '#39c3ba'
}
}
const closeModal = {
position: 'absolute',
top: '20px',
right: '20px',
cursor: 'pointer',
zIndex: '999'
}
export default function ZoomPopup({zoomData, onClose}) {
const [open, setOpen] = React.useState(false);
// let userData = Cookies.get("loginData")? JSON.parse(Cookies.get("loginData")):null
const client = ZoomMtgEmbedded.createClient();
console.log(client,"client")
var authEndpoint = `${process.env.REACT_APP_BASE_URL}/api/v1/zoom/authEndpoint`
var sdkKey = `${process.env.ZOOM_MEETING_SDK_KEY}`
var meetingNumber = zoomData.id
var passWord = zoomData.password
var role = 0
var userName = ''
var userEmail = ''
var registrantToken = ''
var zakToken = ''
function getSignature() {
fetch(authEndpoint, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
meetingNumber: meetingNumber,
role: role
})
}).then(res => res.json())
.then(response => {
startMeeting(response.Data)
console.log(response,"aaaaaaaaaa")
}).catch(error => {
console.error(error,"AAAAAA")
})
}
function startMeeting(signature, zoomData) {
let meetingSDKElement = document.getElementById('meetingSDKElement');
client.init({
debug: true,
zoomAppRoot: meetingSDKElement,
language: 'en-US',
customize: {
meetingInfo: ['topic', 'host', 'mn', 'pwd', 'telPwd', 'invite', 'participant', 'dc', 'enctype'],
toolbar: {
buttons: [
{
text: 'Custom Button',
className: 'CustomButton',
onClick: () => {
console.log('custom button');
}
}
]
}
}
});
client.join({
signature: signature,
sdkKey: sdkKey,
meetingNumber: meetingNumber,
password: passWord,
userName: userName,
userEmail: userEmail,
tk: registrantToken,
zak: zakToken
})
console.log(client.init,"meetingSDKElement")
}
return (
<div>
<div style={modalBg}>
<div style={style}>
<div style={closeModal} onClick={onClose}>
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fillRule="evenodd" clipRule="evenodd" d="M11 1.75C5.89137 1.75 1.75 5.89137 1.75 11C1.75 16.1086 5.89137 20.25 11 20.25C16.1086 20.25 20.25 16.1086 20.25 11C20.25 5.89137 16.1086 1.75 11 1.75ZM0.25 11C0.25 5.06294 5.06294 0.25 11 0.25C16.9371 0.25 21.75 5.06294 21.75 11C21.75 16.9371 16.9371 21.75 11 21.75C5.06294 21.75 0.25 16.9371 0.25 11ZM7.46967 7.46967C7.76256 7.17678 8.23744 7.17678 8.53033 7.46967L11 9.93934L13.4697 7.46967C13.7626 7.17678 14.2374 7.17678 14.5303 7.46967C14.8232 7.76256 14.8232 8.23744 14.5303 8.53033L12.0607 11L14.5303 13.4697C14.8232 13.7626 14.8232 14.2374 14.5303 14.5303C14.2374 14.8232 13.7626 14.8232 13.4697 14.5303L11 12.0607L8.53033 14.5303C8.23744 14.8232 7.76256 14.8232 7.46967 14.5303C7.17678 14.2374 7.17678 13.7626 7.46967 13.4697L9.93934 11L7.46967 8.53033C7.17678 8.23744 7.17678 7.76256 7.46967 7.46967Z" fill="#f1c40f"/>
</svg>
</div>
<div id="meetingSDKElement">
{/* Zoom Meeting SDK Component View Rendered Here */}
</div>
<button style={joinMeet} onClick={getSignature}>Join Meeting</button>
</div>
</div>
</div>
);
}