2016-03-02 32 views
18

Sto utilizzando Google Cloud Storage. Per caricare su cloud storage ho esaminato diversi metodi. Il metodo che ritengo più comune è che il file viene inviato al server e da lì viene inviato a Google Cloud storage.Caricamento dal browser client a Google Cloud Storage tramite JavaScript

Desidero spostare il file direttamente dal browser Web dell'utente in Google Cloud Storage. Non riesco a trovare alcun tutorial relativo a questo. Ho letto l'SDK client dell'API di Google per JavaScript.

Passando attraverso il riferimento dell'API di Google, si afferma che i file possono essere trasferiti utilizzando una richiesta HTTP. Ma sono confuso su come farlo usando il API client library for JavaScript.

Le persone qui avrebbero bisogno di condividere del codice. Ma non ho scritto alcun codice, non sono riuscito a trovare un metodo per fare il lavoro.

+0

L'approccio normale consiste nell'utilizzare una chiamata "put" utilizzando l'API di storage di firebase. I riferimenti sono qui: https://firebase.google.com/docs/storage/web/upload-files – fmacdee

+2

questa è una cattiva idea perché in pratica permette a chiunque di caricare qualsiasi cosa, mentre andare se un server ti dà l'opportunità di polizia e convalidare l'invio e nascondere la chiave API. – dandavis

+0

Non sono sicuro dalla domanda che si desidera che l'utente faccia ciò senza autenticare. È questo ciò che cerchi, o stai cercando un utente autenticato per poterlo fare? – fmacdee

risposta

1

EDIT 1: testato codice di esempio

Così mi sono davvero interessato a questo, e ha avuto pochi minuti per gettare un po 'di codice insieme. Ho deciso di creare un piccolo server Express per ottenere il token di accesso, ma continuo a caricare dal client. Ho usato fetch per fare il caricamento invece della libreria client.

Non ho un account cloud di Google, quindi non l'ho verificato, quindi non posso confermare che funzioni, ma non riesco a capire perché non dovrebbe. Il codice è on my GitHub here.

Leggere attentamente e apportare le modifiche necessarie prima di tentare di eseguirlo. In particolare, è necessario specificare la posizione del file della chiave privata, nonché assicurarsi che sia lì, e è necessario impostare il nome del bucket in index.html.

Fine di modificare 1

Disclaimer: io ho sempre e solo utilizzato la libreria client Node.js Google per l'invio di messaggi di posta elettronica, ma credo di avere una conoscenza di base delle API di Google.

Per utilizzare qualsiasi servizio di Google, abbiamo bisogno di token di accesso per verificare la nostra identità; tuttavia, poiché stiamo cercando di consentire a qualsiasi utente di caricarsi nel nostro bucket di Cloud Storage, non è necessario passare attraverso il processo OAuth standard.

Google fornisce quello che chiamano un account di servizio, che è un account che utilizziamo per identificare le istanze delle nostre app che accedono alle nostre risorse. Mentre in una procedura standard OAuth dovremmo identificare la nostra app al servizio, consentire all'utente di utilizzare la nostra app (e quindi concederci l'autorizzazione), ottenere un token di accesso per quell'utente specifico e quindi effettuare richieste al servizio ; con un account di servizio, possiamo saltare il processo di consenso dell'utente, poiché siamo, in un certo senso, il nostro utente. L'utilizzo di un account di servizio ci consente di utilizzare semplicemente le credenziali generate dalla console dell'API di Google per generare un JWT (token web JSON), che utilizzeremo per ottenere un token di accesso, che utilizziamo per effettuare richieste al servizio di archiviazione cloud. Vedi here per la guida di Google su questo processo.

In passato, ho utilizzato pacchetti come this one per generare JWT, ma non sono riuscito a trovare alcuna libreria client per la codifica di JWT; principalmente perché sono generati quasi esclusivamente sui server. Tuttavia, ho trovato this tutorial, che, a prima vista, sembra sufficiente per scrivere il nostro algoritmo di codifica.

Vorrei sottolineare che aprire un'app per consentire al pubblico l'accesso gratuito alle risorse di Google potrebbe rivelarsi dannoso per te o la tua organizzazione in futuro, come sono sicuro che tu abbia preso in considerazione. Questo è un grande rischio per la sicurezza, motivo per cui tutte le esercitazioni che hai visto finora hanno implementato due caricamenti consecutivi.

Se fossi in me, farei almeno la prima parte del processo di autenticazione sul mio server: quando l'utente è pronto per caricare, invierò una richiesta al mio server per generare il token di accesso per i servizi di Google utilizzando le credenziali dell'account del mio servizio e quindi invierei a ciascun utente un nuovo token di accesso generato dal mio server. In questo modo, ho un ulteriore livello di sicurezza tra il mondo esterno e il mio account Google, poiché il carico dell'autenticazione giace nel mio server e solo il caricamento viene eseguito dal cliente.

In ogni modo, una volta che abbiamo il token di accesso, possiamo utilizzare il CORS feature that Google provides per caricare i file al nostro secchio. Questa funzione ci consente di utilizzare le richieste standard XHR 2 per utilizzare i servizi di Google ed è essenzialmente progettato per essere utilizzato al posto di JavaScript client library. Preferirei usare la funzione CORS sulla libreria client solo perché penso che sia un po 'più semplice e leggermente più flessibile nella sua implementazione. (Non ho provato questo, ma penso che fetch funzionerebbe qui altrettanto bene come XHR 2.).

Da qui, avremo bisogno di ottenere il file da parte dell'utente, così come tutte le informazioni che vogliamo da loro per quanto riguarda il file (leggi: nome file), quindi effettuare una richiesta su https://www.googleapis.com/upload/storage/v1/b/<BUCKET_NAME_HERE>/o (sostituendo con nome del tuo bucket, ovviamente) con il token di accesso aggiunto all'URL come da Creazione di richieste autenticate nella sezione di CORS feature page e qualsiasi altro parametro nella stringa corpo/query che desideri includere, come da Cloud Storage API documentation on inserting an object. Un riferimento API per il servizio di Cloud Storage può essere trovato here come riferimento.

Come non ho mai fatto prima, e non ho la possibilità di testare questo, non ho alcun codice di esempio da includere con la mia risposta, ma spero che il mio post sia abbastanza chiaro che mettere insieme il codice dovrebbe essere relativamente semplice da qui.

Proprio per impostare le cose in chiaro, ho sempre trovato OAuth per essere piuttosto confusa, e hanno generalmente evitato di giocare con esso a causa della mia paura delle sue incognite. Tuttavia, penso di averlo finalmente imparato, specialmente dopo questo post, quindi non vedo l'ora di avere un'ora gratis per giocarci.

Per favore fatemi sapere se qualcosa che ho detto non è chiaro o coerente.

Problemi correlati