Ce tutoriel explique comment configurer un bucket Cloud Storage afin d'héberger un site Web statique pour un domaine dont vous êtes propriétaire. Les pages Web statiques peuvent contenir des technologies côté client telles que HTML, CSS et JavaScript. Elles ne peuvent pas comporter de contenu dynamique tel que des scripts côté serveur comme PHP.
Ce tutoriel explique comment diffuser du contenu via HTTP. Pour suivre un tutoriel utilisant le protocole HTTPS, consultez la page Héberger un site Web statique.
Pour obtenir des exemples et des conseils sur les pages Web statiques, y compris sur l'hébergement d'éléments statiques pour un site Web dynamique, consultez la page Site Web statique.
Objectifs
Au cours de ce tutoriel, vous allez :- faire pointer votre domaine vers Cloud Storage à l'aide d'un enregistrement
CNAME
; - créer un bucket associé à votre domaine ;
- importer et partager les fichiers de votre site ;
- tester le site Web.
Coûts
Ce tutoriel utilise le composant facturable suivant de Google Cloud :
- Cloud Storage
Pour en savoir plus sur les frais qui peuvent s'appliquer en cas d'hébergement d'un site Web statique, consultez la section Surveiller vos frais de stockage. Pour obtenir plus d'informations sur les coûts liés à Cloud Storage, consultez la page concernant les tarifs de Cloud Storage.
Avant de commencer
- Sign in to your Google Cloud account. If you're new to Google Cloud, create an account to evaluate how our products perform in real-world scenarios. New customers also get $300 in free credits to run, test, and deploy workloads.
-
In the Google Cloud console, on the project selector page, select or create a Google Cloud project.
-
Make sure that billing is enabled for your Google Cloud project.
-
In the Google Cloud console, on the project selector page, select or create a Google Cloud project.
-
Make sure that billing is enabled for your Google Cloud project.
- Prenez un domaine que vous possédez ou gérez. Si vous ne disposez pas d'un domaine, de nombreux services vous permettent d'enregistrer un nouveau domaine, par exemple Cloud Domains.
Ce tutoriel utilise le domaine
example.com
. - Confirmez que vous possédez ou gérez le domaine que vous allez utiliser. Assurez-vous que cette validation porte sur le domaine de premier niveau, tel que
example.com
, et non sur un sous-domaine, tel quewww.example.com
.Remarque : Si vous êtes propriétaire du domaine que vous associez à un bucket, vous avez peut-être déjà effectué cette étape précédemment. Si vous avez acheté le domaine via Cloud Domains, la validation est automatique.
Connecter votre domaine à Cloud Storage
Pour connecter votre domaine à Cloud Storage, créez un enregistrement CNAME
via votre service d'enregistrement de domaine. Un enregistrement CNAME
est un type d'enregistrement DNS. Il dirige le trafic qui demande une URL depuis votre domaine vers les ressources que vous souhaitez diffuser, dans ce cas des objets dans vos buckets Cloud Storage.
Pour www.example.com
, l'enregistrement CNAME
peut contenir les informations suivantes :
NAME TYPE DATA www CNAME c.storage.googleapis.com.
Pour en savoir plus sur les redirections CNAME
, consultez la section consacrée aux URI pour la création d'alias CNAME
.
Pour connecter votre domaine à Cloud Storage, procédez comme suit :
Créez un enregistrement
CNAME
qui pointe versc.storage.googleapis.com.
.Votre service d'enregistrement de domaine devrait vous permettre d'administrer le domaine, y compris l'ajout d'enregistrements
CNAME
. Par exemple, si vous utilisez Cloud DNS, vous trouverez des instructions relatives à l'ajout d'enregistrements de ressources sur la page Ajouter, modifier et supprimer des enregistrements.
Créer un bucket
Créez un bucket dont le nom correspond au CNAME
que vous avez créé pour votre domaine.
Par exemple, si vous avez ajouté un enregistrement CNAME
pointant du sous-domaine www
de example.com
vers c.storage.googleapis.com.
, la commande Google Cloud CLI permettant de créer un bucket portant le nom www.example.com
ressemblerait à ceci :
gcloud storage buckets create gs://www.example.com --location=US
Pour obtenir des instructions complètes sur la création de buckets avec différents outils, consultez la page Créer des buckets.
Importer les fichiers de votre site
Pour ajouter à votre bucket les fichiers que vous souhaitez que votre site Web diffuse :
Console
- Dans la console Google Cloud, accédez à la page Buckets Cloud Storage.
Dans la liste des buckets, cliquez sur le nom de celui que vous avez créé.
Dans l'onglet Objets, cliquez sur le bouton Importer des fichiers.
Dans la boîte de dialogue de sélection de fichier, accédez au fichier souhaité et sélectionnez-le.
Une fois l'importation terminée, vous devez voir le nom du fichier et des informations relatives à ce dernier.
Ligne de commande
Exécutez la commande gcloud storage cp
pour copier des fichiers dans le bucket.
Par exemple, pour copier le fichier index.html
à partir de son emplacement actuel (Desktop
) :
gcloud storage cp Desktop/index.html gs://www.example.com
Si l'opération réussit, la réponse se présente comme suit :
Completed files 1/1 | 164.3kiB/164.3kiB
Bibliothèques clientes
C++
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage C++.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
C#
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage C#.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Go
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Go.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Java
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Java.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
L'exemple suivant lance l'importation d'un objet individuel :
L'exemple suivant lance l'importation simultanée de plusieurs objets :
L'exemple suivant lance l'importation simultanée de tous les objets ayant un préfixe commun :
Node.js
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Node.js.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
L'exemple suivant lance l'importation d'un objet individuel :
L'exemple suivant lance l'importation simultanée de plusieurs objets :
L'exemple suivant lance l'importation simultanée de tous les objets ayant un préfixe commun :
PHP
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage PHP.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Python
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Python.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
L'exemple suivant lance l'importation d'un objet individuel :
L'exemple suivant lance l'importation simultanée de plusieurs objets :
L'exemple suivant lance l'importation simultanée de tous les objets ayant un préfixe commun :
Ruby
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Ruby.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
API REST
API JSON
Vous devez installer et initialiser gcloud CLI afin de générer un jeton d'accès pour l'en-tête
Authorization
.Vous pouvez également créer un jeton d'accès à l'aide d'OAuth 2.0 Playground et l'inclure dans l'en-tête
Authorization
.Utilisez
cURL
pour appeler l'API JSON avec une requête d'objetPOST
: Pour la page d'index de www.example.com, procédez comme suit :curl -X POST --data-binary @index.html \ -H "Content-Type: text/html" \ -H "Authorization: $(gcloud auth print-access-token)" \ "https://storage.googleapis.com/upload/storage/v1/b/www.example.com/o?uploadType=media&name=index.html"
API XML
Vous devez installer et initialiser gcloud CLI afin de générer un jeton d'accès pour l'en-tête
Authorization
.Vous pouvez également créer un jeton d'accès à l'aide d'OAuth 2.0 Playground et l'inclure dans l'en-tête
Authorization
.Utilisez
cURL
pour appeler l'API XML avec une requête d'objetPUT
: Pour la page d'index de www.example.com, procédez comme suit :curl -X PUT --data-binary @index.html \ -H "Authorization: $(gcloud auth print-access-token)" \ -H "Content-Type: text/html" \ "https://storage.googleapis.com/www.example.com/index.html"
Partager des fichiers
Pour rendre tous les objets d'un bucket lisibles par tous sur l'Internet public :
Console
- Dans la console Google Cloud, accédez à la page Buckets Cloud Storage.
Dans la liste des buckets, cliquez sur le nom de celui que vous souhaitez rendre public.
Sélectionnez l'onglet Autorisations en haut de la page.
Si le volet Accès public indique Non public, cliquez sur le bouton Supprimer la protection contre l'accès public, puis sur Confirmer dans la boîte de dialogue qui s'affiche.
Cliquez sur le bouton add_box Accorder l'accès.
La boîte de dialogue Ajouter des entités principales s'affiche.
Dans le champ Nouvelles entités principales, saisissez
allUsers
.Dans la liste déroulante Sélectionner un rôle, sélectionnez le sous-menu Cloud Storage, puis cliquez sur l'option Lecteur des objets Storage.
Cliquez sur Enregistrer.
Cliquez sur Autoriser l'accès public.
Une fois le partage public effectué, une icône de lien s'affiche pour chaque objet dans la colonne Accès public. Vous pouvez cliquer sur cette icône pour obtenir l'URL de l'objet.
Ligne de commande
Exécutez la commande buckets add-iam-policy-binding
:
gcloud storage buckets add-iam-policy-binding gs://www.example.com --member=allUsers --role=roles/storage.objectViewer
Bibliothèques clientes
C++
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage C++.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
C#
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage C#.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Go
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Go.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Java
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Java.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Node.js
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Node.js.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
PHP
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage PHP.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Python
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Python.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Ruby
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Ruby.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
API REST
API JSON
Vous devez installer et initialiser gcloud CLI afin de générer un jeton d'accès pour l'en-tête
Authorization
.Vous pouvez également créer un jeton d'accès à l'aide d'OAuth 2.0 Playground et l'inclure dans l'en-tête
Authorization
.Créez un fichier JSON contenant les informations suivantes :
{ "bindings":[ { "role": "roles/storage.objectViewer", "members":["allUsers"] } ] }
Utilisez
cURL
pour appeler l'API JSON avec une requêtePUT
Bucket :curl -X PUT --data-binary @JSON_FILE_NAME \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ -H "Content-Type: application/json" \ "https://storage.googleapis.com/storage/v1/b/BUCKET_NAME/iam"
Où :
JSON_FILE_NAME
correspond au chemin d'accès au fichier JSON que vous avez créé à l'étape 2.BUCKET_NAME
est le nom du bucket dont vous souhaitez rendre les objets publics. Exemple :my-bucket
.
API XML
L'API XML ne permet pas de rendre tous les objets d'un bucket lisibles publiquement. Utilisez plutôt la console Google Cloud ou gcloud storage
.
Si vous le souhaitez, vous pouvez également rendre certaines parties de votre bucket accessibles au public.
Les visiteurs reçoivent un code de réponse http 403
lorsqu'ils demandent l'URL d'un fichier non public ou inexistant. Consultez la section suivante pour savoir comment ajouter une page d'erreur utilisant un code de réponse http 404
.
Attribuer des pages spécialisées (recommandé)
Vous pouvez attribuer un suffixe de page d'index contrôlé par la propriété MainPageSuffix
, ainsi qu'une page d'erreur personnalisée contrôlée par la propriété NotFoundPage
. Aucun de ces deux éléments n'est strictement obligatoire. Notez toutefois que si vous ne désignez pas de page d'index, aucun contenu n'est diffusé lorsque des utilisateurs accèdent à votre site de premier niveau, par exemple http://www.example.com
. Pour en savoir plus, consultez les exemples de configuration de site Web.
Dans l'exemple suivant, MainPageSuffix
est défini sur index.html
, et NotFoundPage
sur 404.html
:
Console
- Dans la console Google Cloud, accédez à la page Buckets Cloud Storage.
Dans la liste des buckets, recherchez celui que vous avez créé.
Cliquez sur le menu déroulant Bucket (more_vert) associé au bucket, puis sélectionnez Modifier la configuration du site Web.
Dans la boîte de dialogue de configuration du site Web, spécifiez la page principale et la page d'erreur.
Cliquez sur Save.
Ligne de commande
Exécutez la commande buckets update
avec les options --web-main-page-suffix
et --web-error-page
:
gcloud storage buckets update gs://www.example.com --web-main-page-suffix=index.html --web-error-page=404.html
Si la commande est bien exécutée, elle renvoie le résultat suivant :
Updating gs://www.example.com/... Completed 1
Bibliothèques clientes
C++
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage C++.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
C#
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage C#.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Go
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Go.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Java
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Java.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Node.js
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Node.js.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
PHP
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage PHP.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Python
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Python.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
Ruby
Pour en savoir plus, consultez la documentation de référence de l'API Cloud Storage en langage Ruby.
Pour vous authentifier auprès de Cloud Storage, configurez le service Identifiants par défaut de l'application. Pour en savoir plus, consultez Configurer l'authentification pour un environnement de développement local.
API REST
API JSON
Vous devez installer et initialiser gcloud CLI afin de générer un jeton d'accès pour l'en-tête
Authorization
.Vous pouvez également créer un jeton d'accès à l'aide d'OAuth 2.0 Playground et l'inclure dans l'en-tête
Authorization
.Créez un fichier JSON qui définit les propriétés
mainPageSuffix
etnotFoundPage
d'un objetwebsite
sur les pages souhaitées :{ "website":{ "mainPageSuffix": "index.html", "notFoundPage": "404.html" } }
Exécutez
cURL
pour appeler l'API JSON avec une requête de bucketPATCH
. Pour www.example.com, procédez comme suit :curl -X PATCH --data-binary @web-config.json \ -H "Authorization: $(gcloud auth print-access-token)" \ -H "Content-Type: application/json" \ "https://storage.googleapis.com/storage/v1/b/www.example.com"
API XML
Vous devez installer et initialiser gcloud CLI afin de générer un jeton d'accès pour l'en-tête
Authorization
.Vous pouvez également créer un jeton d'accès à l'aide d'OAuth 2.0 Playground et l'inclure dans l'en-tête
Authorization
.Créez un fichier XML qui définit les éléments
MainPageSuffix
etNotFoundPage
d'un élémentWebsiteConfiguration
sur les pages souhaitées :<WebsiteConfiguration> <MainPageSuffix>index.html</MainPageSuffix> <NotFoundPage>404.html</NotFoundPage> </WebsiteConfiguration>
Utilisez
cURL
pour appeler l'API XML avec une requête de bucketPUT
et un paramètre de chaîne de requêtewebsiteConfig
. Pour www.example.com, procédez comme suit :curl -X PUT --data-binary @web-config.xml \ -H "Authorization: $(gcloud auth print-access-token)" \ https://storage.googleapis.com/www.example.com?websiteConfig
Tester le site Web
Vérifiez que le contenu est diffusé à partir du bucket en demandant le nom de domaine dans un navigateur. Pour ce faire, vous pouvez employer un chemin d'accès à un objet ou juste le nom de domaine, si vous définissez la propriété MainPageSuffix
.
Par exemple, si vous avez un objet nommé test.html
stocké dans un bucket nommé www.example.com
, vous pouvez vérifier qu'il est accessible en vous rendant sur la page www.example.com/test.html
à l'aide de votre navigateur.
Effectuer un nettoyage
Une fois le tutoriel terminé, vous pouvez procéder au nettoyage des ressources que vous avez créées afin qu'elles ne soient plus comptabilisées dans votre quota et qu'elles ne vous soient plus facturées. Dans les sections suivantes, nous allons voir comment supprimer ou désactiver ces ressources.
Supprimer le projet
Le moyen le plus simple d'empêcher la facturation est de supprimer le projet que vous avez créé pour ce tutoriel.
Pour supprimer le projet :
- In the Google Cloud console, go to the Manage resources page.
- In the project list, select the project that you want to delete, and then click Delete.
- In the dialog, type the project ID, and then click Shut down to delete the project.
Étape suivante
- Consultez des exemples et des conseils relatifs à l'utilisation de buckets pour héberger un site Web statique.
- Consultez la section de la page "Dépannage" concernant l'hébergement d'un site Web statique.
- Apprenez-en plus sur l'hébergement d'éléments statiques pour un site Web dynamique.
- Découvrez toutes les options de diffusion Web.
- Suivez d'autres tutoriels Google Cloud qui utilisent Cloud Storage.