Whereby developer guide
In order to integrate with Whereby, there are a couple of things which needs to be set up. A Whereby account with a subdomain API key - This key allows you to create meetings on the Whereby service. Get in touch if you’re missing this. If you are planning to embed in another web service, we will have to whitelist the hostname of your service. While in development however, you can use a Chrome extension to bypass this requirement locally on a development machine:Chrome extension
Verifying your API key works
Once you have retrieved an API key from Whereby, you can verify it is correct by issuing the following command in your terminal
curl -H "Authorization: Bearer YOUR_API_KEY" https://api.whereby.dev/v1/meetings/1
A 200 or 404 response status indicates your key is working. A 401 response means the provided key is incorrect.
Verify your domain is whitelisted
curl --head 'https://YOUR_SUBDOMAIN.whereby.com?iframeSource=YOUR_SUBDOMAIN'
If whitelisted, the response of this command should list out your service url in the Content-Security-Policy section.
Meetings are created by sending sending an HTTP request to our servers. Reference our http api docs to learn how to format your requests. If successful, the response will contain the url of the newly created meeting, which can be shared through email, SMS etc, or embedded into a website as described below.
Meeting urls created using our API can be embedded in two ways; in a native app, or in an existing website. Either approach allows for customization of the embedded experience by adding query parameters to the room url.
- ?embed - Apply default UI adjustments for embed scenarios
- ?displayName - Set displayname of participant
- ?audio=off - Enter meeting with audio off
- ?video=off - Enter meeting with video off
- ?chat=<on> - Enable chat in embedded meeting
- ?screenshare=<on> - Enable screenshare in embedded meeting
Embedding in native apps
Embedding in an Android app requires use of the WebView class.
Although Safari has a UIWebView component which lets developers embed websites into an iOS app, this sadly does not work when embedding pages leveraging the WebRTC technology Whereby is built on. This leaves two options for native iOS apps:
- Redirect to mobile Safari
- Use SFSafariViewControlleri
Embedding in a website
Whereby meetings are embedded into other web services by use of an iframe. The source of the iframe needs to be a Whereby meeting url, which is obtained from our API. In addition to the url parameters described above, the following query parameters will have to be added:
Required url parameters
?iframeSource=YOUR_WHEREBY_SUBDOMAIN- Instruct Whereby servers to pass required CSP headers to the browser
On the iframe itself, there are a couple of attributes which needs to be set in order to allow Whereby to get access to cam / mic.
Required iframe attributes
allow="camera, microphone, fullscreen, speaker"
The following example shows how to embed a Whereby meeting for subdomain
example in a website
<iframe src="https://YOUR_SUBDOMAIN.whereby.com/API_GENERATED_MEETING_ID?embed&iframeSource=YOUR_SUBDOMAIN" allow="camera, microphone, fullscreen, speaker" />