# Video SDK: cannot render a self video in Chrome

**URL:** <https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009>\
**Category:** Web\
**Created:** [December 29, 2021, 7:06pm UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009 "2021-12-29T19:06:00Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![pavloshchur](https://avatars.discourse-cdn.com/v4/letter/p/f08c70/32.png) [@pavloshchur](https://devforum.zoom.us/u/pavloshchur)\
**Post date:** [December 29, 2021, 7:06pm UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/1 "2021-12-29T19:06:00Z")

</div>

I cannot render a self video in Chrome (96.0.4664.110) but I can do this in Firefox (95.0.2) but in the same time I can render other participant’s video in Chrome and video started in Chrome can be seen by other participants.

I use the code provided while registering for the Video SDK developer account.

Code for rendering a self video:

```auto
console.log('crossOriginIsolated:', crossOriginIsolated); //false

await mediaStream.startVideo();
await mediaStream.renderVideo(VIDEO_CANVAS, localUserId, 320, 320, 0, 0, 2);

```

Code for rendering other participant’s video:

```auto
await mediaStream.renderVideo(VIDEO_CANVAS, userId, 320, 320, 320, 0, 2);

```

It seems to me that it could not be related to **cross-origin isolation** :

 ![image](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/e/0/e0950de6b194a88be1aee324a9dd9b2109a71c37.png)

I do not see any errors or warnings in the browser console.

---

<div class="post-metadata">

**Author:** ![vic.yang](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vic.yang/32/24656_2.png) [@vic.yang](https://devforum.zoom.us/u/vic.yang)\
**Post date:** [January 4, 2022, 1:32am UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/2 "2022-01-04T01:32:07Z")

</div>

Hey @pavloshchur

Thanks for your feedback.

It seems that the value of Cross-Origin-Opener-Policy(COOP) is not correct. [Cross-Origin-Opener-Policy - HTTP | MDN](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cross-Origin-Opener-Policy)

Thanks  
Vic

---

<div class="post-metadata">

**Author:** ![pavloshchur](https://avatars.discourse-cdn.com/v4/letter/p/f08c70/32.png) [@pavloshchur](https://devforum.zoom.us/u/pavloshchur)\
**Post date:** [January 4, 2022, 1:30pm UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/3 "2022-01-04T13:30:31Z")

</div>

Hi @vic.yang,

Thanks for the quick reply.

We have changed COOP from `https://ocedev3--pshchur--c.visualforce.com` to `same-origin` but it did not help. We still cannot render self video. The only difference is that now we see the error.

 ![image](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/4/f/4fb1169f449da5adf1bd2e7308b8ecc8a84acfeb.png)  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/5/9/597ddefef811538889042eb2227bcb4d88c0896e.png)

It seems to me that it is not related to the `video` element because when I run `purejs-demo` app by `npm run corp` I do not see the error and can process a self video.

We host [Zoom Video SDK 1.1.7.zip](https://drive.google.com/file/d/1ybY_S2QAwluf16AfJ7UwWQoEU-JIF_dB/view?usp=sharing) on Heroku and invoke it by the following URL: `path/index.esm.js`. Headers you can see on the screenshot above.  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/a/0/a08ed8e788bbde57771b3c229351053bd95f59cc.png)

Are we doing something wrong with headers?

---

<div class="post-metadata">

**Author:** ![vic.yang](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vic.yang/32/24656_2.png) [@vic.yang](https://devforum.zoom.us/u/vic.yang)\
**Post date:** [January 5, 2022, 1:11am UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/4 "2022-01-05T01:11:25Z")

</div>

Hey @pavloshchur

It seems something mistake in your configuration, the COEP and COOP headers are applied to the document response(HTML), not the javascript or css response. Instead, [Cross-Origin-Resource-Policy(CORP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cross-Origin-Resource-Policy) should be added to the static resources response header.

Thanks  
Vic

---

<div class="post-metadata">

**Author:** ![pavloshchur](https://avatars.discourse-cdn.com/v4/letter/p/f08c70/32.png) [@pavloshchur](https://devforum.zoom.us/u/pavloshchur)\
**Post date:** [January 5, 2022, 2:55pm UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/5 "2022-01-05T14:55:43Z")

</div>

Hi @vic.yang,

It is impossible in our case to add the **COEP** and **COOP** headers to the document response (HTML).  
Could you add a Boolean flag that will allow us to choose to work with **SharedArrayBuffer** or not? The same way as it works in Firefox now.

---

<div class="post-metadata">

**Author:** ![vic.yang](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vic.yang/32/24656_2.png) [@vic.yang](https://devforum.zoom.us/u/vic.yang)\
**Post date:** [January 6, 2022, 1:19am UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/6 "2022-01-06T01:19:22Z")

</div>

Hi @pavloshchur

Yes. We have an API to detect whether to enable the multiple video mode(gallery view), it’s `stream.isSupportMultipleVideos`. Also if you are familiar with React, our [sample-app-project](https://github.com/zoom/sample-app-videosdk/tree/master/react-demo) is a good reference.

Thanks  
Vic

---

<div class="post-metadata">

**Author:** ![pavloshchur](https://avatars.discourse-cdn.com/v4/letter/p/f08c70/32.png) [@pavloshchur](https://devforum.zoom.us/u/pavloshchur)\
**Post date:** [January 6, 2022, 10:56am UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/7 "2022-01-06T10:56:04Z")

</div>

Hi @vic.yang,

Thanks for the quick reply.

Yes, you are right. The following code snippet works for me:

```auto
let videoElement;

if (!stream.isSupportMultipleVideos()) {
    videoElement = document.getElementById('video-sharing');
    videoElement.classList.add("video-canvas");
    videoElement.id = "video-test-" + localUserId;
}

try {

  if (!stream.isSupportMultipleVideos()) {
      await stream.startVideo({ videoElement });
  } else {
      await stream.startVideo();
  }
  
  } catch (e) {
      console.error('Error turning on video:', e);
  }

```

To sum up, if it is not possible to add COOP and COEP headers than use `video` and pass it to `startVideo({ videoElement })` function. Pay attention to **videoElement** attribute name.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/6/1/614bdd549b610bbaa46ff934617683a02bdaa03c.png) [@system](https://devforum.zoom.us/u/system)\
**Post date:** [February 5, 2022, 8:56pm UTC](https://devforum.zoom.us/t/video-sdk-cannot-render-a-self-video-in-chrome/62009/8 "2022-02-05T20:56:11Z")

</div>

Closed on February 5, 2022, 8:56pm UTC

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