I have been trying to use the Zoom Web SDK to implement an embedded meeting in a NextJS web app. The default mode works fine, but enabling the SharedArrayBuffer is not working as it should.
Using the below nextjs config for setting headers to enable SharedArrayBuffer in Chrome/FF, the meeting sometimes starts in gallery mode but sometimes does not. Also, when it does start in gallery mode, there still is no option to spotlight multiple users even though the docs and this forum post implies that it should be possible, as well as this one.
Next Config:
const nextConfig = {
...
async headers() {
return [
{
source: '/',
headers: [
{
key: 'Cross-Origin-Embedder-Policy',
value: 'require-corp',
},
{
key: 'Cross-Origin-Opener-Policy',
value: 'same-origin',
},
],
},
];
},
};
Zoom Embed Settings:
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');
},
},
],
},
video: {
popper: {
disableDraggable: true,
},
isResizable: false,
defaultViewType: ( "gallery" as SuspensionViewType),
viewSizes: {
default: {
width: ref.current?.offsetWidth ?? 0,
height: ref.current?.offsetWidth ? ref.current?.offsetWidth * 0.5625 : 0,
},
ribbon: {
width: 300,
height: 700,
},
},
},
},
})