Premiers pas avec Cloud Storage sur le Web

Cloud Storage pour Firebase vous permet de télécharger et de partager du contenu généré par les utilisateurs, tel que des images et des vidéos, ce qui vous permet d'intégrer du contenu multimédia riche dans vos applications. Vos données sont stockées dans un bucket Google Cloud Storage , une solution de stockage d'objets à l'échelle de l'exaoctet avec une haute disponibilité et une redondance globale. Cloud Storage pour Firebase vous permet de télécharger ces fichiers en toute sécurité directement à partir d'appareils mobiles et de navigateurs Web, en gérant facilement les réseaux irréguliers.

Conditions préalables

Si vous ne l'avez pas déjà fait, installez le SDK Firebase JS et initialisez Firebase .

Créer un bucket Cloud Storage par défaut

  1. Dans le volet de navigation de la console Firebase , sélectionnez Stockage , puis cliquez sur Commencer .

  2. Consultez les messages sur la sécurisation de vos données Cloud Storage à l'aide des règles de sécurité. Pendant le développement, pensez à définir vos règles d'accès public .

  3. Sélectionnez un emplacement pour votre bucket Cloud Storage par défaut.

    • Ce paramètre d'emplacement correspond à l'emplacement des ressources Google Cloud Platform (GCP) par défaut de votre projet. Notez que cet emplacement sera utilisé pour les services GCP de votre projet qui nécessitent un paramètre d'emplacement, en particulier votre base de données Cloud Firestore et votre application App Engine (qui est obligatoire si vous utilisez Cloud Scheduler).

    • Si vous ne parvenez pas à sélectionner un emplacement, cela signifie que votre projet dispose déjà d'un emplacement de ressources GCP par défaut. Il a été défini soit lors de la création du projet, soit lors de la configuration d'un autre service nécessitant un paramètre d'emplacement.

    Si vous bénéficiez du forfait Blaze, vous pouvez créer plusieurs buckets , chacun avec son propre emplacement .

  4. Cliquez sur Terminé .

Configurer l'accès public

Cloud Storage pour Firebase fournit un langage de règles déclaratives qui vous permet de définir comment vos données doivent être structurées, comment elles doivent être indexées et quand vos données peuvent être lues et écrites. Par défaut, l'accès en lecture et en écriture à Cloud Storage est restreint afin que seuls les utilisateurs authentifiés puissent lire ou écrire des données. Pour commencer sans configurer l'authentification , vous pouvez configurer vos règles d'accès public .

Cela rend Cloud Storage ouvert à tous, même aux personnes n'utilisant pas votre application, alors assurez-vous de restreindre à nouveau votre Cloud Storage lorsque vous configurez l'authentification.

Ajoutez l'URL de votre compartiment à votre application

S'il n'est pas déjà inclus, vous devez ajouter l'URL de votre bucket Cloud Storage à l'objet de configuration de votre application Firebase .

  1. Accédez à votre tableau de bord Stockage dans la console Firebase .

  2. Cliquez sur l'onglet Fichiers , puis regardez dans l'en-tête de la visionneuse de fichiers.

  3. Copiez l'URL dans votre presse-papiers. Il se présente généralement sous la forme project-id .appspot.com .

  4. À votre objet firebaseConfig dans votre application, ajoutez l'attribut storageBucket avec l'URL de votre bucket :

API modulaire 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);

API avec espace de noms 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();

Vous êtes prêt à commencer à utiliser Cloud Storage !

L'étape suivante? Découvrez comment créer une référence Cloud Storage .

Configuration avancée

Quelques cas d'utilisation nécessitent une configuration supplémentaire :

Le premier cas d’utilisation est parfait si vous avez des utilisateurs à travers le monde et que vous souhaitez stocker leurs données à proximité d’eux. Par exemple, vous pouvez créer des compartiments aux États-Unis, en Europe et en Asie pour stocker les données des utilisateurs de ces régions afin de réduire la latence.

Le deuxième cas d'utilisation est utile si vous disposez de données avec des modèles d'accès différents. Par exemple : vous pouvez configurer un compartiment multirégional ou régional qui stocke des images ou d'autres contenus fréquemment consultés, et un compartiment Nearline ou Coldline qui stocke les sauvegardes des utilisateurs ou d'autres contenus rarement consultés.

Dans l'un ou l'autre de ces cas d'utilisation, vous souhaiterez utiliser plusieurs buckets Cloud Storage .

Le troisième cas d'utilisation est utile si vous créez une application, comme Google Drive, qui permet aux utilisateurs d'avoir plusieurs comptes connectés (par exemple, un compte personnel et un compte professionnel). Vous pouvez utiliser une instance d'application Firebase personnalisée pour authentifier chaque compte supplémentaire.

Utiliser plusieurs buckets Cloud Storage

Si vous souhaitez utiliser un bucket Cloud Storage autre que celui par défaut fourni ci-dessus, ou utiliser plusieurs buckets Cloud Storage dans une seule application, vous pouvez créer une instance de firebase.storage qui fait référence à votre bucket personnalisé :

Web modular API

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");

Web namespaced API

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

Travailler avec des buckets importés

Lors de l'importation d'un bucket Cloud Storage existant dans Firebase, vous devrez accorder à Firebase la possibilité d'accéder à ces fichiers à l'aide de l'outil gsutil , inclus dans le SDK Google Cloud :

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

Vous pouvez trouver votre numéro de projet comme décrit dans l' introduction aux projets Firebase .

Cela n'affecte pas les buckets nouvellement créés, car ceux-ci ont le contrôle d'accès par défaut défini pour autoriser Firebase. Il s'agit d'une mesure temporaire qui sera effectuée automatiquement à l'avenir.

Utiliser une application Firebase personnalisée

Si vous créez une application plus complexe à l'aide d'un firebase.app.App personnalisé, vous pouvez créer une instance de firebase.storage.Storage initialisée avec cette application :

Web modular API

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");

Web namespaced API

// 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");

Prochaines étapes