From cb84f5718604188f7aa5afd3451c10dd8f4cbce6 Mon Sep 17 00:00:00 2001
From: "Yann Esposito (Yogsototh)" <yann.esposito@gmail.com>
Date: Wed, 9 May 2018 17:25:49 +0200
Subject: [PATCH] Implicit grant updated

---
 implicit.html | 135 +++++++++++---------------------------------------
 infos.js      |   4 +-
 2 files changed, 30 insertions(+), 109 deletions(-)

diff --git a/implicit.html b/implicit.html
index 9fe6552..ee15f8d 100644
--- a/implicit.html
+++ b/implicit.html
@@ -18,53 +18,24 @@
         <h3>State</h3>
         The process should also return the state provided.
         <pre class="code" id="state-param"></pre>
-        <div id="oncode">
-            <h2>Code</h2>
-            <p>The code is generated by the Authentication server and send back
-                to the client via the resource's owner user-agent</p>
+        <div id="onaccesstoken">
+            <h2>Access Token</h2>
+            <p>The access token is generated by the Authentication server and
+                send back to the client via the resource's owner user-agent</p>
+            <p>Access tokens live a short time (about 10 min to 1 hour)</p>
             <p>For us, it is a JWT:</p>
-            <pre class="code" id="code-param"></pre>
+            <pre class="code" id="accesstoken-param"></pre>
             <p>Which once decoded is:</p>
-            <pre class="code" id="code-token"></pre>
-            <h2>Tokens</h2>
-            <p> Now the client server need to retrieve an <em>Access Token</em>
-                and a <em>Refresh Token</em> by using that code.</p>
-            <p>To achieve that the client will make a call to <code>/token</code>
-                using a basic auth creds</p>
-            <p>You have about 10 mins to retrieve them.
-                Unlike in this demo, that <strong>MUST</strong> be done server side.</p>
-            <div class="button"
-                 onclick="getTokensFromCode();">
-                Get Access &amp; Refresh Tokens from Code
-            </div>
-            <h3>Response from <code>/token</code></h3>
-            <p>token endpoint URL: <code id="urltoken" class="code">Nothing yet.</code></p>
-            <pre id="token" class="code">Nothing yet.</pre>
-            <h3>decoded access-token</h3>
-            <pre id="access-token" class="code">Nothing yet.</pre>
-            <h3>decoded refresh-token</h3>
-            <pre id="refresh-token" class="code">Nothing yet.</pre>
+            <pre class="code" id="accesstoken-token"></pre>
             <h2>Using the API</h2>
+            <h2>API Call</h2>
+            <p>API URL: <code id="apiurl" class="code">Nothing yet.</code></p>
             <div class="button"
                  onclick="makeApiCall();">
                 Make an API call with the access token
             </div>
             <p>API URL: <code id="apiurl" class="code">Nothing yet.</code></p>
             <pre id="apiresponse" class="code">Nothing yet.</pre>
-            <h2>Getting new access token without user interaction</h2>
-            <p> The access tokens are the only tokens which are able to talk to the
-                Visibility API.</p>
-            <p>Access tokens live a short time (about 10 min to 1 hour)</p>
-            <p>This is why the client must require a new access token using its
-                <em>refresh token</em>.
-                That is just making another call to <code>/token</code>
-                But with different parameters. </p>
-            <div class="button"
-                 onclick="getAccessToken();">
-                Get Access Tokens from Refresh Token
-            </div>
-            <pre id="refreshed" class="code">Nothing yet.</pre>
-            <pre id="refreshed-access-token" class="code">Nothing yet.</pre>
         </div>
         <script>
          /* ----- */
@@ -77,7 +48,18 @@
              });
              return result;
          }
-         var params=getJsonFromUrl();
+         function getHashParams() {
+             var hashParams={};
+             var e,
+                 a = /\+/g,  // Regex for replacing addition symbol with a space
+                 r = /([^&;=]+)=?([^&;]*)/g,
+                 d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
+                 q = window.location.hash.substring(1);
+             while (e = r.exec(q))
+                 hashParams[d(e[1])] = d(e[2]);
+             return hashParams;
+         }
+         var params=getHashParams();
          var authstatus="";
          if (params.error) {
              authstatus = "REFUSED: " + params.error;
@@ -91,14 +73,14 @@
                  authstatus += "\n\n<a href='" + decodeURIComponent(params.error_uri) + "'>" + decodeURIComponent(params.error_uri) + "</a>";
              }
              $('#authorization_status').addClass('refused');
-             $('#oncode').hide();
+             $('#onaccesstoken').hide();
          } else {
-             if (params.code) {
+             if (params.access_token) {
                  authstatus = "AUTHORIZED" ;
                  $('#authorization_status').addClass('authorized');
              } else {
                  authstatus = "UNKNOWN" ;
-                 $('#oncode').hide();
+                 $('#onaccesstoken').hide();
                  $('#state-param').html("No state");
              }
          }
@@ -118,71 +100,10 @@
              token.payload = JSON.parse(window.atob(t.split('.')[1]));
              return (token)
          }
-         var jwt=jwtDecode(params.code).payload;
-         $('#code-param').html(params.code);
-         $('#code-token').html(JSON.stringify(jwt,null,2));
-         var refreshToken="";
-         var accessToken="";
-         var getTokensFromCode = function() {
-             var tokparams={
-                 "code":params.code
-                 , "redirect_uri":redirect_uri
-                 , "scope":scope
-                 , "client_id":client_id
-                 , "grant_type":"authorization_code"
-             };
-             var onError = function(jqXHR,textStatus,errorThrown){
-                 $('#token').html(errorThrown + " status: " + jqXHR.status
-                                + "\n---\n"
-                                + JSON.stringify(jqXHR.responseJSON,null,2));}
-             var onSuccess = function(data,textStatus,jqXHR) {
-                 $("#token").html(data
-                                + "\n---\n"
-                                + JSON.stringify(jqXHR.responseJSON,null,2));
-                 $("#access-token").html( JSON.stringify(jwtDecode(jqXHR.responseJSON.access_token).payload,null,2) );
-                 $("#refresh-token").html( JSON.stringify(jwtDecode(jqXHR.responseJSON.refresh_token).payload,null,2) );
-                 accessToken=jqXHR.responseJSON.access_token;
-                 refreshToken=jqXHR.responseJSON.refresh_token;
-             }
-             $.ajax({
-                 type: "POST"
-                 , beforeSend: function(request) {request.setRequestHeader("Authorization","Basic " + btoa(client_id + ":" + client_password))}
-                 , success: onSuccess
-                 , error: onError
-                 , url: oauthServerTokenUrl
-                 , data: tokparams
-                 , contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
-                 , crossDomain: true
-             });
-         };
-         var getAccessToken = function() {
-             var tokparams={
-                 "refresh_token":refreshToken
-                 , "scope":scope
-                 , "client_id":client_id
-                 , "grant_type":"refresh_token"
-             };
-             var onError = function(jqXHR,textStatus,errorThrown){
-                 $('#refreshed').html(errorThrown + " status: " + jqXHR.status
-                                    + "\n---\n"
-                                    + JSON.stringify(jqXHR.responseJSON,null,2))}
-             var onSuccess = function(data,textStatus,jqXHR) {
-                 $("#refreshed").html(data
-                                    + "\n---\n"
-                                    + JSON.stringify(jqXHR.responseJSON,null,2));
-                 $("#refreshed-access-token").html( JSON.stringify(jwtDecode(jqXHR.responseJSON.access_token).payload,null,2) );
-             }
-             $.ajax({
-                 type: "POST"
-                 , beforeSend: function(request) {request.setRequestHeader("Authorization","Basic " + btoa(client_id + ":" + client_password))}
-                 , success: onSuccess
-                 , error: onError
-                 , url: oauthServerTokenUrl
-                 , data: tokparams
-                 , contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
-                 , crossDomain: true
-             });
-         };
+         var jwt=jwtDecode(params.access_token).payload;
+         $('#accesstoken-param').html(params.access_token);
+         $('#accesstoken-token').html(JSON.stringify(jwt,null,2));
+         var accessToken=params.access_token;
          var makeApiCall = function() {
              var onError = function(jqXHR,textStatus,errorThrown){
                  $('#apiresponse').html(errorThrown + " status: " + jqXHR.status
diff --git a/infos.js b/infos.js
index f949bd6..fd86703 100644
--- a/infos.js
+++ b/infos.js
@@ -2,10 +2,10 @@ var oauthURLPrefix="http://localhost:9001";
 var oauthServerUrl=oauthURLPrefix + "/iroh/oauth2/authorize";
 var oauthServerTokenUrl=oauthURLPrefix + "/iroh/oauth2/token";
 var resourceProviderTestEndpoint=oauthURLPrefix + "/iroh/iroh-ui-settings/whoami" ;
-var response_type="code";
+var response_type="token";
 var client_id="localtest";
 var client_password = "localpass";
-var redirect_uri="http://localhost:9999/code.html";
+var redirect_uri="http://localhost:9999/implicit.html";
 var scopes=[ "private-intel"
            , "ui-settings"
            //  , inexistant