close search

Getting started with Stringee Widget to make a video call from Mobile App to StringeeX Contact Center

Stringee Widget is the easiest way to quickly add video call to your mobile app. Stringee Widget provides a basic and non-customizable UI to make a video call from the mobile app. To customize your UI and utilize advanced Stringee API features, you need to follow the tutorial here:

This tutorial walks you through the steps of using Stringee Widget.

Step 1: Create a Stringee account

Before you use Stringee Widget to make or receive a video call, you must sign up for a Stringee account. There're 2 ways to do it:

Option 1:
  1. Sign up a Stringee account on:

  2. Go to the Dashboard and Create a project

  3. Create a portal

  4. Generate an access token: Tools -> Generate Access Token

Option 2:
  1. Sign up a StringeeX account on:

  2. Create a portal

  3. Generate an access token: Sign in with the StringeeX account then go to Tools -> Generate Access Token

Step 2: Add SDK to Project

  1. Edit your project's Podfile

The simplest way to import the SDK into an iOS project is with CocoaPods. Open your project's Podfile and add this line to your app's target:

pod 'StringeeWidget'

Then from the command line run:

pod install --repo-update

If you're new to CocoaPods, see their official documentation for info on how to create and use Podfiles.

  1. In the "Build Settings" tab -> "Other linker flags" add "$(inherited)" flag

  2. In the "Build Settings" tab -> "Enable bitcode" select "NO"

Step 3: Edit Info.plist

  1. Right-click the information property list file (Info.plist) and select Open As -> Source Code
  2. Insert the following XML snippet into the body of your file just before the final element:
<string>$(PRODUCT_NAME) uses Camera</string>
<string>$(PRODUCT_NAME) uses Microphone</string>

Step 4: Connect to Stringee Server

In order to connect to Stringee Server, you will need access to the authentication credential: access token. In production application, the access token should be generated by your server described here: Client authentication. But to speed things up, we will just use the access token generated in Step 1 for now:

  1. Add a line to import the StringeeWidget, Stringee frameworks:
import StringeeWidget
import Stringee
  1. Implements the StringeeWidgetDelegate protocol
extension ViewController: StringeeWidgetDelegate {
    func onConnectionConnected(userId: String, isReconnecting: Bool) {

    func onConnectionDisconnected(isReconnecting: Bool) {

    func onConnectionError(code: Int, message: String) {
        print("onConnectionError: \(message)")

    func onRequestNewToken() {
        // let newToken = "YOUR_NEW_ACCESS_TOKEN"
        // stringeeWidget.connect(token: newToken)

    func onDisplayCallingViewController(vc: UIViewController) {
        // vc.modalPresentationStyle = .fullScreen
        // present(vc, animated: true, completion: nil)

    func onSignalingState(state: SignalingState) {
        print("onSignalingState: \(state.rawValue)")
        // if state == .ended || state == .busy {
        //    DispatchQueue.main.async {
        //        self.dismiss(animated: true, completion: nil)
        //    }
        // }
  1. Start connecting
let stringeeWidget = StringeeWidget.instance
let accessToken = "YOUR_ACCESS_TOKEN"

override func viewDidLoad() {
    stringeeWidget.delegate = self
    stringeeWidget.connect(token: accessToken)

Step 5: Make a call

Now you can make a call from your mobile

  1. Initialize a call config:

    var callConfig = StringeeCallConfig()
    callConfig.from = stringeeWidget.stringeeClient.userId = "testcall"
    callConfig.isVideoCall = true
    • from: is the user id which is used to generate access token in Step 1 or the hotline number.
    • to: is the user id of the callee or the hotline number, such as "testcall".
    • isVideoCall: true - a video call, false - a voice call;
  2. Make call

    stringeeWidget.makeCall(config: callConfig) { status, code, message, customData in
  3. Monitor the call state: When the client makes a video call successfully, the call will walk through many states such as calling, ringing, answered, ended, busy… Each time the call’s state changes, the onSignalingState() method is invoked.

Step 6: Running the app

Now that your code is complete, you can run the app with your device. You can view a completed version of this sample app on GitHub: StringeeWidgetSample