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.