Zoom Web Video SDK Virtual Background (COEP requirement) conflicts with third-party iframe

Video SDK Web
1

Description
We are integrating the Zoom Web Video SDK into a Flutter Web (Single Page Application). To support the WebAssembly and SharedArrayBuffer features such as the Virtual Background (and optimal video/audio processing), we have configured our server to return headers for Cross-Origin Isolation:

  • Cross-Origin-Opener-Policy: same-origin
  • Cross-Origin-Embedder-Policy: credentialless (or require-corp)

However, our application also needs to embed a third-party partner’s application inside an iframe. Since this third-party server cannot add HTTP response headers like Cross-Origin-Resource-Policy: cross-origin (CORP) to their resources, the browser blocks the iframe due to COEP violations.

If we change our headers to COEP: unsafe-none to allow the third-party iframe, Zoom’s virtual background module fails to load because SharedArrayBuffer becomes unavailable.

We would like to ask:

  1. Is there any way/workaround to utilize the Zoom Web Video SDK (including the Virtual Background feature) without requiring Cross-Origin Isolation (COEP: credentialless or require-corp)?
  2. Or is there a recommended architecture/workaround to embed a third-party cross-origin iframe without CORP headers while keeping Zoom’s SharedArrayBuffer features active in a Single Page Application context?

Which Web Video SDK version?
2.2.12

To Reproduce(If applicable)
Steps to reproduce the behavior:

  1. Deploy the host web application with the following HTTP response headers:
    • Cross-Origin-Opener-Policy: same-origin
    • Cross-Origin-Embedder-Policy: credentialless
  2. Initialize Zoom Web Video SDK and try to enable Virtual Background (it works as expected).
  3. Try to embed a cross-origin <iframe> pointing to a website that does not return the Cross-Origin-Resource-Policy: cross-origin header.
  4. See the net::ERR_BLOCKED_BY_RESPONSE error in the browser console, and the iframe content is blocked from loading.

Troubleshooting Routes

  1. Tested setting COEP: unsafe-none: The third-party iframe loaded successfully, but the Virtual Background feature in the Zoom SDK failed to initialize because SharedArrayBuffer was disabled.
  2. Attempting route-specific headers in SPA: Since it’s a Single Page Application, dynamic header changes per route require a full browser reload when transitioning between pages, causing flickering and state management issues.

Device (please complete the following information):

  • Device: [e.g. Windows PC / iPhone]
  • OS: [e.g. Windows 11 / iOS 17]
  • Browser: [e.g. Chrome / Safari]
  • Browser Version [e.g. 120.0.0.0]

Additional context

  • The web app is built using Flutter Web (compiled to JS).
  • Changing headers on the third-party partner’s server is completely out of our control.
2

Hey @Thong1

Thanks for your feedback.

  1. Is there any way/workaround to utilize the Zoom Web Video SDK (including the Virtual Background feature) without requiring Cross-Origin Isolation (COEP: credentialless or require-corp)?

Since Video SDK version 2.4.0 , Virtual Background no longer requires SharedArrayBuffer. We recommend upgrading to the latest version to resolve this issue. Also, when SharedArrayBuffer is not available, we will use the WebRTC video solution by default, which provides a better user experience as well.

Thanks
Vic

3

Hi @vic.yang,

Thanks for pointing that out!

Just to clarify, was that change introduced in version 2.3.14?

4

Hi @Thong1

Just to clarify, was that change introduced in version 2.3.14?

Yes. It also works in version 2.3.14.

Thanks
Vic