PureJs Zoom 会议 SDK：加入主持人后在 iOS safari 浏览器中不可见

Question

我正在创建一个网站，在 PureJS 中实现 Zoom 会议 sdk。在 chrome、Mozilla 上一切正常，但在 Safari 上加入会议时，主持人视频对主持人不可见，并且在检查检查元素时，显示视频元素的顶部和左侧为 -10000。我只为 2 个人创建此内容，其中一名主持人和其他参与者。我还创建了捆绑包来使用整个 sdk。

我们已经从 https://github.com/zoom/videosdk-web-sample 下载了参考资料，并且在 /src/js/meeting/session/video/ 中有一个文件 video-toggler.js 其中有以下内容计算参与者和自身视频的代码。无法定位问题。

    import state from "../simple-state";
    import { VideoQuality } from '@zoom/videosdk';
    import { VIDEO_CANVAS, VIDEO_CANVAS_DIMS, SELF_VIDEO_ELEMENT, SELF_VIDEO_CANVAS } from './video-render-props';


    let prevIsSelfVideoOn = false;
    let prevIsParticipantVideoOn = false;

    export const toggleSelfVideo = async (mediaStream, isVideoOn) => {
    const isUsingVideoElementToStartVideo =
        typeof window.OffscreenCanvas === 'function' && !mediaStream.isSupportMultipleVideos();
    const isRenderingSingleVideoOnCanvas =
        typeof window.OffscreenCanvas !== 'function' && !mediaStream.isSupportMultipleVideos();
    if (typeof isVideoOn !== 'boolean' || prevIsSelfVideoOn === isVideoOn) {
        return;
    }
    const canvas = isRenderingSingleVideoOnCanvas ? SELF_VIDEO_CANVAS : VIDEO_CANVAS;
    if (isVideoOn) {
        if (isUsingVideoElementToStartVideo) {
        SELF_VIDEO_ELEMENT.style.display = 'block';
        SELF_VIDEO_ELEMENT.style.width = '50%';
        SELF_VIDEO_ELEMENT.style.left = '50%';
        await mediaStream.startVideo({ videoElement: SELF_VIDEO_ELEMENT });
        } else {
        await mediaStream.startVideo();
        if (isRenderingSingleVideoOnCanvas) {
            SELF_VIDEO_CANVAS.style.display = 'block';
            SELF_VIDEO_CANVAS.style.width = '50%';
            SELF_VIDEO_CANVAS.style.height = '50%';
            SELF_VIDEO_CANVAS.style.left = '50%';
            SELF_VIDEO_CANVAS.style.top = '50%';
            SELF_VIDEO_CANVAS.style.transform = 'translateY(-50%)';
            await mediaStream.renderVideo(
            canvas,
            state.selfId,
            VIDEO_CANVAS_DIMS.Width / 2,
            VIDEO_CANVAS_DIMS.Height / 2,
            0,
            0,
            VideoQuality.Video_360P
            );
        } else {
            await mediaStream.renderVideo(
            canvas,
            state.selfId,
            VIDEO_CANVAS_DIMS.Width / 2,
            VIDEO_CANVAS_DIMS.Height,
            VIDEO_CANVAS_DIMS.Width / 2,
            0,
            VideoQuality.Video_360P
            );
        }
        }
    } else {
        await mediaStream.stopVideo();
        if (!isUsingVideoElementToStartVideo) {
        if (isRenderingSingleVideoOnCanvas) {
            SELF_VIDEO_CANVAS.style.display = 'none';
        }
        await mediaStream.stopRenderVideo(canvas, state.selfId);
        } else {
        SELF_VIDEO_ELEMENT.style.display = 'none';
        }
    }
    prevIsSelfVideoOn = isVideoOn;
    };

    export const toggleParticipantVideo = async (mediaStream, userId, isVideoOn) => {
    if (typeof isVideoOn !== 'boolean' || prevIsParticipantVideoOn === isVideoOn) {
        return;
    }

    if (isVideoOn) {
        await mediaStream.renderVideo(
        VIDEO_CANVAS,
        userId,
        VIDEO_CANVAS_DIMS.Width / 2,
        VIDEO_CANVAS_DIMS.Height,
        0,
        0,
        VideoQuality.Video_360P
        );
    } else {
        await mediaStream.stopRenderVideo(VIDEO_CANVAS, userId);
    }
    prevIsParticipantVideoOn = isVideoOn;
    };

Answer 1

Zoom 开发者倡导者在这里。纯JS Video SDK示例已经过时了。此后，我们已将此示例替换为现有的最新 React 示例。

您可以在 Safari 上观看在此 React 示例或 UI 工具包中工作的用户视频。

我们还在 Zoom Video SDK 文档中提供了启动和渲染视频的示例。

对于 Zoom 开发者平台的具体问题，请随时在 Zoom 开发论坛 上提问。