Merge pull request #1101 from remotestorage/bugfix/1097-fix_gd_dropbox_authorization

Fix Google Drive and  Dropbox authorization in Cordova apps

Author: Sebastian Kippe

doc/js-api/remotestorage.rst

@@ -143,7 +143,7 @@ Prototype functions
 
 The following functions can be called on your ``remoteStorage`` instance:
 
-.. autofunction:: RemoteStorage#authorize(authURL, [cordovaRedirectUri])
+.. autofunction:: RemoteStorage#authorize(options)
   :short-name:
 
 .. autofunction:: RemoteStorage#connect(userAddress, [token])

src/authorize.js

@@ -36,8 +36,24 @@ function extractParams(url) {
   }, {});
 }
 
+function buildOAuthURL (authURL, redirectUri, scope, clientId) {
+  const hashPos = redirectUri.indexOf('#');
+  let url = authURL;
 
-var Authorize = function (remoteStorage, authURL, scope, redirectUri, clientId) {
+  url += authURL.indexOf('?') > 0 ? '&' : '?';
+  url += 'redirect_uri=' + encodeURIComponent(redirectUri.replace(/#.*$/, ''));
+  url += '&scope=' + encodeURIComponent(scope);
+  url += '&client_id=' + encodeURIComponent(clientId);
+
+  if (hashPos !== - 1 && hashPos+1 !== redirectUri.length) {
+    url += '&state=' + encodeURIComponent(redirectUri.substring(hashPos+1));
+  }
+  url += '&response_type=token';
+
+  return url;
+}
+
+const Authorize = function (remoteStorage, { authURL, scope, redirectUri, clientId }) {
   log('[Authorize] authURL = ', authURL, 'scope = ', scope, 'redirectUri = ', redirectUri, 'clientId = ', clientId);
 
   // keep track of the discovery data during redirect if we can't save it in localStorage
@@ -55,15 +71,7 @@ var Authorize = function (remoteStorage, authURL, scope, redirectUri, clientId)
     redirectUri += 'rsDiscovery=' + btoa(JSON.stringify(discoveryData));
   }
 
-  var url = authURL, hashPos = redirectUri.indexOf('#');
-  url += authURL.indexOf('?') > 0 ? '&' : '?';
-  url += 'redirect_uri=' + encodeURIComponent(redirectUri.replace(/#.*$/, ''));
-  url += '&scope=' + encodeURIComponent(scope);
-  url += '&client_id=' + encodeURIComponent(clientId);
-  if (hashPos !== - 1 && hashPos+1 !== redirectUri.length) {
-    url += '&state=' + encodeURIComponent(redirectUri.substring(hashPos+1));
-  }
-  url += '&response_type=token';
+  const url = buildOAuthURL(authURL, redirectUri, scope, clientId);
 
   if (util.globalContext.cordova) {
     return Authorize.openWindow(url, redirectUri, 'location=yes,clearsessioncache=yes,clearcache=yes')

src/dropbox.js

@@ -209,7 +209,7 @@ Dropbox.prototype = {
     if (this.token){
       hookIt(this.rs);
     } else {
-      Authorize(this.rs, AUTH_URL, '', String(Authorize.getLocation()), this.clientId);
+      this.rs.authorize({ authURL: AUTH_URL, scope: '', clientId: this.clientId });
     }
   },
 

src/googledrive.js

@@ -14,7 +14,6 @@
  * Docs: https://developers.google.com/drive/v3/web/quickstart/js
 **/
 
-const Authorize = require('./authorize');
 const BaseClient = require('./baseclient');
 const WireClient = require('./wireclient');
 const eventHandling = require('./eventhandling');
@@ -207,7 +206,7 @@ GoogleDrive.prototype = {
    */
   connect: function () {
     this.rs.setBackend('googledrive');
-    Authorize(this.rs, AUTH_URL, AUTH_SCOPE, String(Authorize.getLocation()), this.clientId);
+    this.rs.authorize({ authURL: AUTH_URL, scope: AUTH_SCOPE, clientId: this.clientId });
   },
 
   /**

src/remotestorage.js

@@ -172,20 +172,32 @@ RemoteStorage.prototype = {
   },
 
   /**
-   * TODO: document
+   * Initiate the OAuth authorization flow.
+   *
+   * This function is called by custom storage backend implementations
+   * (e.g. Dropbox or Google Drive).
+   *
+   * @param {object} options
+   * @param {string} options.authURL - URL of the authorization endpoint
+   * @param {string} [options.scope] - access scope
+   * @param {string} [options.clientId] - client identifier (defaults to the
+   *                                      origin of the redirectUri)
    *
-   * @param {string} authUrl
-   * @param {string} cordovaRedirectUri
+   * @private
    */
-  authorize: function authorize(authURL, cordovaRedirectUri) {
+  authorize: function authorize (options) {
     this.access.setStorageType(this.remote.storageApi);
-    var scope = this.access.scopeParameter;
+    if (typeof options.scope === 'undefined') {
+      options.scope = this.access.scopeParameter;
+    }
 
-    var redirectUri = globalContext.cordova ? cordovaRedirectUri : String(Authorize.getLocation());
+    options.redirectUri = globalContext.cordova ? config.cordovaRedirectUri : String(Authorize.getLocation());
 
-    var clientId = redirectUri.match(/^(https?:\/\/[^/]+)/)[0];
+    if (typeof options.clientId === 'undefined') {
+      options.clientId = options.redirectUri.match(/^(https?:\/\/[^/]+)/)[0];
+    }
 
-    Authorize(this, authURL, scope, redirectUri, clientId);
+    Authorize(this, options);
   },
 
   /**
@@ -280,7 +292,7 @@ RemoteStorage.prototype = {
         if (info.authURL) {
           if (typeof token === 'undefined') {
             // Normal authorization step; the default way to connect
-            this.authorize(info.authURL, config.cordovaRedirectUri);
+            this.authorize({ authURL: info.authURL });
           } else if (typeof token === 'string') {
             // Token supplied directly by app/developer/user
             log('Skipping authorization sequence and connecting with known token');

test/unit/authorize-suite.js

@@ -51,14 +51,14 @@ define([ 'require', './src/authorize', './src/config'], function(require, Author
       {
         desc: "Authorize redirects to the provider's OAuth location",
         run: function(env, test) {
-          var authUrl = 'http://storage.provider.com/oauth';
+          var authURL = 'http://storage.provider.com/oauth';
           var scope = 'contacts:r';
           var redirectUri = 'http://awesome.app.com/#custom/path';
           var clientId = 'http://awesome.app.com/';
 
           this.localStorageAvailable = function() { return true; };
 
-          Authorize(this, authUrl, scope, redirectUri, clientId);
+          Authorize(this, {authURL, scope, redirectUri, clientId});
 
           var expectedUrl = 'http://storage.provider.com/oauth?redirect_uri=http%3A%2F%2Fawesome.app.com%2F&scope=contacts%3Ar&client_id=http%3A%2F%2Fawesome.app.com%2F&state=custom%2Fpath&response_type=token';
           test.assert(document.location.href, expectedUrl);
@@ -68,14 +68,14 @@ define([ 'require', './src/authorize', './src/config'], function(require, Author
       {
         desc: "Authorize redirects to the provider's OAuth location with empty fragment",
         run: function(env, test) {
-          var authUrl = 'http://storage.provider.com/oauth';
+          var authURL = 'http://storage.provider.com/oauth';
           var scope = 'contacts:r';
           var redirectUri = 'http://awesome.app.com/#';
           var clientId = 'http://awesome.app.com/';
 
           this.localStorageAvailable = function() { return true; };
 
-          Authorize(this, authUrl, scope, redirectUri, clientId);
+          Authorize(this, {authURL, scope, redirectUri, clientId});
 
           var expectedUrl = 'http://storage.provider.com/oauth?redirect_uri=http%3A%2F%2Fawesome.app.com%2F&scope=contacts%3Ar&client_id=http%3A%2F%2Fawesome.app.com%2F&response_type=token';
           test.assert(document.location.href, expectedUrl);
@@ -86,7 +86,7 @@ define([ 'require', './src/authorize', './src/config'], function(require, Author
         desc: "Authorize doesn't redirect, but opens an in-app-browser window",
         run: function(env, test) {
           document.location.href = 'file:///some/cordova/path';
-          var authUrl = 'http://storage.provider.com/oauth';
+          var authURL = 'http://storage.provider.com/oauth';
           var scope = 'contacts:r';
           var redirectUri = 'http://awesome.app.com/#';
           var clientId = 'http://awesome.app.com/';
@@ -97,10 +97,11 @@ define([ 'require', './src/authorize', './src/config'], function(require, Author
 
           Authorize.openWindow = function(url, uri) {
             test.assertAnd(uri, redirectUri);
+            delete global.cordova;
             test.done();
           };
 
-          Authorize(this, authUrl, scope, redirectUri, clientId);
+          Authorize(this, {authURL, scope, redirectUri, clientId});
 
           test.assertAnd(document.location.href, 'file:///some/cordova/path');
         }

test/unit/remotestorage-suite.js

@@ -648,7 +648,97 @@ define(['require', 'tv4', './src/eventhandling'], function (require, tv4, eventH
 
           test.assertAnd(env.rs._syncTimer, undefined);
         }
-      }
+      },
+
+      {
+        desc: "#authorize redirects to the OAuth provider",
+        run: function (env, test) {
+          global.document = {
+            location: {
+              href: 'https://app.com:5000/foo/bar',
+              toString: function() { return this.href; }
+            }
+          };
+
+          const authURL = 'https://provider.com/oauth';
+          env.rs.access.claim('contacts', 'r');
+
+          env.rs.authorize({ authURL });
+
+          test.assert(document.location.href, 'https://provider.com/oauth?redirect_uri=https%3A%2F%2Fapp.com%3A5000%2Ffoo%2Fbar&scope=contacts%3Ar&client_id=https%3A%2F%2Fapp.com%3A5000&response_type=token');
+
+          delete global.document;
+        }
+      },
+
+      {
+        desc: "#authorize uses the given scope",
+        run: function (env, test) {
+          global.document = {
+            location: {
+              href: 'https://app.com:5000/foo/bar',
+              toString: function() { return this.href; }
+            }
+          };
+
+          const authURL = 'https://provider.com/oauth';
+
+          env.rs.authorize({ authURL, scope: 'custom-scope' });
+
+          test.assert(document.location.href, 'https://provider.com/oauth?redirect_uri=https%3A%2F%2Fapp.com%3A5000%2Ffoo%2Fbar&scope=custom-scope&client_id=https%3A%2F%2Fapp.com%3A5000&response_type=token');
+
+          delete global.document;
+        }
+      },
+
+      {
+        desc: "#authorize uses the cordovaRedirectUri when in Cordova",
+        run: function (env, test) {
+          global.document = {
+            location: {
+              href: 'https://app.com:5000/foo/bar',
+              toString: function() { return this.href; }
+            }
+          };
+
+          global.cordova = { foo: 'bar' }; // Pretend we run in Cordova
+
+          global.Authorize.openWindow = function(url, redirectUri) {
+            test.assertAnd(url, 'https://provider.com/oauth?redirect_uri=https%3A%2F%2Fmy.custom-redirect.url&scope=contacts%3Ar&client_id=https%3A%2F%2Fmy.custom-redirect.url&response_type=token');
+            test.assertAnd(redirectUri, 'https://my.custom-redirect.url');
+            delete global.cordova;
+            delete global.document;
+            test.done();
+          };
+
+          const authURL = 'https://provider.com/oauth';
+
+          env.rs.access.claim('contacts', 'r');
+          env.rs.setCordovaRedirectUri('https://my.custom-redirect.url');
+          env.rs.authorize({ authURL });
+        }
+      },
+
+      {
+        desc: "#authorize uses the given clientId",
+        run: function (env, test) {
+          global.document = {
+            location: {
+              href: 'https://app.com:5000/foo/bar',
+              toString: function() { return this.href; }
+            }
+          };
+
+          const authURL = 'https://provider.com/oauth';
+          env.rs.access.claim('contacts', 'r');
+
+          env.rs.authorize({ authURL, clientId: 'my-client-id' });
+
+          test.assert(document.location.href, 'https://provider.com/oauth?redirect_uri=https%3A%2F%2Fapp.com%3A5000%2Ffoo%2Fbar&scope=contacts%3Ar&client_id=my-client-id&response_type=token');
+
+          delete global.document;
+        }
+      },
     ]
   });