arc: Use v2/auth LSO page.

chrome/browser/resources/chromeos/arc_support/background.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * UI Pages. Note the order must be in sync with the
  * ArcAuthService::UIPage enum.
  * @type {Array<string>}
  */
 var UI_PAGES = ['none',
@@ skipping 36 matching lines @@
   windowClosedInternally = true;
   appWindow.close();
   appWindow = null;
 }
 
 /**
  * Sends a native message to ArcSupportHost.
  * @param {string} code The action code in message.
  */
 function sendNativeMessage(code) {
   message = {'action': code};

[xiyuan, 2016/03/30 17:22:16]

nit: var, missed this in previous reviews.

[khmel, 2016/03/30 21:30:18]

Done.

   port.postMessage(message);
 }
 
 /**
  * Applies localization for html content.
  * @param {!Object} data Localized strings and relevant information.
  */
 function setLocalization(data) {
   var doc = appWindow.contentWindow.document;
   var loadTimeData = appWindow.contentWindow.loadTimeData;
@@ skipping 49 matching lines @@
     return;
   }
 
   var doc = appWindow.contentWindow.document;
   var pages = doc.getElementsByClassName('section');
   for (var i = 0; i < pages.length; i++) {
     pages[i].hidden = pages[i].id != pageDivId;
   }
 
   if (pageDivId == 'lso-loading') {
-    webview.src = 'https://accounts.google.com/o/oauth2/programmatic_auth?' +
-                  'scope=https://www.google.com/accounts/OAuthLogin&client_id' +
-                  '=1070009224336-sdh77n7uot3oc99ais00jmuft6sk2fg9.apps.' +
-                  'googleusercontent.com';
+    webview.src = 'https://accounts.google.com/o/oauth2/v2/auth?client_id=' +
+                  '1070009224336-sdh77n7uot3oc99ais00jmuft6sk2fg9.apps.' +
+                  'googleusercontent.com&response_type=code&redirect_uri=oob&' +
+                  'scope=https://www.google.com/accounts/OAuthLogin';
   }
   appWindow.show();
 }
 
 /**
+ * Sets error message.
+ * @param {string} error message.
+ */
+function setErrorMessage(error) {
+  if (!appWindow) {
+    return;
+  }
+  var doc = appWindow.contentWindow.document;
+  var messageElement = doc.getElementById('error-message');
+  messageElement.innerText = error;
+}
+
+/**
  * Shows requested page.
  * @param {int} pageId Index of the page to show. Must be in the array range of
  * UI_PAGES.
  * @param {string} status associated with page string status, error message for
  *                        example.
  */
 function showPageWithStatus(pageId, status) {
   if (!appWindow) {
     return;
   }
 
   if (UI_PAGES[pageId] == 'error') {
-    var doc = appWindow.contentWindow.document;
-    var messageElement = doc.getElementById('error-message');
-    messageElement.innerText = status;
+    setErrorMessage(status);
   }
   showPage(UI_PAGES[pageId]);
 }
 
 chrome.app.runtime.onLaunched.addListener(function() {
   var onAppContentLoad = function() {
     var doc = appWindow.contentWindow.document;
     webview = doc.getElementById('arc-support');
 
+    var isApprovalResponse = function(details) {
+      var resultUrlPrefix =
+        'https://accounts.google.com/o/oauth2/approval?';

[xiyuan, 2016/03/30 17:22:16]

nit: 4-space indent

[khmel, 2016/03/30 21:30:18]

Done.

+      return details.statusCode == 200 &&
+             details.url.substring(0, resultUrlPrefix.length) ==
+               resultUrlPrefix;
+    };
+
+    var onWebviewRequestResponseStarted = function(details) {
+      if (isApprovalResponse(details)) {
+        // Hide LSO page that displays auth code.
+        showPage('arc-loading');
+      } else {
+        showPage('lso');
+      }
+    };
+
     var onWebviewRequestCompleted = function(details) {
-      showPage('lso');
-      var resultUrlPrefix =
-          'https://accounts.google.com/o/oauth2/programmatic_auth?';
-      if (details.statusCode == 200 &&
-          details.url.substring(0, resultUrlPrefix.length) == resultUrlPrefix) {
-        sendNativeMessage('checkAuthCode');
+      if (!isApprovalResponse(details)) {
+        return;
       }
+
+      var attemptCount = 10;
+      var extractAuthCode = function() {
+        if (webview.src == details.url) {
+          webview.executeScript({code: 'document.title;'
+          }, function(results) {

[xiyuan, 2016/03/30 17:22:16]

nit: Can this fit in the previous line?

[khmel, 2016/03/30 21:30:18]

Done.

+            var authCodePrefix = 'Success code=';
+            if (results[0].substring(0, authCodePrefix.length) ==
+              authCodePrefix) {

[xiyuan, 2016/03/30 17:22:16]

nit: indent 2 more spaces

[khmel, 2016/03/30 21:30:18]

Done.

+              var authCode = results[0].substring(authCodePrefix.length);
+              console.log('Auth code:' + authCode);

[xiyuan, 2016/03/30 17:22:16]

debugging log?

[khmel, 2016/03/30 21:30:17]

Done.

+              var message = {
+                'action': 'setAuthCode',
+                'code': authCode
+              };
+              port.postMessage(message);

[xiyuan, 2016/03/30 17:22:16]

I wonder whether we can extend sendNativeMessage to support this,

e.g.

/**
 * Sends a native message to ArcSupportHost.
 * @param {string} code The action code in message.
 * @param {Object=} opt_Props Extra properties for the message.
 */
function sendNativeMessage(code, opt_Props) {
  var message = Object.assign({'action': code}, opt_Props);
  port.postMessage(message);
}

then we can do 

sendNativeMessage('setAuthCode', {code: authCode});

here.

[khmel, 2016/03/30 21:30:18]

Thanks for idea! I was going to implement something similar.

+            } else {
+              setErrorMessage('Authorization failed.');

[xiyuan, 2016/03/30 17:22:16]

The string should be put in grd file along with other arc messages for i18n.
Since SetLocalization should be called at this point, we can do

appWindow.contentWindow.loadTimeData.getString(<stringName>);

where stringName is what we set in arc_support_host.cc.

[khmel, 2016/03/30 21:30:18]

Done.

+              showPage('error');
+            }
+          });
+        } else {
+          if (attemptCount > 0) {
+            attemptCount -= 1;

[xiyuan, 2016/03/30 17:22:16]

nit: attemptCount--

[khmel, 2016/03/30 21:30:17]

Done.

+            setTimeout(extractAuthCode, 100);
+          } else {
+            setErrorMessage('Authorization time out.');
+            showPage('error');
+          }
+        }
+      };
+
+      extractAuthCode();
     };
 
     var requestFilter = {
       urls: ['<all_urls>'],
       types: ['main_frame']
     };
 
     webview.request.onCompleted.addListener(onWebviewRequestCompleted,

[xiyuan, 2016/03/30 17:22:15]

We probably should use 'contentload' event on the webview since we do not need
to manipulate http header etc. We probably can get rid of the retry with
'contentload'.

[khmel, 2016/03/30 21:30:18]

Thanks, it works stable.

         requestFilter);
+    webview.request.onResponseStarted.addListener(

[xiyuan, 2016/03/30 17:22:16]

Suggest to use 'loadstart' event.

[khmel, 2016/03/30 21:30:18]

onResponseStarted is executed on earlier stage.
When I use loadstart event I can see short flickering of the page with an auth
code.

[xiyuan, 2016/03/30 21:32:42]

Acknowledged.

+        onWebviewRequestResponseStarted, requestFilter);
 
     var onGetStarted = function() {
-      sendNativeMessage('checkAuthCode');
+      sendNativeMessage('startLSO');
     };
 
     var onRetry = function() {
-      sendNativeMessage('checkAuthCode');
+      sendNativeMessage('startLSO');
     };
 
     doc.getElementById('get-started').addEventListener('click', onGetStarted);
     doc.getElementById('retry').addEventListener('click', onRetry);
 
     connectPort();
   };
 
   var onWindowCreated = function(createdWindow) {
     appWindow = createdWindow;
@@ skipping 17 matching lines @@
       type: 'chrome',
       color: '#67a030'
     },
     'innerBounds': {
       'width': 800,
       'height': 600
     }
   };
   chrome.app.window.create('main.html', options, onWindowCreated);
 });