Upload e download de arquivos do Google Drive com Quasar e NodeJS

Imagine que seu cliente peça para que você faça um sistema que permita a ele salvar seus arquivos na nuvem realizando o Upload e Download desses arquivos.

Parece complicado? Nem tanto. Basta uma série de permissões e credenciais para que a sua API tenha acesso ao Google Drive.

Com o tutorial a seguir você só precisar clicar em botões boa parte do tempo. Vamos lá!

Primeiramente,  baixe o exemplo completo do meu Github.

Tecnologias

As tecnologias envolvidas nesse tutorial são:

  • Quasar v1
  • Vuex
  • Axios
  • NodeJS Express
  • Google APIs
  • OAuth2

Google API

Para entender melhor sobre todo o processo de autenticação envolvendo Google APIs, eu aconselho a lerem o artigo do LuizTools que faz um apanhado geral dos principais pontos. Inclusive utilizo boa parte do código dele.

Acesse a página NodeJS do Drive API e clique em “ENABLE THE DRIVE API”:

node01

Se esta janela aparecer, dê um nome ao projeto, concorde com os termos e serviços e clique em “NEXT”:

node02

Anote o Client ID e o Client Secret para seu próprio conhecimento e clique em “DOWNLOAD CLIENT CONFIGURATION” para baixar o arquivo “credentials.json”:

node03

NodeJS API

Agora vamos para o código-fonte.

Coloque o arquivo “credentials.json” na raiz do projeto “node”:

node03_2

Abra o terminal e baixe os pacotes:

npm install

Rode a API:

node .

Copie a longa URL mostrada no terminal:

node04

Cole no navegador e acesse a página de seleção de contas do Google:

node05

Se uma janela de aviso surgir, clique nos links destacados para prosseguir:

node06

node07

Dê todas as permissões necessárias para que o Quickstart app acesse a sua conta do Google Drive:

node08

Confirme todas as permissões de novo:

node09

Finalmente, copie o código e cole no terminal:

node10

node11

O arquivo “token.json” será criado na raiz do projeto:

node12

Agora pare e execute a API novamente. Os últimos 10 arquivos enviados para o seu Google Drive serão listados no terminal, demonstrando que a conexão está funcionando.

node13

Quasar App

Agora vamos testar a aplicação.

Abra o terminal dentro da pasta “quasar” e baixe os pacotes:

npm install

Rode a aplicação:

quasar dev

Na tela principal, clique em “Upload File”:

quasar01

Selecione um arquivo do seu computador e pressione o botão “Upload”:

quasar02

Se uma mensagem positiva aparecer, volte para a tela anterior e clique no botão “List Files”.

Seu arquivo deve aparecer no topo da lista dos últimos 10 arquivos enviados para o Google Drive:

quasar03

Se você clicar em qualquer arquivo será capaz de baixá-lo:

quasar04

Isso conclui o tutorial. Espero que tenham gostado.

Em breve mais artigos com API’s do Google.

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *