cancel
Showing results for 
Search instead for 
Did you mean: 

How to let users use their own virtual background image?

help888
Explorer
Explorer

Hello,

 

We are using Zoom Web SDK, now user can set virtual background from limited selections(images) preloaded with SDK. It seems there is no way to allow user to upload or use their own virtual background image

1 ACCEPTED SOLUTION

schapdelaine
Explorer
Explorer

Hello @help888 
@Humashankar you are half right and half wrong. You cannot upload virtual background, but you can provide your own images to be used as virtual background.

I have a solution for this. I am not sure why the forum deleted my previous answer. Probably because I included javascript code in it.
Basically, you can provide your own virtual background by using the method 

updateVirtualBackgroundList on ZoomMtg class. You pass it an object with three properties:
error, optional, that is a function
success, optional, that is function
vbList, an array with objects inside having the following required properties:
displayName, string, you can put anything inside
fileName: string, this doesnt seem to have a use, but maybe use the same name as your filename in the url
id: string, you can put any value, but must be unique
url: string, a url to a picture you want to use
 
I call that method in the success callback of the join method. And this works for me!

View solution in original post

5 REPLIES 5

Humashankar
Community Champion | Customer
Community Champion | Customer

Hi @help888 

The Zoom Web SDK does not currently have a built-in feature to allow users to upload and use their own virtual background images directly. you can try to implement a custom solution.

 

Also if you wish you can also make use of this form 

Sending feedback to Zoom

 

Hope this helps - Happy to help further!!
Thank you very much and have a great one!
Warm regards

Huma

Check my reply.

schapdelaine
Explorer
Explorer

You can actually override the virtual background in the client meeting sdk.
Note that virtual backgrounds work when ArrayBuffer is accessible in the page. For this I have my zoom client implementation in a standalone page with no third party loaded.

So basically, just put this in the window.ZoomMtg.join success callback

const vbListing = [{
displayName: 'My Space Background',
fileName: 'facts-about-space-hero.jpg',
id: 'ANYTHING',
}];
window.ZoomMtg.updateVirtualBackgroundList({
  error: function(error) { console.log('updateVirtualBackgroundList error', error) },
  success: function() { console.log('updateVirtualBackgroundList success') },
  vbList: vbListing
})

 

schapdelaine
Explorer
Explorer

Hello @help888 
@Humashankar you are half right and half wrong. You cannot upload virtual background, but you can provide your own images to be used as virtual background.

I have a solution for this. I am not sure why the forum deleted my previous answer. Probably because I included javascript code in it.
Basically, you can provide your own virtual background by using the method 

updateVirtualBackgroundList on ZoomMtg class. You pass it an object with three properties:
error, optional, that is a function
success, optional, that is function
vbList, an array with objects inside having the following required properties:
displayName, string, you can put anything inside
fileName: string, this doesnt seem to have a use, but maybe use the same name as your filename in the url
id: string, you can put any value, but must be unique
url: string, a url to a picture you want to use
 
I call that method in the success callback of the join method. And this works for me!

help888
Explorer
Explorer

Thank you very much!