Web Registration Wizard¶
WebRTC application supports showing the Web Registration Wizard as the initial screen of the app. The Wizard can be used to collect the initial parameters required for provisioning the application by showing a pre-configured web URL.
While the design and content of the page shown at the URL are completely up to you, WebRTC app needs a couple of things to be able to integrate with the web page shown.
You can make use of Client API parameters to differentiate the page shown at Web Registration Wizard
URL if you’re also using the same for mobile apps. For example, you can make use of the
parameter in your URL which would resolve to
Chrome (in case of WebRTC).
WebRTC app requires a script to be embedded into all the pages being shown in the initial screen.
The script can easily be embedded by including a
<script> tag to your page with it’s source URL
<your-webrtc-domain>/assets/web-registration.js and id
example — if your app is hosted on your-webrtc-app.com, the embed script can be included by adding:
<script src="https://your-webrtc-app.com/assets/web-registration.js" id="webrtc-webreg-intercept"></script>
When you’re testing the editable version of the app, you don’t need to add
parameters at the end of the url, so your link to the script will look like this:
<script src="https://your-webrtc-app.testing.cloudsoftphone.com/assets/web-registration.js" id="webrtc-webreg-intercept"></script>
The embed script adds a top level
WebRTCApp object to the page which you can access via your
|signin(uri)||function||A function that takes a
|cid||string||Cloud ID of the application|
csc: URI to WebRTC¶
With the above script embedded into the page, you have two different options for passing the required
username and password parameters to the WebRTC app. Both methods require that you construct
a URI following the
csc:username:password@CloudID format. Username and Password parameters in the
URI need to be properly URI-encoded so any special characters can properly be handled. You can read
detailed instructions on how to properly format and construct the
csc: URI in Initial Screens
While CloudID is part of the format, it isn’t used by WebRTC, since Cloud ID of white label apps is already hardcoded, and cannot be changed.
WebRTC doesn’t support using the
* character as part of the username or CloudID to
enable Testing configuration via the
csc: URI. For more information on how to enable Testing
Mode in WebRTC, please refer to the Testing Mode documentation.
The URI can be passed to the WebRTC application using one of the following ways:
Once you have a correctly formatted URI ready, you can create and show an
<a> tag on your page
href attribute set to the URI. The embedded script will automatically intercept any
links which have URIs defined with the
csc: scheme. For example, your page can show the a link
<a href="csc:john_smith:my_password@CODE">Start App</a>
As the user click’s the above link, WebRTC app will take over and if the supplied username and password are correct, the user will be provisioned and logged in to the application.
web-registration.js script into your page, you have access to a global
object. This object exposes a
signin(uri) method which takes a single string URI as a parameter.
// somewhere on your page const username = 'john_smith'; const password = 'my_password'; const uri = 'csc:' + username + ':' + password + '@' + WebRTCApp.cid; // you can also use window.WebRTCApp.signin(uri) WebRTCApp.signin(uri);
Calling this method with your formatted URI will trigger the provisioning process and the user will be signed into the application.
In case WebRTC application encouters an error while trying to provision the app and sign the user
in, it will display an error notification to the user and then reload the original configured Web
Registration Wizard URL in the
<iframe> with an error parameter appended as a query string. You
can then read the error parameter to determine what went wrong with the provisioning and
authentication process and guide the user accordingly.