Summary: New environmental variable GOOGLE_DRIVE_SCOPE that modifies the scope requested for Google Drive integration. For prod it has value https://www.googleapis.com/auth/drive.file which leaves current behavior (Grist is allowed only to access public files and for private files - it fallbacks to Picker). For staging it has value https://www.googleapis.com/auth/drive.readonly which allows Grist to access all private files, and fallbacks to Picker only when the file is neither public nor private). Default value is https://www.googleapis.com/auth/drive.file Test Plan: manual and existing tests Reviewers: dsagal Reviewed By: dsagal Subscribers: dsagal Differential Revision: https://phab.getgrist.com/D3038pull/115/head
Jarosław Sadziński
3 years ago
parent
a0c53f2b61
commit
42910cb8f7
@ -0,0 +1,159 @@
|
|||||||
|
import {get as getBrowserGlobals} from 'app/client/lib/browserGlobals';
|
||||||
|
import type {Disposable} from 'grainjs';
|
||||||
|
import { GristLoadConfig } from "app/common/gristUrls";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Functions to perform server side authentication with Google.
|
||||||
|
*
|
||||||
|
* The authentication flow is performed by server side (app/server/lib/GoogleAuth.ts). Here we will
|
||||||
|
* open up a popup with a stub html file (served by the server), that will redirect user to Google
|
||||||
|
* Auth Service. In return, we will get authorization_code (which will be delivered by a postMessage
|
||||||
|
* from the iframe), that when converted to authorization_token, can be used to access Google Drive
|
||||||
|
* API. Accessing Google Drive files is done by the server, here we only ask for the permissions.
|
||||||
|
*
|
||||||
|
* Exposed methods are:
|
||||||
|
* - getGoogleCodeForSending: asks google for a permission to create files on the drive (and read
|
||||||
|
* them)
|
||||||
|
* - getGoogleCodeForReading: asks google for a permission to read all files
|
||||||
|
* - canReadPrivateFiles: Grist by default won't ask for permission to read all files, but can be
|
||||||
|
* configured this way by an environmental variable.
|
||||||
|
*/
|
||||||
|
|
||||||
|
const G = getBrowserGlobals('window');
|
||||||
|
|
||||||
|
export const ACCESS_DENIED = "access_denied";
|
||||||
|
export const AUTH_INTERRUPTED = "auth_interrupted";
|
||||||
|
|
||||||
|
// https://developers.google.com/identity/protocols/oauth2/scopes#drive
|
||||||
|
// "View and manage Google Drive files and folders that you have opened or created with this app"
|
||||||
|
const APP_SCOPE = "https://www.googleapis.com/auth/drive.file";
|
||||||
|
// "See and download all your Google Drive files"
|
||||||
|
const READ_SCOPE = "https://www.googleapis.com/auth/drive.readonly";
|
||||||
|
|
||||||
|
export function getGoogleCodeForSending(owner: Disposable) {
|
||||||
|
return getGoogleAuthCode(owner, APP_SCOPE);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getGoogleCodeForReading(owner: Disposable) {
|
||||||
|
const gristConfig: GristLoadConfig = (window as any).gristConfig || {};
|
||||||
|
// Default scope allows as to manage files we created.
|
||||||
|
return getGoogleAuthCode(owner, gristConfig.googleDriveScope || APP_SCOPE);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Checks if default scope for Google Drive integration will allow to access all personal files
|
||||||
|
*/
|
||||||
|
export function canReadPrivateFiles() {
|
||||||
|
const gristConfig: GristLoadConfig = (window as any).gristConfig || {};
|
||||||
|
return gristConfig.googleDriveScope === READ_SCOPE;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Opens up a popup with server side Google Authentication. Returns a code that can be used
|
||||||
|
* by server side to retrieve access_token required in Google Api.
|
||||||
|
*/
|
||||||
|
function getGoogleAuthCode(owner: Disposable, scope: string) {
|
||||||
|
// Compute google auth server endpoint (grist endpoint for server side google authentication).
|
||||||
|
// This endpoint renders a page that redirects user to Google Consent screen and after Google
|
||||||
|
// sends a response, it will post this response back to us.
|
||||||
|
// Message will be an object { code, error }.
|
||||||
|
const authLink = getGoogleAuthEndpoint(scope);
|
||||||
|
const authWindow = openPopup(authLink);
|
||||||
|
return new Promise<string>((resolve, reject) => {
|
||||||
|
attachListener(owner, authWindow, async (event: MessageEvent|null) => {
|
||||||
|
// If the no message, or window was closed (user closed it intentionally).
|
||||||
|
if (!event || authWindow.closed) {
|
||||||
|
reject(new Error(AUTH_INTERRUPTED));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// For the first message (we expect only a single message) close the window.
|
||||||
|
authWindow.close();
|
||||||
|
if (owner.isDisposed()) {
|
||||||
|
reject(new Error(AUTH_INTERRUPTED));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// Check response from the popup
|
||||||
|
const response = (event.data || {}) as {code?: string, error?: string};
|
||||||
|
// - when user declined, report back, caller should stop current flow,
|
||||||
|
if (response.error === "access_denied") {
|
||||||
|
reject(new Error(ACCESS_DENIED));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// - when there is no authorization, or error is different from what we expected - report to user.
|
||||||
|
if (!response.code) {
|
||||||
|
reject(new Error(response.error || "Missing authorization code"));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
resolve(response.code);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Helper function that attaches a handler to message event from a popup window.
|
||||||
|
function attachListener(owner: Disposable, popup: Window, listener: (e: MessageEvent|null) => void) {
|
||||||
|
const wrapped = (e: MessageEvent) => {
|
||||||
|
// Listen to events only from our window.
|
||||||
|
if (e.source !== popup) { return; }
|
||||||
|
// In case when Grist was reloaded or user navigated away - do nothing.
|
||||||
|
if (owner.isDisposed()) { return; }
|
||||||
|
listener(e);
|
||||||
|
// Clear the listener, to avoid orphaned calls from closed event.
|
||||||
|
listener = () => {};
|
||||||
|
};
|
||||||
|
// Unfortunately there is no ease way to detect if user has closed the popup.
|
||||||
|
const closeHandler = onClose(popup, () => {
|
||||||
|
listener(null);
|
||||||
|
// Clear the listener, to avoid orphaned messages from window.
|
||||||
|
listener = () => {};
|
||||||
|
});
|
||||||
|
owner.onDispose(closeHandler);
|
||||||
|
G.window.addEventListener('message', wrapped);
|
||||||
|
owner.onDispose(() => {
|
||||||
|
G.window.removeEventListener('message', wrapped);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Periodically checks if the window is closed.
|
||||||
|
// Returns a function that can be used to cancel the event.
|
||||||
|
function onClose(window: Window, clb: () => void) {
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
if (window.closed) {
|
||||||
|
clearInterval(interval);
|
||||||
|
clb();
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
return () => clearInterval(interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
function openPopup(url: string): Window {
|
||||||
|
// Center window on desktop
|
||||||
|
// https://stackoverflow.com/questions/16363474/window-open-on-a-multi-monitor-dual-monitor-system-where-does-window-pop-up
|
||||||
|
const width = 600;
|
||||||
|
const height = 650;
|
||||||
|
const left = window.screenX + (screen.width - width) / 2;
|
||||||
|
const top = (screen.height - height) / 4;
|
||||||
|
let windowFeatures = `top=${top},left=${left},menubar=no,location=no,` +
|
||||||
|
`resizable=yes,scrollbars=yes,status=yes,height=${height},width=${width}`;
|
||||||
|
|
||||||
|
// If window will be too large (for example on mobile) - open as a new tab
|
||||||
|
if (screen.width <= width || screen.height <= height) {
|
||||||
|
windowFeatures = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
const authWindow = G.window.open(url, "GoogleAuthPopup", windowFeatures);
|
||||||
|
if (!authWindow) {
|
||||||
|
// This method should be invoked by an user action.
|
||||||
|
throw new Error("This method should be invoked synchronously");
|
||||||
|
}
|
||||||
|
return authWindow;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Generates Google Auth endpoint (exposed by Grist) url. For example:
|
||||||
|
* https://docs.getgrist.com/auth/google
|
||||||
|
* @param scope Requested access scope for Google Services:
|
||||||
|
* https://developers.google.com/identity/protocols/oauth2/scopes
|
||||||
|
*/
|
||||||
|
function getGoogleAuthEndpoint(scope: string) {
|
||||||
|
return new URL(`auth/google?scope=${scope}`, window.location.origin).href;
|
||||||
|
}
|
||||||
Loading…
Reference in new issue