Code Monkey home page Code Monkey logo

comms-sdk-web-getting-started's Introduction

Dolby.io Communications Web SDK -- Getting Started

This starter project demonstrates the mechanics of making a Voice and Video Call with Dolby.io.

Getting Started

Follow the Getting Started tutorial to learn how this application works.

Running

This project runs as a single-page application with any web server.

You can run a web server in a Node.js environment with live-server or http-server:

npx http-server

You can run a web server in a Python 3 environment with http.server:

python3 -m http.server

You can also explore static site hosting and traditional HTTP servers.

Troubleshooting

See the accompanying Web SDK Troubleshooting

Learn More

For more information, visit the Dolby.io Communications Web SDK documentation.

comms-sdk-web-getting-started's People

Contributors

artur-l avatar bsenard avatar dignacio0815 avatar dzfill avatar fabienlavocat avatar garymakindolby avatar j12y avatar jfan-dolby avatar lerami avatar ndubuisx avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

comms-sdk-web-getting-started's Issues

SessionError: A session has already been opened

if (!VoxeetSDK.session.isOpen()) { await VoxeetSDK.session.open({ name: 'testname', externalId: 1 }); }

Intermittently this code is producing an error:
"SessionError: A session has already been opened"

How can this be possible? We've taken care to check that a session is not open before we try to open one, but still it sometimes throws this error.

Screen Sharing Bug

This feature only works for items within the tabs. Nothing happens when I share another window or EDIT A DIFFERENT browser.

Sample code for initializeToken() is wrong?

On this page in this repo:

comms-sdk-web-getting-started/src/scripts/client.js

You have this code showing for initializing a token:

    // Initialize the Voxeet SDK
    // Please read the documentation at:
    // https://docs.dolby.io/communications-apis/docs/initializing-javascript
    // Generate a client access token from the Dolby.io dashboard and insert into access_token variable
    let access_token = "ClientAccessToken";
    VoxeetSDK.initializeToken(access_token, (isExpired) => {
      return new Promise((resolve, reject) => {
        if (isExpired) {
          reject('The access token has expired.');
        } else {
          resolve(access_token);
        }
      });
    });

However the docs you reference in that code shows this instead:

async function getAccessToken() {
    const url = serverURL + '/api/token';
    // Request an access token from your backend
    const response = await fetch(url);

    // extract the access token
    const json = await response.json();
    return json.access_token;
}

async function initializeSDK() {
    const accessToken = await getAccessToken();

    VoxeetSDK.initializeToken(accessToken, async () => {
        // This callback is called when the token needs to be refreshed.
        return await getAccessToken();
    });
}

The docs page concurs with my testing. The callback is only called when the token is expired, otherwise the callback function is not fired. Therefore:

  1. It any case it is a strange to be returning a promise in that sample code at all inside of the body of the callback function. It is neither awaited or does it have an attached then block. Is this an error?

  2. Either way, since the callback function is only called if the token is expired, the (isExpired) argument to the anonymous callback function is superfluous since it should always have a value of true. I did see the callback called when one of my access tokens expired and isExpired was indeed true. But as I said, I never saw that callback fire with a valid access token that had not expired et.

I will go by the code in the docs page instead.

Screen share cause infinite screen loops.

When you do a screen share the screen for host screen goes into an infinite screen loop, something like a 2-mirror effect. This screen is then visible to all participants due to screen share. Is there a way to avoid this as this is generally a bad User experience.

StopAudio() and conference.mute()

My app contains a functionality to mute other participants. Currently to do this, I am using conference.mute() along with ably events to allow participants to mute other remote participant. I want to use StopAudio() to achieve this, because it works for remote participant as well. But stopAudio() fails in the case when I have already switched off the video and then use stopAudio() to mute other remote participant. In this case, the participant is removed from the conference. How can I use stopAudio() to mute a remote participant?

User invalid

Context

  • App is using Enhanced Access Control
  • Backend: nodejs using dolby HTTP REST api
  • Frontend: Firefox/Chrome

Web SDK

is implemented like mentioned on https://docs.dolby.io/communications-apis/docs/getting-started-with-the-javascript-sdk

Error

when pressing the join button an error happens:

webrtc Failed to join conference ServerError: User is not valid

it seems to be related to this HTTP call

https://comms.sdk.dolby.io/v1/conferences/638485b8-c514-44a9-92fe-8d2828ed26b8/join

{
  "sync": true,
  "sdp_version": "SDP_V6",
  "user": {
    "type": "user"
  },
  "options": {
    "constraints": {
      "audio": {
        "autoGainControl": true,
        "googAutoGainControl": true,
        "noiseSuppression": true,
        "echoCancellation": true
      },
      "video": false
    },
    "mixing": {
      "enabled": false,
      "uri": "638485b8-c514-44a9-92fe-8d2828ed26b8"
    },
    "simulcast": false,
    "preferSendMono": true,
    "preferRecvMono": false,
    "forwardingStrategy": "lastSpeakerStrategy",
    "dvwc": false,
    "videoFilterOptions": {},
    "supportedAVSyncFakeAudio": true,
    "supportedSpatialAudioStyles": [
      "shared",
      "disabled",
      "individual"
    ],
    "supportedMultiScreenShare": "sendrecv"
  }
}

Which results in 403

{
  "type": "ErrorResponse",
  "error_code": 113,
  "error_reason": "invalid_cat_user",
  "error_description": "User is not valid"
}

Information
The button call triggers this

await VoxeetSDK.conference.join({
   id: conferenceId
}, {
  conferenceAccessToken: userToken
});

ConferenceId and userToken comes from calling /v2/conferences/create. userToken is e.g. "participantA"

{

  conferenceId: "638485b8-c514-44a9-92fe-8d2828ed26b8",

  ...

  usersTokens: {
    "participantA": "some long token"
  }
}

Unfortunately i have no access to the /v1/ API documentation, so i have no idea what could be the problem.
Thanks for the help

Warning: (node) warning: possible EventEmitter memory leak detected

We are currently testing the Dolby Video Call Communication API for a new application. In the process, we noticed that there are warnings when we keep opening and exiting the chat.

(node) warning: possible EventEmitter memory leak detected. 11 listeners added. Use emitter.setMaxListeners() to increase limit. voxeet-sdk_3.9.0.js:2:720464
console-export-2023-3-20_9-11-42.txt

Our code is based on the Get Started Sample: https://github.com/dolbyio-samples/comms-sdk-web-getting-started/blob/main/video-calls/final/index.html. We have taken the javascript code for the prototype unchanged.
The question now is whether this is really a bug because of memory leaks? Or if the sample still contains bugs and not all resources are released.

CustomerSecret question.

How do you protect 'customerSecret' if it is in the .js file that is served from the website?

unable to create/join conreference after the client token refreshed

after refreshing callback function of initializeToken called,
when user retry to create/join conreference,
the request seems using the initial token.
(as the request header shows me)

the https://session.voxeet.com/v1/conferences/create response is below
{type: "ErrorResponse", error_code: 89, error_reason: "Invalid_token",โ€ฆ} error_code: 89 error_description: "Expired or invalid token" error_reason: "Invalid_token" type: "ErrorResponse" with status 401

I also made sure that my refreshing callback is returning the access token string of new one.

further more, VoxeetSDK.initializeToken function does not returning promise result
so that I can't use .then or .catch phrase.

Smartphone crash

I tested succesfully web app on several desktop browser and omobile device, but i'm not able to run it on hauawei and honor smarthphone using Chrome. This is the stacktrace of the error:
webrtc VoxeetRTC.setRemoteDescription error: b38e3e05-f2cb-30e4-9358-2e211cfb6be7 DOMException: Failed to execute 'setRemoteDescription' on 'RTCPeerConnection': Failed to set remote offer sdp: Failed to set remote video description send parameters.
error @ logging.js:28
(anonymous) @ VoxeetRTCNative.js:286
s @ VoxeetRTCNative.js:5
Promise.then (async)
u @ VoxeetRTCNative.js:6
(anonymous) @ VoxeetRTCNative.js:7
Je @ VoxeetRTCNative.js:3
(anonymous) @ VoxeetRTCNative.js:281
(anonymous) @ VoxeetRTCNative.js:281
(anonymous) @ VoxeetRTCNative.js:7
Je @ VoxeetRTCNative.js:3
setRemoteDescription @ VoxeetRTCNative.js:278
(anonymous) @ VoxeetRTCBase.js:28
o @ VoxeetRTCBase.js:4
Promise.then (async)
u @ VoxeetRTCBase.js:6
o @ VoxeetRTCBase.js:4
Promise.then (async)
u @ VoxeetRTCBase.js:6
(anonymous) @ VoxeetRTCBase.js:7
Ce @ VoxeetRTCBase.js:3
addPeer @ VoxeetRTCBase.js:25
(anonymous) @ ConferenceManager.ts:140
Promise.then (async)
onInitialized @ ConferenceManager.ts:138
(anonymous) @ ConferenceManager.ts:52
Promise.then (async)
init @ ConferenceManager.ts:52
(anonymous) @ ConferenceService.ts:192
o @ ConferenceService.ts:10
Promise.then (async)
u @ ConferenceService.ts:12
(anonymous) @ ConferenceService.ts:13
Dt @ ConferenceService.ts:9
_join @ ConferenceService.ts:183
(anonymous) @ ConferenceService.ts:179
(anonymous) @ ConferenceService.ts:13
Dt @ ConferenceService.ts:9
join @ ConferenceService.ts:178
(anonymous) @ ui.js:17
Promise.then (async)
joinButton.onclick @ ui.js:17
logging.js:28 webrtc Failed to join conference RemoteDescriptionError: Failed to execute 'setRemoteDescription' on 'RTCPeerConnection': Failed to set remote offer sdp: Failed to set remote video description send parameters.
at https://unpkg.com/@voxeet/[email protected]/dist/voxeet-sdk.js:203:77752
at ut. (https://unpkg.com/@voxeet/[email protected]/dist/voxeet-sdk.js:203:77798)
at Generator.throw ()
at s (https://unpkg.com/@voxeet/[email protected]/dist/voxeet-sdk.js:203:71712)
error @ logging.js:28
(anonymous) @ ConferenceManager.ts:155
Promise.catch (async)
onInitialized @ ConferenceManager.ts:153
(anonymous) @ ConferenceManager.ts:52
Promise.then (async)
init @ ConferenceManager.ts:52
(anonymous) @ ConferenceService.ts:192
o @ ConferenceService.ts:10
Promise.then (async)
u @ ConferenceService.ts:12
(anonymous) @ ConferenceService.ts:13
Dt @ ConferenceService.ts:9
_join @ ConferenceService.ts:183
(anonymous) @ ConferenceService.ts:179
(anonymous) @ ConferenceService.ts:13
Dt @ ConferenceService.ts:9
join @ ConferenceService.ts:178
(anonymous) @ ui.js:17
Promise.then (async)
joinButton.onclick @ ui.js:17
ui.js:25 Something wrong happened : RemoteDescriptionError: Failed to execute 'setRemoteDescription' on 'RTCPeerConnection': Failed to set remote offer sdp: Failed to set remote video description send parameters.

Can you help me to solve it? Thanks

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.