reactjsmernjitsijitsi-meetlib-jitsi-meet

Jitsi: Unable to change default user avatar


I have integrated Jetsi directly in my React app using the API (Without a self-hosted server).
I have been trying to find a way to change the default avatar when the user camera is off.

According to the documentation, I can override this parameter:

gravatar: {
    baseUrl: 'https://www.gravatar.com/avatar/',
    disabled: false
}

baseUrl 🚫 - Base URL for a Gravatar-compatible service. Defaults to Gravatar. disabled - True if Gravatar should be disabled.

I tried overriding it in both configOverwrite and interfaceConfigOverwrite:

   <Jutsu
          roomName={room_name}
          configOverwrite={{
            gravatar: {
              baseUrl:
                "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Cat_November_2010-1a.jpg/1200px-Cat_November_2010-1a.jpg",
              disabled: false,
            },
          }}
          interfaceConfigOverwrite={{
            gravatar: {
              baseUrl:
                "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Cat_November_2010-1a.jpg/1200px-Cat_November_2010-1a.jpg",
              disabled: false,
            },
          }}
        />

But, it had no effect.

I don't even understand what they mean by

Gravatar-compatible service

Can't I just use an image url?


Solution

  • According to a note at the beginning of the docs, the gravatar.baseUrl option can't be overwritten

    NOTE Options marked with 🚫 are not overwritable through configOverwrite

    You'll need to set it in the config.js file of your jitsi installation.

    And the baseUrl should be a service that works the same as gravatar: receiving a hashed email and returning an image; no other option is supported. You can check how the URL is built here https://github.com/jitsi/js-utils/blob/master/avatar/index.js#L10

    You could use an out of the box alternative as https://wiki.libravatar.org/ or build your own https://cloudinary.com/blog/how_to_build_an_enhanced_gravatar_service_part_1