User consent dialog

By default, Cobrowse will show a user consent dialog when a new session is incoming. You may modify and customize the consent prompt using the SDK.

By default, Cobrowse will show a user consent dialog when a new session is incoming. You may modify and customize the consent prompt as you wish, using the SDK hooks described below.

Admin users may also disable this consent prompt from your account settings if you prefer to remove it entirely: https://cobrowse.io/dashboard/settings

CobrowseIO.confirmSession = function() {
    return new Promise(function(resolve, reject) {
        // show your UI here
        // call resolve(true) to accept the session
        resolve(true)
        // or reject() to reject the session
    })
}

-(void) cobrowseHandleSessionRequest:(CBIOSession*) session {
    // show your own UI here
    // call [session activate: <callback>] to accept and start the session
    // provide a callback to handle any errors during session initiation
    [session activate: nil];
    // or [session end: nil]; to reject the session
}

@Override
public void handleSessionRequest(final Activity currentActivity, final Session session) {
    // Do something here, e.g. showing a permission request dialog
    // Make sure to call activate(<callback>) on the session object if
    // you want to start the session.
    // Provide a callback if you wish to handle errors during session
    // initiation.
    session.activate(null);
    // or session.end(null) to reject the session
}

CobrowseIO.handleSessionRequest = function(session) {
    // Replace this with your own logic
    // Just be sure to call session.activate() to
    // accept the session, or session.end() to reject it
    session.activate()
}

CobrowseIO.instance.handleSessionRequest.listen((session) {
    // Replace this with your own logic
    // Just be sure to call session.activate() to
    // accept the session, or session.end() to reject it
    try {
        session.activate();
    } on PlatformException {
        // E.g. a network error
    }
});

.NET iOS implementation

public override void CobrowseHandleSessionRequest(Session session) {
    // show your own UI here
    // call Activate(<callback>) to accept and start the session
    // provide a callback to handle any errors during session initiation
    session.Activate(callback: null);
    // or session.End(null) to reject the session
}

.NET iOS implementation

public void HandleSessionRequest(Activity activity, Session session) {
    // Do something here, e.g. showing a permission request dialog
    // Make sure to call Activate(<callback>) on the session object if
    // you want to start the session.
    // Provide a callback if you wish to handle errors during session
    // initiation.
    session.Activate(callback: null);
    // or session.End(null) to reject the session
}

MAUI implementation

You can also achieve this functionality from a cross-platform project. In this case you don't have to implement your own delegate, but instead you subscribe to the SessionDidRequest event:

CobrowseIO.Instance.SessionDidRequest += OnCobrowseSessionDidRequest;
...
private async void OnCobrowseSessionDidRequest(object sender, ISession session) {
    // Do something here, e.g. showing a permission request dialog
    // Make sure to call Activate(<callback>) on the session object if
    // you want to start the session.
    // Provide a callback if you wish to handle errors during session
    // initiation.
    session.Activate(null);
    // or session.End(null) to reject the session
}

You can override the default session authorization dialog by adding a handler to the CobrowseIO.Instance.SessionAuthorizing event:

  CobrowseIO.Instance.SessionAuthorizing += OnSessionAuthorizing;

Warning: Callback will be called from non-UI thread, so be sure to dispatch it to the UI one.

To confirm session:

await CobrowseIO.Instance.CurrentSession.Activate();

To reject a session:

await CobrowseIO.Instance.CurrentSession.End();

Example UIs

We've created a set of sample UIs that you may drop directly into your app or website as a starting point to customize the consent prompt.

// A generic consent dialog class
function Consent() {
  var container = document.createElement('div');
  function content(title, description){
    return '\
      <div style="background: rgba(50, 50, 50, 0.4); position: fixed; z-index: 2147483647; bottom: 0; top: 0; left: 0; right: 0">\
        <div style="color: #333; font-family:sans-serif; line-height:140%; position:fixed; padding:25px; background:white; border-radius:15px; z-index:2147483647; top:50px; left:50%; width:75%; max-width:350px; transform:translateX(-50%); box-shadow:0px 0px 15px #33333322;">\
          <div style="text-align:center; margin-top:10px; margin-bottom:20px"><b>'+title+'</b></div>\
          <div>'+description+'</div>\
          <div style="float:right; margin-top:40px; color:rgb(0, 122, 255);">\
            <a class="cobrowse-deny" style="cursor:pointer; padding:10px;">Deny</a>\
            <a class="cobrowse-allow" style="cursor:pointer; padding:10px; font-weight: bold;">Allow</a>\
          </div>\
        </div>\
      </div>\
    ';
  }

  this.show = function(title, description) {
    return new Promise(function(resolve) {
      container.innerHTML = content(title, description);
      container.querySelector('.cobrowse-allow').addEventListener('click', function(){ resolve(true); this.hide() }.bind(this));
      container.querySelector('.cobrowse-deny').addEventListener('click', function(){ resolve(false); this.hide() }.bind(this));
      if (document.body) document.body.appendChild(container);
    }.bind(this));
  }.bind(this);

  this.hide = function() {
    if (container.parentNode) {
      container.parentNode.removeChild(container);
    }
  }.bind(this);
}

// Integration with Cobrowse
CobrowseIO.confirmSession = function() {
    return new Consent().show('Session Request', 'Do you want to share your screen?');
}

@implementation CBAppDelegate // should implement CobrowseIODelegate

- (BOOL)application:(UIApplication*) application didFinishLaunchingWithOptions:(NSDictionary*) launchOptions {
    CobrowseIO.instance.delegate = self;
    // ... the rest of your app setup
    return YES;
}

-(void) cobrowseHandleSessionRequest:(CBIOSession*) session {
    // show your own UI here
    // call [session activate: <callback>] to accept and start the session
    // provide a callback to handle any errors during session initiation
    [session activate: nil];
}

@end

public class MainApplication extends Application implements CobrowseIO.SessionRequestDelegate {

    @Override
    public void onCreate() {
        super.onCreate();
        CobrowseIO.instance().setDelegate(this);

        // and the rest of cobrowse setup ...
    }

    @Override
    public void handleSessionRequest(final Activity currentActivity, final Session session) {
        // Do something here, e.g. showing a permission request dialog
        // Make sure to call activate(<callback>) on the session object if
        // you want to start the session.
        // Provide a callback if you wish to handle errors during session
        // initiation.
        session.activate(null);
    }

    // ...
}

CobrowseIO.handleSessionRequest = function(session) {
    // Replace this with your own logic
    // Just be sure to call session.activate() to
    // accept the session.
    Alert.alert(
        'Session Requested',
        'A cobrowse session has been requested',
        [
            {
                text: 'Cancel',
                onPress: () => {},
                style: 'cancel',
            },
            {text: 'OK', onPress: () => session.activate()},
        ],
        {cancelable: true},
    );
}

CobrowseIO.instance.handleSessionRequest.listen((session) {
    showDialog(
        context: context,
        builder: (BuildContext context) {
            return AlertDialog(
                title: const Text('Screen Sharing Request'),
                content: const Text('A support agent would like to use this app with you. Do you accept?'),
                actions: <Widget>[
                    TextButton(
                        onPressed: () {
                            try {
                                session.activate();
                                Navigator.of(context).pop();
                            } on PlatformException {
                                // E.g. a network error
                            }
                        },
                        child: const Text('Accept'),
                    ),
                    TextButton(
                        onPressed: () {
                            try {
                                session.end();
                                Navigator.of(context).pop();
                            } on PlatformException {
                                // E.g. a network error
                            }
                        },
                        child: const Text('Cancel'),
                    ),
                ],
            );
        },
    );
});

iOS implementation

using Cobrowse.IO.iOS;

[Register("AppDelegate")]
public class AppDelegate : UIResponder, IUIApplicationDelegate
{
    [Export("application:didFinishLaunchingWithOptions:")]
    public bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)
    {
        // ... the rest of your app setup
        CobrowseIO.Instance.SetDelegate(new CustomCobrowseDelegate());
        return true;
    }
}

public class CustomCobrowseDelegate : CobrowseIODelegate
{
    public override void CobrowseHandleSessionRequest(Session session)
    {
        // show your own UI here
        // call Activate(<callback>) to accept and start the session
        // provide a callback to handle any errors during session initiation
        session.Activate(callback: null);
    }

    // ...
}

Android implementation

using Cobrowse.IO.iOS;

[Application]
public class MainApplication : Application
{
    public MainApplication()
    {
    }

    protected MainApplication(IntPtr javaReference, JniHandleOwnership transfer)
        : base(javaReference, transfer)
    {
    }

    public override void OnCreate()
    {
        base.OnCreate();
        CobrowseIO.Instance.SetDelegate(new CustomCobrowseDelegate());
        // and the rest of cobrowse setup ...
    }
}

public class CustomCobrowseDelegate : Java.Lang.Object, CobrowseIO.ISessionRequestDelegate
{
    public CustomCobrowseDelegate()
    {
    }

    public CustomCobrowseDelegate(IntPtr handle, JniHandleOwnership transfer)
        : base(handle, transfer)
    {
    }

    public void HandleSessionRequest(Activity activity, Session session)
    {
        // Do something here, e.g. showing a permission request dialog
        // Make sure to call Activate(<callback>) on the session object if
        // you want to start the session.
        // Provide a callback if you wish to handle errors during session
        // initiation.
        session.Activate(callback: null);
    }

    // ...
}

MAUI implementation

Subscribe to the SessionDidRequest event in a single place, for example in the MAUI application class:

using Cobrowse.IO;

namespace MauiSample;

public partial class App : Microsoft.Maui.Controls.Application
{
    public App()
    {
        InitializeComponent();

        CobrowseIO.Instance.License = "trial";
        CobrowseIO.Instance.Start();
        // and the rest of cobrowse setup ...
    }


    protected override void OnStart()
    {
        CobrowseIO.Instance.SessionDidRequest += OnCobrowseSessionDidRequestAsync;
    }

    private async void OnCobrowseSessionDidRequest(object sender, ISession session)
    {
        // Do something here, e.g. showing a permission request dialog
        // Make sure to call Activate(<callback>) on the session object if
        // you want to start the session.
        // Provide a callback if you wish to handle errors during session
        // initiation.
        bool allowed = await this.MainPage.DisplayAlert(
            title: "Cobrowse.io",
            message: "Allow Cobrowse.io session?",
            accept: "Allow",
            cancel: "Reject");
        if (allowed)
        {
            session.Activate(null);
        }
        else
        {
            session.End(null);
        }
    }
}

@implementation CBAppDelegate // should implement CobrowseIODelegate

- (void)applicationDidFinishLaunching:(NSNotification *)notification
    CobrowseIO.instance.delegate = self;
    // ... the rest of your app setup
}

-(void) cobrowseHandleSessionRequest:(CBIOSession*) session {
    // show your own UI here
    // call [session activate: <callback>] to accept and start the session
    // provide a callback to handle any errors during session initiation
    [session activate: nil];
}

@end

if (MessageBox.Show(
        window,
        "Would you like to authorize the Cobrowse.io screenshare session?",
        "Authorization",
        MessageBoxButton.YesNo,
        MessageBoxImage.Question
      ) == MessageBoxResult.Yes)
  await CobrowseIO.Instance.CurrentSession.Activate();
else
  await CobrowseIO.Instance.CurrentSession.End();

Previous6-digit code screen NextRemote control consent dialog

Last updated 1 year ago

hashtagExample UIs

Example UIs