Issue with openvidu REST API (Create a new Connection in the Session)

Hi Team
I am using openvidu-angular (2.20.0)
I am facing issues while creating a new connection in the Session using REST API.
I followed the syntax from https://docs.openvidu.io/en/stable/reference-docs/REST-API/#post-connection

createToken(sessionId): Promise<string> {
    return new Promise((resolve, reject) => {
      const body = JSON.stringify({type:"WEBRTC",data:"100021",role:"PUBLISHER"});
      const options = {
        headers: new HttpHeaders({
          Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + this.OPENVIDU_SERVER_SECRET),
          'Content-Type': 'application/json',
        }),
      };
      return this.httpClient
        .post(this.OPENVIDU_SERVER_URL + '/openvidu/api/sessions/' + sessionId + '/connection', body, options)
        .pipe(
          catchError((error) => {
            reject(error);
            return observableThrowError(error);
          }),
        )
        .subscribe((response) => {
          resolve(response['token']);
        });
    });
}

I want to send “custom user id” information to openvidu media server for all users joining session. so I tried to add “My Server Data” in body as shown in the document. But other users are not able to join my session(It shows unknown). Please check the below screenshot.

but everything is working fine when removing the “data” field in body.

Can somebody please help me with this issue?
Thanks for your attention. I’m looking forward to your reply.

having the same issue, cant add our custom data in meeting session

The application is using the client data to set the user name. You can provide user data in two different ways: on the server side when creating the Connection object, using “data” parameter, or in the client side when calling Session.connect (using “metadata” parameter).

Here is the complete information about how you can easily sharing information about users, explaining these two methods:
https://docs.openvidu.io/en/stable/cheatsheet/share-data/

openvidu-angular is using the client side data to set the username. You can see the code right here: openvidu-call/utils.service.ts at master · OpenVidu/openvidu-call · GitHub.

If that JSON.parse fails, then “Unknown” will be used.

openvidu-angular is using only the client side way, but it needs a JSON object like this for the method getNicknameFromConnectionData that I linked above to properly work. Something like this:

session.connect(token, { clientData: 'USER NAME', avatar: 'AVATAR' });

I have same issues. It makes me crazy.
If you have any solution, please share with me.

Thank you.