Introdução ao Cloud Storage na Web

Com o Cloud Storage for Firebase, você faz upload e compartilha conteúdo gerado pelo usuário, como imagens e vídeo, para criar conteúdo de rich media nos apps. Seus dados são armazenados em um bucket do Google Cloud Storage, uma solução de armazenamento de objetos com capacidade que chega aos exabytes, além de alta disponibilidade e redundância global. Com o Cloud Storage for Firebase, o upload dos arquivos é feito com segurança e facilidade diretamente de dispositivos móveis e navegadores da Web, mesmo em redes intermitentes.

Pré-requisitos

Instale o SDK do Firebase para JavaScript e inicialize o Firebase, caso ainda não tenha feito isso.

Criar um bucket padrão do Cloud Storage

  1. No painel de navegação do console do Firebase, selecione Storage e clique em Comece aqui.

  2. Leia as mensagens sobre como proteger seus dados do Cloud Storage usando as regras de segurança. Durante o desenvolvimento, avalie a possibilidade de configurar suas regras para acesso público.

  3. Selecione um local para o bucket padrão do Cloud Storage.

    • Essa configuração de localização é o local padrão dos recursos do Google Cloud Platform (GCP) no seu projeto. Esse local será usado por serviços do GCP no projeto que exigem uma configuração de local, especificamente o banco de dados do Cloud Firestore e o app do App Engine (que é necessário se você usa o Cloud Scheduler).

    • Se você não conseguir selecionar um local, isso significa que seu projeto já tem um local padrão dos recursos do GCP. Ele foi definido durante a criação do projeto ou ao configurar outro serviço que requer uma configuração de local.

    Se você estiver no plano Blaze, poderá criar vários buckets, cada um com o próprio local.

  4. Clique em Concluído.

Configurar acesso público

O Cloud Storage for Firebase oferece uma linguagem declarativa de regras para que você defina como os dados devem ser estruturados e indexados e quando eles podem ser lidos e gravados. Por padrão, o acesso de leitura e gravação do Cloud Storage é restrito aos usuários autenticados. Para iniciar sem configurar o Authentication, defina as regras para acesso público.

Isso deixa o Cloud Storage disponível para todos, até para os que não usam o app. Por isso, restrinja o Cloud Storage novamente quando configurar a autenticação.

Adicionar o URL do seu intervalo ao seu app

Se o URL do bucket do Cloud Storage ainda não estiver incluído, será necessário adicioná-lo ao objeto de configuração do app do Firebase.

  1. Acesse o painel do Storage no console do Firebase.

  2. Clique na guia Arquivos e procure no cabeçalho do visualizador de arquivos.

  3. Copie o URL para sua área de transferência. Geralmente, está no formato project-id.appspot.com.

  4. Ao objeto firebaseConfig do app, adicione o atributo storageBucket com o URL do bucket:

Web 

import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  storageBucket: ''
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Cloud Storage and get a reference to the service
const storage = getStorage(app);

Web 

import firebase from "firebase/app";
import "firebase/compat/storage";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  storageBucket: '[your-storage-bucket-url]'
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Cloud Storage and get a reference to the service
const storage = firebase.storage();

Você já pode começar a usar o Cloud Storage!

Próxima etapa? Saiba como criar uma referência do Cloud Storage.

Configuração avançada

Há alguns casos de uso que exigem configuração adicional:

O primeiro caso de uso é perfeito para quem tem usuários em todo o mundo e quer armazenar os dados perto deles. Por exemplo, para armazenar os dados dos usuários dos EUA, da Europa e da Ásia, crie buckets nessas regiões para reduzir a latência.

O segundo caso de uso é útil quando você tem dados com diferentes padrões de acesso. Por exemplo, configure um bucket regional ou multirregional que armazene imagens ou outros conteúdos acessados frequentemente e um bucket nearline ou coldline que armazene backups de usuários ou outros conteúdos pouco acessados.

Em qualquer um desses casos de uso, é recomendável usar vários buckets do Cloud Storage.

O terceiro caso de uso é útil ao criar um app, como o Google Drive, em que os usuários têm diversas contas conectadas. Por exemplo, uma conta pessoal e uma conta corporativa. Para autenticar cada conta adicional, é possível usar uma instância personalizada do app do Firebase.

Usar vários buckets do Cloud Storage

Para usar um bucket do Cloud Storage diferente do padrão fornecido acima ou vários buckets do Cloud Storage em um único app, crie uma instância de firebase.storage que faça referência ao seu bucket personalizado:

Web

import { getApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// Get a non-default Storage bucket
const firebaseApp = getApp();
const storage = getStorage(firebaseApp, "gs://my-custom-bucket");
storage_multiple_buckets.js

Web

// Get a non-default Storage bucket
var storage = firebase.app().storage("gs://my-custom-bucket");
index.js

Trabalhar com buckets importados

Ao importar um bucket do Cloud Storage para o Firebase, é preciso conceder ao Firebase acesso a esses arquivos com a ferramenta gsutil inclusa no SDK Google Cloud:

gsutil -m acl ch -r -u service-<project number>@gcp-sa-firebasestorage.iam.gserviceaccount.com gs://<your-cloud-storage-bucket>

Você encontra o número do projeto conforme descrito na introdução a projetos do Firebase.

Isso não afeta os buckets recém-criados, porque eles têm o controle de acesso padrão, que autoriza o Firebase. Essa é uma medida temporária e será realizada automaticamente no futuro.

Usar um app personalizado do Firebase

Para desenvolver um app mais complexo usando um firebase.app.App personalizado, crie uma instância de firebase.storage.Storage inicializada com esse app:

Web

import { getStorage } from "firebase/storage";

// Get the default bucket from a custom firebase.app.App
const storage1 = getStorage(customApp);

// Get a non-default bucket from a custom firebase.app.App
const storage2 = getStorage(customApp, "gs://my-custom-bucket");
storage_custom_app.js

Web

// Get the default bucket from a custom firebase.app.App
var storage = customApp.storage();

// Get a non-default bucket from a custom firebase.app.App
var storage = customApp.storage("gs://my-custom-bucket");
index.js

Próximas etapas