Draft: Google Picker #5443
Open
Draft: Google Picker #5443
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
New and removed dependencies detected. Learn more about Socket for GitHub ↗︎
|
Diff output filesdiff --git a/packages/@uppy/companion-client/lib/tokenStorage.js b/packages/@uppy/companion-client/lib/tokenStorage.js
index df49432..26bb521 100644
--- a/packages/@uppy/companion-client/lib/tokenStorage.js
+++ b/packages/@uppy/companion-client/lib/tokenStorage.js
@@ -1,15 +1,9 @@
-export function setItem(key, value) {
- return new Promise(resolve => {
- localStorage.setItem(key, value);
- resolve();
- });
+export async function setItem(key, value) {
+ localStorage.setItem(key, value);
}
-export function getItem(key) {
- return Promise.resolve(localStorage.getItem(key));
+export async function getItem(key) {
+ return localStorage.getItem(key);
}
-export function removeItem(key) {
- return new Promise(resolve => {
- localStorage.removeItem(key);
- resolve();
- });
+export async function removeItem(key) {
+ localStorage.removeItem(key);
}
diff --git a/packages/@uppy/companion/lib/companion.js b/packages/@uppy/companion/lib/companion.js
index 9416e5e..333b8b9 100644
--- a/packages/@uppy/companion/lib/companion.js
+++ b/packages/@uppy/companion/lib/companion.js
@@ -11,6 +11,7 @@ const providerManager = require("./server/provider");
const controllers = require("./server/controllers");
const s3 = require("./server/controllers/s3");
const url = require("./server/controllers/url");
+const googlePicker = require("./server/controllers/googlePicker");
const createEmitter = require("./server/emitter");
const redis = require("./server/redis");
const jobs = require("./server/jobs");
@@ -107,6 +108,9 @@ module.exports.app = (optionsArg = {}) => {
if (options.enableUrlEndpoint) {
app.use("/url", url());
}
+ if (options.enableGooglePickerEndpoint) {
+ app.use("/google-picker", googlePicker());
+ }
app.post(
"/:providerName/preauth",
express.json(),
diff --git a/packages/@uppy/companion/lib/config/companion.d.ts b/packages/@uppy/companion/lib/config/companion.d.ts
index 3924a64..9aff10f 100644
--- a/packages/@uppy/companion/lib/config/companion.d.ts
+++ b/packages/@uppy/companion/lib/config/companion.d.ts
@@ -12,6 +12,7 @@ export namespace defaultOptions {
export let expires: number;
}
let enableUrlEndpoint: boolean;
+ let enableGooglePickerEndpoint: boolean;
let allowLocalUrls: boolean;
let periodicPingUrls: any[];
let streamingUpload: boolean;
diff --git a/packages/@uppy/companion/lib/config/companion.js b/packages/@uppy/companion/lib/config/companion.js
index 542f378..5892411 100644
--- a/packages/@uppy/companion/lib/config/companion.js
+++ b/packages/@uppy/companion/lib/config/companion.js
@@ -18,6 +18,7 @@ const defaultOptions = {
expires: 800, // seconds
},
enableUrlEndpoint: false,
+ enableGooglePickerEndpoint: false,
allowLocalUrls: false,
periodicPingUrls: [],
streamingUpload: true,
diff --git a/packages/@uppy/companion/lib/server/controllers/url.js b/packages/@uppy/companion/lib/server/controllers/url.js
index 3e0eff3..6a0b3be 100644
--- a/packages/@uppy/companion/lib/server/controllers/url.js
+++ b/packages/@uppy/companion/lib/server/controllers/url.js
@@ -2,35 +2,15 @@
Object.defineProperty(exports, "__esModule", { value: true });
const express = require("express");
const { startDownUpload } = require("../helpers/upload");
-const { prepareStream } = require("../helpers/utils");
+const { downloadURL } = require("../download");
const { validateURL } = require("../helpers/request");
-const { getURLMeta, getProtectedGot } = require("../helpers/request");
+const { getURLMeta } = require("../helpers/request");
const logger = require("../logger");
/**
* @callback downloadCallback
* @param {Error} err
* @param {string | Buffer | Buffer[]} chunk
*/
-/**
- * Downloads the content in the specified url, and passes the data
- * to the callback chunk by chunk.
- *
- * @param {string} url
- * @param {boolean} allowLocalIPs
- * @param {string} traceId
- * @returns {Promise}
- */
-const downloadURL = async (url, allowLocalIPs, traceId) => {
- try {
- const protectedGot = await getProtectedGot({ allowLocalIPs });
- const stream = protectedGot.stream.get(url, { responseType: "json" });
- const { size } = await prepareStream(stream);
- return { stream, size };
- } catch (err) {
- logger.error(err, "controller.url.download.error", traceId);
- throw err;
- }
-};
/**
* Fetches the size and content type of a URL
*
diff --git a/packages/@uppy/companion/lib/server/helpers/request.d.ts b/packages/@uppy/companion/lib/server/helpers/request.d.ts
index eff658a..69a7536 100644
--- a/packages/@uppy/companion/lib/server/helpers/request.d.ts
+++ b/packages/@uppy/companion/lib/server/helpers/request.d.ts
@@ -1,5 +1,5 @@
/// <reference types="node" />
-export function getURLMeta(url: string, allowLocalIPs?: boolean): Promise<{
+export function getURLMeta(url: string, allowLocalIPs?: boolean, options?: any): Promise<{
name: string;
type: string;
size: number;
diff --git a/packages/@uppy/companion/lib/server/helpers/request.js b/packages/@uppy/companion/lib/server/helpers/request.js
index 9c78f29..fc2bd1b 100644
--- a/packages/@uppy/companion/lib/server/helpers/request.js
+++ b/packages/@uppy/companion/lib/server/helpers/request.js
@@ -94,10 +94,10 @@ module.exports.getProtectedGot = getProtectedGot;
* @param {boolean} allowLocalIPs
* @returns {Promise<{name: string, type: string, size: number}>}
*/
-exports.getURLMeta = async (url, allowLocalIPs = false) => {
+exports.getURLMeta = async (url, allowLocalIPs = false, options = undefined) => {
async function requestWithMethod(method) {
const protectedGot = await getProtectedGot({ allowLocalIPs });
- const stream = protectedGot.stream(url, { method, throwHttpErrors: false });
+ const stream = protectedGot.stream(url, { method, throwHttpErrors: false, ...options });
return new Promise((resolve, reject) => (stream
.on("response", (response) => {
// Can be undefined for unknown length URLs, e.g. transfer-encoding: chunked
diff --git a/packages/@uppy/companion/lib/server/provider/google/drive/index.d.ts b/packages/@uppy/companion/lib/server/provider/google/drive/index.d.ts
index a13c57b..8ac298f 100644
--- a/packages/@uppy/companion/lib/server/provider/google/drive/index.d.ts
+++ b/packages/@uppy/companion/lib/server/provider/google/drive/index.d.ts
@@ -1,10 +1,9 @@
-export = Drive;
/**
* Adapter for API https://developers.google.com/drive/api/v3/
*/
-declare class Drive extends Provider {
+export class Drive extends Provider {
list(options: any): Promise<any>;
- download({ id: idIn, token }: {
+ download({ id, token }: {
id: any;
token: any;
}): Promise<any>;
@@ -15,6 +14,16 @@ declare class Drive extends Provider {
logout: typeof logout;
refreshToken: typeof refreshToken;
}
+export function streamGoogleFile({ token, id: idIn }: {
+ token: any;
+ id: any;
+}): Promise<{
+ stream: import("got", { with: { "resolution-mode": "import" } }).Request;
+}>;
+export function getGoogleFileSize({ id, token }: {
+ id: any;
+ token: any;
+}): Promise<number>;
import Provider = require("../../Provider");
import { logout } from "../index";
import { refreshToken } from "../index";
diff --git a/packages/@uppy/companion/lib/server/provider/google/drive/index.js b/packages/@uppy/companion/lib/server/provider/google/drive/index.js
index e5bcbf2..d48a5cd 100644
--- a/packages/@uppy/companion/lib/server/provider/google/drive/index.js
+++ b/packages/@uppy/companion/lib/server/provider/google/drive/index.js
@@ -43,6 +43,49 @@ async function getStats({ id, token }) {
}
return stats;
}
+async function streamGoogleFile({ token, id: idIn }) {
+ const client = await getClient({ token });
+ const { mimeType, id, exportLinks } = await getStats({ id: idIn, token });
+ let stream;
+ if (isGsuiteFile(mimeType)) {
+ const mimeType2 = getGsuiteExportType(mimeType);
+ logger.info(`calling google file export for ${id} to ${mimeType2}`, "provider.drive.export");
+ // GSuite files exported with large converted size results in error using standard export method.
+ // Error message: "This file is too large to be exported.".
+ // Issue logged in Google APIs: https://github.com/googleapis/google-api-nodejs-client/issues/3446
+ // Implemented based on the answer from StackOverflow: https://stackoverflow.com/a/59168288
+ const mimeTypeExportLink = exportLinks?.[mimeType2];
+ if (mimeTypeExportLink) {
+ const gSuiteFilesClient = (await got).extend({
+ headers: {
+ authorization: `Bearer ${token}`,
+ },
+ });
+ stream = gSuiteFilesClient.stream.get(mimeTypeExportLink, { responseType: "json" });
+ } else {
+ stream = client.stream.get(`files/${encodeURIComponent(id)}/export`, {
+ searchParams: { supportsAllDrives: true, mimeType: mimeType2 },
+ responseType: "json",
+ });
+ }
+ } else {
+ stream = client.stream.get(`files/${encodeURIComponent(id)}`, {
+ searchParams: { alt: "media", supportsAllDrives: true },
+ responseType: "json",
+ });
+ }
+ await prepareStream(stream);
+ return { stream };
+}
+async function getGoogleFileSize({ id, token }) {
+ const { mimeType, size } = await getStats({ id, token });
+ if (isGsuiteFile(mimeType)) {
+ // GSuite file sizes cannot be predetermined (but are max 10MB)
+ // e.g. Transfer-Encoding: chunked
+ return undefined;
+ }
+ return parseInt(size, 10);
+}
/**
* Adapter for API https://developers.google.com/drive/api/v3/
*/
@@ -115,7 +158,7 @@ class Drive extends Provider {
});
}
// eslint-disable-next-line class-methods-use-this
- async download({ id: idIn, token }) {
+ async download({ id, token }) {
if (mockAccessTokenExpiredError != null) {
logger.warn(`Access token: ${token}`);
if (mockAccessTokenExpiredError === token) {
@@ -124,53 +167,22 @@ class Drive extends Provider {
}
}
return withGoogleErrorHandling(Drive.oauthProvider, "provider.drive.download.error", async () => {
- const client = await getClient({ token });
- const { mimeType, id, exportLinks } = await getStats({ id: idIn, token });
- let stream;
- if (isGsuiteFile(mimeType)) {
- const mimeType2 = getGsuiteExportType(mimeType);
- logger.info(`calling google file export for ${id} to ${mimeType2}`, "provider.drive.export");
- // GSuite files exported with large converted size results in error using standard export method.
- // Error message: "This file is too large to be exported.".
- // Issue logged in Google APIs: https://github.com/googleapis/google-api-nodejs-client/issues/3446
- // Implemented based on the answer from StackOverflow: https://stackoverflow.com/a/59168288
- const mimeTypeExportLink = exportLinks?.[mimeType2];
- if (mimeTypeExportLink) {
- const gSuiteFilesClient = (await got).extend({
- headers: {
- authorization: `Bearer ${token}`,
- },
- });
- stream = gSuiteFilesClient.stream.get(mimeTypeExportLink, { responseType: "json" });
- } else {
- stream = client.stream.get(`files/${encodeURIComponent(id)}/export`, {
- searchParams: { supportsAllDrives: true, mimeType: mimeType2 },
- responseType: "json",
- });
- }
- } else {
- stream = client.stream.get(`files/${encodeURIComponent(id)}`, {
- searchParams: { alt: "media", supportsAllDrives: true },
- responseType: "json",
- });
- }
- await prepareStream(stream);
- return { stream };
+ return streamGoogleFile({ token, id });
});
}
// eslint-disable-next-line class-methods-use-this
async size({ id, token }) {
- return withGoogleErrorHandling(Drive.oauthProvider, "provider.drive.size.error", async () => {
- const { mimeType, size } = await getStats({ id, token });
- if (isGsuiteFile(mimeType)) {
- // GSuite file sizes cannot be predetermined (but are max 10MB)
- // e.g. Transfer-Encoding: chunked
- return undefined;
- }
- return parseInt(size, 10);
- });
+ return withGoogleErrorHandling(
+ Drive.oauthProvider,
+ "provider.drive.size.error",
+ async () => (getGoogleFileSize({ id, token })),
+ );
}
}
Drive.prototype.logout = logout;
Drive.prototype.refreshToken = refreshToken;
-module.exports = Drive;
+module.exports = {
+ Drive,
+ streamGoogleFile,
+ getGoogleFileSize,
+};
diff --git a/packages/@uppy/companion/lib/server/provider/index.js b/packages/@uppy/companion/lib/server/provider/index.js
index 7691d83..12e8acb 100644
--- a/packages/@uppy/companion/lib/server/provider/index.js
+++ b/packages/@uppy/companion/lib/server/provider/index.js
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
*/
const dropbox = require("./dropbox");
const box = require("./box");
-const drive = require("./google/drive");
+const { Drive } = require("./google/drive");
const googlephotos = require("./google/googlephotos");
const instagram = require("./instagram/graph");
const facebook = require("./facebook");
@@ -65,7 +65,7 @@ module.exports.getProviderMiddleware = (providers, grantConfig) => {
* @returns {Record<string, typeof Provider>}
*/
module.exports.getDefaultProviders = () => {
- const providers = { dropbox, box, drive, googlephotos, facebook, onedrive, zoom, instagram, unsplash };
+ const providers = { dropbox, box, drive: Drive, googlephotos, facebook, onedrive, zoom, instagram, unsplash };
return providers;
};
/**
diff --git a/packages/@uppy/companion/lib/standalone/helper.js b/packages/@uppy/companion/lib/standalone/helper.js
index edaa622..ccc5e1a 100644
--- a/packages/@uppy/companion/lib/standalone/helper.js
+++ b/packages/@uppy/companion/lib/standalone/helper.js
@@ -143,6 +143,7 @@ const getConfigFromEnv = () => {
validHosts,
},
enableUrlEndpoint: process.env.COMPANION_ENABLE_URL_ENDPOINT === "true",
+ enableGooglePickerEndpoint: process.env.COMPANION_ENABLE_GOOGLE_PICKER_ENDPOINT === "true",
periodicPingUrls: process.env.COMPANION_PERIODIC_PING_URLS
? process.env.COMPANION_PERIODIC_PING_URLS.split(",")
: [],
diff --git a/packages/@uppy/core/lib/locale.js b/packages/@uppy/core/lib/locale.js
index 7311693..6ac4428 100644
--- a/packages/@uppy/core/lib/locale.js
+++ b/packages/@uppy/core/lib/locale.js
@@ -36,6 +36,9 @@ export default {
openFolderNamed: "Open folder %{name}",
cancel: "Cancel",
logOut: "Log out",
+ logIn: "Log in",
+ pickFiles: "Pick files",
+ pickPhotos: "Pick photos",
filter: "Filter",
resetFilter: "Reset filter",
loading: "Loading...",
@@ -56,5 +59,6 @@ export default {
},
additionalRestrictionsFailed: "%{count} additional restrictions were not fulfilled",
unnamed: "Unnamed",
+ pleaseWait: "Please wait",
},
};
diff --git a/packages/@uppy/provider-views/lib/index.js b/packages/@uppy/provider-views/lib/index.js
index 3e5b730..9d7cc3d 100644
--- a/packages/@uppy/provider-views/lib/index.js
+++ b/packages/@uppy/provider-views/lib/index.js
@@ -1,2 +1,3 @@
+export { default as GooglePickerView } from "./GooglePicker/GooglePickerView.js";
export { default as ProviderViews, defaultPickerIcon } from "./ProviderView/index.js";
export { default as SearchProviderViews } from "./SearchProviderView/index.js";
diff --git a/packages/@uppy/transloadit/lib/index.js b/packages/@uppy/transloadit/lib/index.js
index 2e8d13d..3a923d3 100644
--- a/packages/@uppy/transloadit/lib/index.js
+++ b/packages/@uppy/transloadit/lib/index.js
@@ -459,6 +459,8 @@ function _getClientVersion2() {
addPluginVersion("Facebook", "uppy-facebook");
addPluginVersion("GoogleDrive", "uppy-google-drive");
addPluginVersion("GooglePhotos", "uppy-google-photos");
+ addPluginVersion("GoogleDrivePicker", "uppy-google-drive-picker");
+ addPluginVersion("GooglePhotosPicker", "uppy-google-photos-picker");
addPluginVersion("Instagram", "uppy-instagram");
addPluginVersion("OneDrive", "uppy-onedrive");
addPluginVersion("Zoom", "uppy-zoom"); |
2 tasks
StrixOSG
reviewed
Nov 13, 2024
Comment on lines
97
to
98
| // NOTE: photos is broken and results in an error being returned from Google | ||
| // .addView(google.picker.ViewId.PHOTOS) |
There was a problem hiding this comment.
This is an old method of using Google Picker I believe @mifi. There is a new picker API for Google Photos and I believe it'll have to be a separate implementation: https://developers.google.com/photos/picker/guides/get-started-picker
At least how it appears to work is by making a POST request to https://photospicker.googleapis.com/v1/sessions which returns a few things including a pickerUri which can then the user can select photos in another tab/window using that URI from their Google Photos library for all photos and albums: https://developers.google.com/photos/picker/reference/rest/v1/sessions/create
However, I don't think Google allows you to access shared albums, etc. anymore at all unfortunately. So it just has to be something the user has in their library or album directly.
There was a problem hiding this comment.
yup I just found out about it too, i've done some testing and it seems to be working. It's a pity that shared albums don't work, but what can we do
There was a problem hiding this comment.
Awesome, it is hard to track down which APIs Google wants you to use haha. Agreed about shared albums, but exactly it is what it is.
- split into two plugins - implement photos picker - auto login - save access token in local storage - document - handle photos/files picked and send to companion - add new hook useStore for making it easier to use localStorage data in react - add new hook useUppyState for making it easier to use uppy state from react - add new hook useUppyPluginState for making it easier to plugin state from react - fix css error
which occurs in dev when js has been built before build:ts gets called
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Initial POC of Google Picker.
closes #5382
closes #5469
How to test:
Google Developer console setup
Instructions for enabling the Picker API in the Google Developer console for the first time:
apiKeyclientIdappIdNow set
VITE_GOOGLE_PICKER_CLIENT_ID,VITE_GOOGLE_PICKER_API_KEY,VITE_GOOGLE_PICKER_APP_IDin your.envfile and runyarn dev:with-companionProblems/discussion
redirect_urineeds to be frontend URI, and wilcard is not allowed. Update: I've madeappId,clientIdandapiKeyas Uppy options (not Companion) so this should be OK because people can then use their own credentials.Cannot seem to get google photos to work (only Google Drive)TODO
tsconfig.json(I have just copy-pasted from google photos)tsconfig.build.json(I have just copy-pasted from google photos)google-picker.mdx(I have just copy-pasted from google photos)google-picker/README.md(I have just copy-pasted from google photos)onPickedadd the files along with any metadata needed by companion to download the files, like accessToken, clientId etc.clientId,scope,accessToken. The endpoint will callgapi.client.drive.files.get, and stream (download/upload) the file to the destination (e.g. tus/s3 etc). Need to make sure the endpoint is secure somehow in a way that it cannot be abused/exploited.this.provideris not needed in GooglePicker.tssetSelectFolderEnabled(true))