examples/sso.html

   1 <html>
   2 <head>
   3 <title>SSO example</title>
   4 </head>
   5 <body>
   6 <style type="text/css">
   7   .topleftcorner {
   8     position:relative;
   9     width: 33%;
  10   }
  11   .toprightcorner {
  12     position:absolute;
  13     top:0;
  14     right:0;
  15     width: 33%;
  16   }
  17   .topcenter {
  18     position: absolute;
  19     width: 100%;
  20     left: 100%;
  21     top: 0%;
  22     height:100%
  23   }
  24 </style>
  25
  26 <div id='serviceContainer' class="topleftcorner">
  27 <table id="service" border="5">
  28   <tr>
  29     <th colspan="2">
  30       <H3><BR>Service</H3>
  31     </th>
  32   </tr>
  33     <th>API</th>
  34     <th>Arg1</th>
  35   <tr><td><button onclick='queryMethods()'>Query Methods</button></td></tr>
  36   <tr><td><button onclick='queryMechanisms()'>Query Mechanisms</button></td>
  37     <td><form>Method: <input type="text" name="serv_method" id="serv_method"><br></form></td>
  38   </tr>
  39   <tr><td><button onclick='queryIdentities()'>Query Identities</button></td>
  40   <td><form>Filter(Input is json and keys can only be 'Type', 'Owner' or 'Caption'
  41       e.g. {"Type":"WEB"} or {"Type":"APPLICATION"} or {"Type":"NETWORK"} or
  42       {"Owner":{"sysContext":"*","appContext":"*"}} or {"Caption":"cap"}
  43       <input type="text" name="serv_filter" id="serv_filter"><br></form></td>
  44   </tr>
  45   <tr><td><button onclick='getIdentity()'>Get Identity</button></td>
  46     <td><form>Id: <input type="text" name="serv_identityid" id="serv_identityid"><br></form></td>
  47   </tr>
  48   <tr><td><button onclick='clearDB()'>Clear DB</button></td></tr>
  49 </table>
  50
  51 <table id="creat_identity" border="5">
  52   <tr>
  53     <th colspan="1">
  54       <H3><button onclick='onCreateIdentity()'><BR>Create Identity</button>
  55         <button onclick='onUpdateIdentity()'><BR>Update Identity</button></H3>
  56     </th>
  57   </tr>
  58   <tr><td><form>Select Type: <select name="cident_type" id="cident_type">
  59     <option value = "APP" >Application</option>
  60     <option value = "WEB" selected >Web</option>
  61     <option value = "NET" >Network</option>
  62     </select></form></td></tr>
  63   <tr><td><form>Username:
  64     <input type="text" name="cident_username" id="cident_username"><br></form></td></tr>
  65   <tr><td><form>Password:
  66     <input type="text" name="cident_secret" id="cident_secret"><br></form></td></tr>
  67   <tr><td><form>StoreSecret:
  68     <input type="checkbox" name="cident_storesecret" id="cident_storesecret"><br></form></td></tr>
  69   <tr><td><form>Caption:
  70     <input type="text" name="cident_caption" id="cident_caption"><br></form></td></tr>
  71   <tr><td><form>Realms(realm1,realm2,..):
  72     <input type="text" name="cident_realms" id="cident_realms"><br></form></td></tr>
  73   <tr><td><form>Owner(appcontext,syscontext):
  74     <input type="text" name="cident_owner" id="cident_owner"><br></form></td></tr>
  75   <tr><td><form>ACL(json:  [{"secContext":{"sysContext":"*","appContext":"*"},
  76     "method":"password","mechanisms":["password"]}]):
  77     <input type="text" name="cident_acl" id="cident_acl"><br></form></td></tr>
  78 </table>
  79 <div id='resultContainer' class="topcenter">>
  80 <form name='form_out'>
  81   <textarea name="form_text" id="form_text" style="width:100%; height:100%"></textarea>
  82 </form>
  83 </div>
  84
  85 </div>
  86
  87 <div id='identityContainer' class="toprightcorner">
  88 <table width="115%" id="identity" border="5">
  89   <tr>
  90     <th colspan="2">
  91       <H3><BR>Identity</H3>
  92       <form>Selected Identity JSId:
  93         <select name="ident_options" id="ident_options" onchange="onIdentityChanged(this)">
  94         </select></form>
  95     </th>
  96   </tr>
  97     <th>API</th>
  98     <th>Arg1</th>
  99   <tr><td><button onclick='startSession()'>Start Session</button></td>
 100     <td><form>Method: <input type="text" name="ident_method" id="ident_method"><br></form></td>
 101   </tr>
 102   <tr><td><button onclick='requestCredentialsUpdate()'>Update Credentials</button></td>
 103     <td><form>Message: <input type="text" name="ident_message" id="ident_message"><br></form></td>
 104   </tr>
 105   <tr><td><button onclick='store(null)'>Store</button></td>
 106   </tr>
 107   <tr><td><button onclick='addReference()'>Add Reference</button></td>
 108     <td><form>Reference: <input type="text" name="ident_addref" id="ident_addref"><br></form></td>
 109   </tr>
 110   <tr><td><button onclick='removeReference()'>Remove Reference</button></td>
 111     <td><form>Reference: <input type="text" name="ident_remref" id="ident_remref"><br></form></td>
 112   </tr>
 113   <tr><td><button onclick='removeIdentity()'>Remove</button></td>
 114   </tr>
 115   <tr><td><button onclick='signout()'>Signout</button></td>
 116   </tr>
 117 </table>
 118
 119 <table id="session" border="5">
 120   <tr>
 121     <th colspan="3">
 122       <H3><BR>Session</H3>
 123       <form>Selected Session JSId: <select name="sess_options" id="sess_options"></select></form>
 124     </th>
 125   </tr>
 126     <th>API</th>
 127     <th>Arg1</th>
 128     <th>Arg2</th>
 129   <tr><td><button onclick='queryAvailableMechanisms()'>QueryAvailableMechanisms</button></td>
 130     <td><form>WantedMechanisms(mech1,mech2,..):
 131       <input type="text" name="sess_mechs" id="sess_mechs"><br></form></td>
 132   </tr>
 133   <tr><td><button onclick='challenge()'>Challenge</button></td>
 134     <td><form>Mechanism: <input type="text" name="sess_mech" id="sess_mech"><br></form></td>
 135     <td><form>SessionData (json: {"key1":"value1","key2":"value2",...}):
 136       <input type="text" name="sess_data" id="sess_data"><br></form></td>
 137   </tr>
 138   <tr><td><button onclick='cancel()'>Cancel</button></td>
 139   </tr>
 140 </table>
 141 </div>
 142
 143 <script>
 144
 145 function _logData(data) {
 146   var old = document.form_out.form_text.value
 147   document.form_out.form_text.value = data + '\n\n' + old;
 148 }
 149
 150 function queryMethods() {
 151   tizen.sso.authService.queryMethods().then(function(result) {
 152     _logData('QueryMethods successful: ' + JSON.stringify(result));},
 153     function (err) { document.form_out.form_text.value += "\n" + "QueryMethods failed: " + err;});
 154 }
 155
 156 function queryMechanisms() {
 157   var method = document.getElementById('serv_method').value;
 158   var res = tizen.sso.authService.queryMechanisms(method);
 159   if (res != null) {
 160     res.then(function (result) {
 161       _logData('QueryMechanisms successful: ' + JSON.stringify(result));},
 162           function(err) {_logData('QueryMechanisms failed: ' + err);});
 163   } else {
 164     _logData('mechanisms not found');
 165   }
 166 }
 167
 168 function queryIdentities() {
 169   var str = document.getElementById('serv_filter').value;
 170   var filters = {};
 171   if (typeof str === 'string' && str.length > 0) {
 172     filters = JSON.parse(str);
 173   }
 174   var res = tizen.sso.authService.queryIdentities(filters);
 175   if (res != null) {
 176     res.then(onQueryIdentitiesComplete, function(err) {
 177       _logData('QueryIdentities failed: ' + err);});
 178   } else {
 179     _logData('identities not found');
 180   }
 181 }
 182
 183 function onQueryIdentitiesComplete(result) {
 184   _logData('QueryIdentities successful: ' + JSON.stringify(result));
 185 }
 186
 187 function getIdentity() {
 188   var id = parseFloat(document.getElementById('serv_identityid').value);
 189   if (isNaN(id)) {
 190     _logData('Invalid id');
 191     return;
 192   }
 193   var res = tizen.sso.authService.getIdentity(id);
 194   if (res != null) {
 195     res.then(onGetIdentityComplete, function(err) {
 196       _logData('GetIdentity failed: ' + err);});
 197   } else {
 198     _logData('Identity not found with the specified id');
 199   }
 200 }
 201
 202 function onGetIdentityComplete(result) {
 203   _logData('GetIdentity successful: ' + JSON.stringify(result));
 204 }
 205
 206 function clearDB() {
 207   tizen.sso.authService.clear().then(function(result) {
 208     _logData('Clear successful: ' + JSON.stringify(result));
 209     clearSelect(document.getElementById("ident_options"));
 210     clearSelect(document.getElementById("sess_options"));},
 211     function(err) {_logData('Clear failed: ' + err);});
 212 }
 213
 214 function getInfo() {
 215   var owner = {};
 216   var str = document.getElementById('cident_owner').value;
 217   if (typeof str === 'string' && str.length > 0) {
 218     arr = str.split(",");
 219     if (arr.length == 2) {
 220       owner.sysContext = arr[0];
 221       owner.appContext = arr[1];
 222     }
 223   }
 224   var realms = [];
 225   str = document.getElementById('cident_realms').value;
 226   if (typeof str === 'string' && str.length > 0) {
 227     arr = str.split(",");
 228     if (arr.length > 0) realms = arr;
 229   }
 230   var acl = [{}];
 231   str = document.getElementById('cident_acl').value;
 232   if (typeof str === 'string' && str.length > 0) {
 233     acl = JSON.parse(str);
 234   }
 235   var info = {
 236     'type': document.getElementById('cident_type').value,
 237     'username': document.getElementById('cident_username').value,
 238     'secret': document.getElementById('cident_secret').value,
 239     'storeSecret': document.getElementById('cident_storesecret').checked,
 240     'caption': document.getElementById('cident_caption').value,
 241     'realms': realms,
 242     'owner': owner,
 243     'accessControlList': acl
 244   };
 245   return info;
 246 }
 247
 248 function onCreateIdentity() {
 249   var info = getInfo();
 250   var res = tizen.sso.authService.createIdentity(info);
 251   if (res.syncOpErrorMsg != null) {
 252     _logData('Identity creation FAILED with error: ' + res.asyncOpErrorMsg);
 253     return;
 254   }
 255
 256   identityAdded(res.identity);
 257   _logData('Identity is added with jsid: ' + res.identity.jsid);
 258 }
 259
 260 function onUpdateIdentity() {
 261   var info = getInfo();
 262   store(info);
 263 }
 264
 265 function identityAdded(ident) {
 266   var select = document.getElementById("ident_options");
 267   var option = document.createElement('option');
 268   option.text = option.value = ident.jsid;
 269   select.add(option, 0);
 270
 271   ident.onsignedout = function (ident) {
 272     _logData('Identity with id ' + ident.info.id + ' is signedout and jsid is '
 273       + ident.jsid);};
 274   ident.onremoved = onIdentityRemoved;
 275 }
 276
 277 function onIdentityRemoved(ident) {
 278   _logData('Identity with id ' + ident.info.id + ' is removed and its jsid is '
 279     + ident.jsid);
 280   if (document.getElementById('ident_options').value == ident.jsid) {
 281     for (var i = 0; i < ident.sessions.length; i++) {
 282       var sessionobj = ident.sessions[i];
 283       sessionobj.removeEventListener('statechanged', onSessionStateChanged);
 284       document.getElementById('sess_options').remove(i);
 285     }
 286     clearSelectOption(document.getElementById("ident_options"), ident.jsid);
 287   }
 288 }
 289
 290 function clearSelectOption(element, value) {
 291   for (var i=0; i<element.length; i++) {
 292     if (element.options[i].value == value)
 293        element.remove(i);
 294   }
 295 }
 296
 297 function clearSelect(element) {
 298   for (var i=0; i<element.length; i++) {
 299     element.remove(i);
 300   }
 301 }
 302
 303 function onIdentityChanged(select) {
 304   var jsid = document.getElementById("ident_options").value;
 305   _logData('Identity selected with jsid: ' + jsid);
 306   var identobj = tizen.sso.authService.getIdentityByJSId(jsid);
 307   if (identobj == null) {
 308     _logData('identity NOT found');
 309     return;
 310   }
 311   clearSelect(document.getElementById("sess_options"));
 312   for (var i = 0; i < identobj.sessions.length; i++) {
 313     var option = document.createElement('option');
 314     option.text = option.value = identobj.sessions[i].jsid;
 315     document.getElementById('sess_options').add(option, 0);
 316   }
 317 }
 318
 319 //identity interface
 320 function startSession() {
 321   var identobj = tizen.sso.authService.getIdentityByJSId(
 322     document.getElementById('ident_options').value);
 323   if (identobj == null) {
 324     _logData('identity NOT selected/found. Please select/create an identity first');
 325     return;
 326   }
 327   _logData('identity found with JSId: ' + identobj.jsid);
 328   var method = document.getElementById('ident_method').value;
 329
 330   var res = identobj.startSession(method);
 331   if (res != null) {
 332     res.then(onStartSessionComplete,
 333       function(err) {_logData('startSession failed: ' + err);});
 334   } else {
 335     _logData('Session cannot be started');
 336   }
 337 }
 338
 339 function onStartSessionComplete(sessionobj) {
 340   _logData('startSession successful: ' + JSON.stringify(sessionobj));
 341   sessionobj.addEventListener('statechanged', onSessionStateChanged);
 342
 343   _logData('Session with jsid as ' + sessionobj.jsid + ' is added for identity with jsid '
 344      + sessionobj.identityJSId);
 345   var select = document.getElementById("ident_options");
 346   if (select.value == sessionobj.identityJSId) {
 347     var sess_select = document.getElementById("sess_options");
 348     var option = document.createElement('option');
 349     option.text = option.value = sessionobj.jsid;
 350     sess_select.add(option, 0);
 351   }
 352 }
 353
 354 function onSessionStateChanged(event) {
 355   var sessionobj = event.session;
 356   _logData('Session with jsid ' + sessionobj.jsid + ' state has changed to '
 357     + sessionobj.sessionState);
 358 }
 359
 360 function requestCredentialsUpdate() {
 361   var identobj = tizen.sso.authService.getIdentityByJSId(
 362     document.getElementById('ident_options').value);
 363   if (identobj == null) {
 364     _logData('identity NOT selected/found. Please select/create an identity first');
 365     return;
 366   }
 367   _logData('identity found with JSId: ' + identobj.jsid);
 368   var message = document.getElementById('ident_message').value;
 369
 370   var res = identobj.requestCredentialsUpdate(message);
 371   if (res != null) {
 372     res.then(function(msg) {document.form_out.form_text.value += "\n" +
 373       "requestCredentialsUpdate succeeded";},
 374           function(err) {_logData('requestCredentialsUpdate failed: ' + err);});
 375   } else {
 376     _logData('requestCredentialsUpdate failed');
 377   }
 378 }
 379
 380 function store(info) {
 381   var identobj = tizen.sso.authService.getIdentityByJSId(
 382     document.getElementById('ident_options').value);
 383   if (identobj == null) {
 384     _logData('identity NOT selected/found. Please select/create an identity first');
 385     return;
 386   }
 387   _logData('identity found with JSId: ' + identobj.jsid);
 388   if (info != null) identobj.updateInfo(info);
 389
 390   identobj.store().then(function(msg) {
 391     _logData('store succeeded with resp: ' + JSON.stringify(msg));},
 392     function(err) {_logData('store failed: ' + err);});
 393 }
 394
 395 function addReference() {
 396   var identobj = tizen.sso.authService.getIdentityByJSId(
 397     document.getElementById('ident_options').value);
 398   if (identobj == null) {
 399     _logData('identity NOT selected/found. Please select/create an identity first');
 400     return;
 401   }
 402   _logData('identity found with JSId: ' + identobj.jsid);
 403   var reference = document.getElementById('ident_addref').value;
 404
 405   var res = identobj.addReference(reference);
 406   if (res != null) {
 407     res.then(function(msg) {_logData('addReference succeeded');},
 408       function(err) {_logData('addReference failed: ' + err);});
 409   } else {
 410     _logData('addreference failed');
 411   }
 412 }
 413
 414 function removeReference() {
 415   var identobj = tizen.sso.authService.getIdentityByJSId(
 416     document.getElementById('ident_options').value);
 417   if (identobj == null) {
 418     _logData('identity NOT selected/found. Please select/create an identity first');
 419     return;
 420   }
 421   _logData('identity found with JSId: ' + identobj.jsid);
 422   var reference = document.getElementById('ident_remref').value;
 423
 424   var res = identobj.removeReference(reference);
 425   if (res != null) {
 426     res.then(function(msg) {_logData('removeReference succeeded');},
 427       function(err) {_logData('removeReference failed: ' + err);});
 428   } else {
 429     _logData('removeReference failed');
 430   }
 431 }
 432
 433 function removeIdentity() {
 434   var identobj = tizen.sso.authService.getIdentityByJSId(
 435     document.getElementById('ident_options').value);
 436   if (identobj == null) {
 437     _logData('identity NOT selected/found. Please select/create an identity first');
 438     return;
 439   }
 440   _logData('identity found with JSId: ' + identobj.jsid);
 441   identobj.remove().then(onIdentityRemoved,
 442     function(err) {_logData('remove failed: ' + err);});
 443 }
 444
 445 function signout() {
 446   var identobj = tizen.sso.authService.getIdentityByJSId(
 447     document.getElementById('ident_options').value);
 448   if (identobj == null) {
 449     _logData('identity NOT selected/found. Please select/create an identity first');
 450     return;
 451   }
 452   _logData('identity found with JSId: ' + identobj.jsid);
 453   identobj.signout().then(function(msg) {
 454     _logData('signout succeeded');},
 455     function(err) {_logData('signout failed: ' + err);});
 456 }
 457
 458 //authsession interface
 459 function queryAvailableMechanisms() {
 460   var identobj = tizen.sso.authService.getIdentityByJSId(
 461     document.getElementById('ident_options').value);
 462   if (identobj == null) {
 463     _logData('identity NOT selected/found. Please select/create an identity first');
 464     return;
 465   }
 466   _logData('identity found with JSId: ' + identobj.jsid);
 467   var sessionobj = identobj.getSessionByJSId(document.getElementById('sess_options').value);
 468   if (sessionobj == null) {
 469     _logData('session NOT selected/found. Please select/create session first');
 470     return;
 471   }
 472   _logData('session found with JSId: ' + sessionobj.jsid);
 473
 474   var str = document.getElementById('sess_mechs').value;
 475   var wantedMechs = [];
 476   if (typeof str === 'string' && str.length > 0) {
 477       arr = str.split(",");
 478       if (arr.length > 0) wantedMechs  = arr;
 479   }
 480   sessionobj.queryAvailableMechanisms(wantedMechs).then(function(msg) {
 481     _logData('queryAvailableMechanisms succeeded with mechanisms:' + JSON.stringify(msg));},
 482     function(err) {_logData('queryAvailableMechanisms failed: ' + err);});
 483 }
 484
 485 function challenge() {
 486   var identobj = tizen.sso.authService.getIdentityByJSId(
 487     document.getElementById('ident_options').value);
 488   if (identobj == null) {
 489     _logData('identity NOT selected/found. Please select/create an identity first');
 490     return;
 491   }
 492   _logData('identity found with JSId: ' + identobj.jsid);
 493   var sessionobj = identobj.getSessionByJSId(document.getElementById('sess_options').value);
 494   if (sessionobj == null) {
 495     _logData('session NOT selected/found. Please select/create session first');
 496     return;
 497   }
 498   _logData('session found with JSId: ' + sessionobj.jsid);
 499
 500   var mech = document.getElementById('sess_mech').value;
 501   var sessionData = document.getElementById('sess_data').value;
 502
 503   sessionobj.challenge(mech, sessionData).then(function(msg) {
 504     _logData('challenge succeeded with sessionData: ' + JSON.stringify(msg));},
 505     function(err) {_logData('challenge failed: ' + err);});
 506 }
 507
 508 function cancel() {
 509   var identobj = tizen.sso.authService.getIdentityByJSId(
 510     document.getElementById('ident_options').value);
 511   if (identobj == null) {
 512     _logData('identity NOT selected/found. Please select/create an identity first');
 513     return;
 514   }
 515   _logData('identity found with JSId: ' + identobj.jsid);
 516   var sessionobj = identobj.getSessionByJSId(document.getElementById('sess_options').value);
 517   if (sessionobj == null) {
 518     _logData('session NOT selected/found. Please select/create session first');
 519     return;
 520   }
 521   _logData('session found with JSId: ' + sessionobj.jsid);
 522
 523   sessionobj.removeEventListener('statechanged', onSessionStateChanged);
 524   sessionobj.cancel().then(function(msg) {
 525     _logData('cancel succeeded');},
 526     function(err) {_logData('cancel failed: ' + err);});
 527   clearSelectOption(document.getElementById('sess_options'), sessionobj.jsid);
 528 }
 529
 530 window.onload = function() {
 531   document.getElementById('cident_acl').value =
 532     JSON.stringify([{"secContext":{"sysContext":"*","appContext":"*"},
 533     "method":"password","mechanisms":["password"]}]);
 534   document.getElementById('cident_owner').value = "*,*";
 535   document.getElementById('serv_filter').value =
 536       JSON.stringify({Type:"WEB",Owner:{"sysContext":"*","appContext":"*"},Caption:"cap"});
 537 };
 538
 539 </script>
 540
 541 </body>
 542 </html>