Pages Menu
TwitterRssFacebook

Posted by on Jul 6, 2015 in Skype for Business® (Lync®) | 8 comments

How to: Skype Web SDK Development without having all the server pre-requisites in place

How to: Skype Web SDK Development without having all the server pre-requisites in place

As a result of the Learn Skype Web SDK series, I’ve received feedback a number of times from people who want to try out the new SDK, but can’t. The feedback normally goes something like:

“Hi. I’d really like to try out this new SDK, but I don’t have a lab environment where I can run Skype for Business, and my company won’t upgrade our production environment, and won’t add my localhost to their allowed domain list, so I don’t have an environment to use, and well… it’s just not FAIR!”

areRPmX_700b

Well, you’re in luck. What if I told you that Microsoft has built a sandbox environment, designed for developers, which you can access from your localhost and use with Skype Web SDK. Interested? Good, read on…

Using the Sandbox

The Sandbox is the same one that was built out for UCWA. You get three user accounts in the same environments, so you can make conversations between those three users.

To get started go to ucwa.skype.com and click Code from the menu at the top. Look for the Credentials section. You may need to log in if you don’t see any credentials listed. You’re looking for something like this:

SkypeWebSDKCredentials

Keep hold of this information for use in a moment. Notice as well that the tokens expire and need to be regularly renewed.

Using with the Learn Skype Web SDK Samples

You can use these credentials with the Learn Skype Web SDK samples in the series, with a small amount of modification. If you look at any of the code samples from the series you’ll notice the same HTML code to collect usernames and passwords:

 <div class="form-group">
      <label for="username" class="col-sm-2 control-label">Username</label>
      <div class="col-sm-10">
        <input type="email" class="form-control" id="username" placeholder="Email">
      </div>
    </div>
    <div class="form-group">
      <label for="password" class="col-sm-2 control-label">Password</label>
      <div class="col-sm-10">
        <input type="password" class="form-control" id="password" placeholder="Password">
      </div>
    </div>

Also, you’ll see the same JavaScript code to sign-in in every sample:

 $('#btnLogIn').click(function () {

        // start signing in
        client.signInManager.signIn({
          username: $('#username').val(),
          password: $('#password').val()
        }).then(function () {
            //log in worked!
            alert('Logged in!');
          }, function (error) {
            //Something went wrong.
            alert(error);
          });
      });

Firstly, let’s replace the HTML with something that collects the domain tokens instead of usernames and passwords:

 <div class="form-group">
    <label for="username" class="col-sm-2 control-label">Domain</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="domain" placeholder="metio.net">
    </div>
  </div>
  <div class="form-group">
    <label for="password" class="col-sm-2 control-label">Token</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="token" placeholder="Bearer cwt=ABCDE">
    </div>
  </div>

Then, we can modify the JavaScript. The Skype Web SDK SignIn method allows passing of domain tokens as well as normal usernames and passwords. It does this by using an options collection which you can use to provide the bearer token as as authorisation:

$('#btnLogIn').click(function () {
        // start signing in
       
      var domain = $("#domain").val();
      var access_token = $("#token").val();
	  var options = {
          auth: function (req, send) {
              req.headers['Authorization'] = access_token.trim();
              return send(req);
          },
          domain: domain
      };
      client.signInManager.signIn(options).then(function () {
            //log in worked!
            alert('Logged in!');
          }, function (error) {
            //Something went wrong.
            alert(error);
          });
      });

Save and refresh, and the sample should show this instead. (Here I’m using the code from Day 1):

SkypeWebSDKBearerEntry

The Domain when using the sandbox is metio.net.

The Token is the full string that you were give in the Credentials section, including  the section at the front which starts “Bearer cwt=”. So, a valid token would be:

Bearer cwt=AAEBHAEFAAAAA...YfFXYIYIdVX1isqD0ggNEPafGCkKskFVn6NvOvBYlbY

All being well, you should then be able to log in.

Use with localhost only

One thing I’ve found – if you look at normal server pre-requisites for using Skype Web SDK you’ll see that you have to explicitly list all domains that will connect to the server. The metio.net server has been set to accept localhost only – so you can’t run it from your custom domain. You can’t even use a custom port (e.g. localhost:8080) – it has to be port 80. It does look like you can use either http or https though, which is good.

You can see a version of the Day 1 code sample using these changes on GitHub.

Enjoy the sandbox!

8 Comments

  1. Hi guys,

    Thanks for sharing information so well on this blog. However I have some queries, first of all I am working on Ubuntu. I want to work and test the Skype for Web API since it wont require me to have a Lync or Skype for Business client.
    In my office there is license version of Skype for Business for windows platform. But we want to integrate skype with a internal web application. To test it out I found out that skype for web api is best alternative.

    Can you help me in acknowledging if I will be able to test it out on Ubuntu?

    Thanks,
    Avani

  2. I followed the above steps but I am getting a NoFQDN everytime. Any pointers as to what I am doing wrong?

  3. Pratik! JQuery’s val method does not read the placeholder property and therefore returns empty strings for domain and access_token.

    Replace
    var domain = $(“#domain”).val();
    with
    var domain = $(“#domain”).attr(‘placeholder’)

    Do the same for the access_token variable. This will get you going..

  4. Thanks. I just don’t have the time or the patience to debug my way through a new Sky for Business installation.

  5. Hi there,
    Could you help me out a bit, I seem to have a problem getting the OAuth Tokens. When I go to ucwa.skype.com and sign in, I am redirected to an error page and appear to be not signed in. But then if I again go to ucwa.skype.com/code, I am signed in but there are no tokens. Instead I get ‘Data unavialable, try later’.

  6. Hi..
    Looks like the ucwa.skype.com link has been down.(I have been trying since last week.)
    Is there any other way out??

    Thanks,
    Anu

  7. Hi..
    Looks like the ucwa.skype.com link has been down.(I have been trying since last week.)
    Is there any other way out??

    Thanks,
    Anu

  8. Hi..
    Looks like the ucwa.skype.com link has been down.(I have been trying since last week.)
    Is there any other way out??

    Thanks,
    Anu

Post a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

This site uses cookies to help make this website better. By continuing to use this site we’ll assume you’re OK with that (implied consent).