Object Storage - Téléversement de fichiers depuis le navigateur via HTTP POST

Objectif

Ce guide explique comment implémenter des téléversements de fichiers directement depuis le navigateur vers OVHcloud Object Storage en utilisant la méthode HTTP POST, avec génération d'une POST Policy côté serveur et authentification SigV4.

Prérequis

• Disposer d'un projet Public Cloud dans votre compte OVHcloud
• Avoir créé un utilisateur Object Storage
• Avoir installé et configuré AWS CLI

En pratique

Présentation

Les téléversements POST depuis le navigateur permettent aux applications web d'autoriser les utilisateurs finaux à téléverser des fichiers directement dans un bucket OVHcloud Object Storage, sans faire transiter les données par votre serveur applicatif. Votre backend génère une politique et une signature, l'utilisateur sélectionne un fichier, et le navigateur envoie les données directement au bucket.

Le flux de téléversement comprend les étapes suivantes :

1. Votre backend génère une POST Policy (un document JSON définissant les contraintes de téléversement) et la signe avec une signature HMAC-SHA256 SigV4.
2. Votre page HTML contient un formulaire intégrant la politique, la signature et les métadonnées de l'objet sous forme de champs cachés.
3. L'utilisateur sélectionne un fichier et soumet le formulaire.
4. Le navigateur envoie la requête POST multipart/form-data directement à l'endpoint OVHcloud Object Storage.
5. OVHcloud valide la politique, vérifie la signature et stocke l'objet.
6. Le navigateur reçoit une réponse : une redirection HTTP ou un code de statut selon la configuration du formulaire.

# virtual-hosted style
https://<nom_bucket>.s3.<region>.io.cloud.ovh.net/

# path style
https://s3.<region>.io.cloud.ovh.net/<nom_bucket>

Les objets écrits via POST sont immédiatement visibles dans le bucket (cohérence forte en lecture après écriture). La taille maximale d'objet par téléversement POST est de 5 Go.

Configurer le CORS du bucket

Les téléversements POST depuis le navigateur déclenchent toujours une requête de pré-vérification CORS (OPTIONS) avant tout envoi de données. Sans règle CORS correspondante sur le bucket, le navigateur bloque silencieusement le téléversement.

Enregistrez le JSON suivant dans un fichier nommé cors.json :

{
  "CORSRules": [
    {
      "AllowedOrigins": ["https://votre-application.com"],
      "AllowedMethods": ["POST"],
      "AllowedHeaders": ["*"],
      "ExposeHeaders": ["ETag", "x-amz-version-id"],
      "MaxAgeSeconds": 3000
    }
  ]
}

Puis appliquez-le à votre bucket :

aws s3api put-bucket-cors --bucket <nom_bucket> --cors-configuration file://cors.json

Explications :

• --bucket <nom_bucket> : remplacez par le nom de votre bucket.
• --cors-configuration file://cors.json : chemin vers le fichier de configuration CORS.

Générer la POST Policy

La POST Policy est un document JSON UTF-8 généré côté serveur. Elle définit les contraintes qu'OVHcloud valide avant d'accepter le téléversement. Le document doit être encodé en base64 avant d'être placé dans le formulaire.

Structure de la politique

{
  "expiration": "2026-07-07T12:00:00.000Z",
  "conditions": [
    {"bucket": "<nom_bucket>"},
    ["starts-with", "$key", "uploads/"],
    {"x-amz-algorithm": "AWS4-HMAC-SHA256"},
    {"x-amz-credential": "<cle_acces>/20260706/<region>/s3/aws4_request"},
    {"x-amz-date": "20260706T000000Z"},
    ["content-length-range", 1, 10485760]
  ]
}

Explications :

• expiration : horodatage ISO 8601 obligatoire en GMT. La politique est rejetée avec un HTTP 403 une fois ce délai dépassé. Évaluée par rapport à l'heure du serveur OVHcloud.
• conditions : chaque champ de formulaire inclus dans la requête (sauf x-amz-signature, file et policy lui-même) doit avoir une condition correspondante dans ce tableau.
• content-length-range : restreint la taille de fichier acceptée en octets (ici, 1 octet à 10 Mo).

Types de conditions

Conditions

Calculer la signature SigV4

La signature est calculée côté serveur en utilisant HMAC-SHA256. L'entrée de la signature est le document de politique encodé en base64.

Étape 1 - Encoder la politique

Encodez le JSON de la politique en tant que chaîne d'octets UTF-8, puis encodez ces octets en base64. La chaîne résultante est à la fois la valeur du champ de formulaire policy et l'entrée de la signature (StringToSign).

Étape 2 - Dériver la clé de signature

dateKey              = HMAC-SHA256("AWS4" + <cle_secrete>, <date>)
dateRegionKey        = HMAC-SHA256(dateKey, <region>)
dateRegionServiceKey = HMAC-SHA256(dateRegionKey, "s3")
signingKey           = HMAC-SHA256(dateRegionServiceKey, "aws4_request")

Explications :

• <cle_secrete> : la clé d'accès secrète de votre utilisateur Object Storage.
• <date> : date de signature au format YYYYMMDD (par exemple : 20260706). Doit se situer dans un intervalle de 7 jours par rapport à la date actuelle du serveur OVHcloud.
• <region> : identifiant de région OVHcloud (par exemple : gra, rbx, bhs). Doit correspondre à la région utilisée dans x-amz-credential.
• Les entrées et sorties de HMAC-SHA256 sont des octets bruts, pas des chaînes hexadécimales, à chaque étape intermédiaire.

Étape 3 - Calculer la signature

signature = hex( HMAC-SHA256(signingKey, StringToSign) )

Le résultat est une chaîne hexadécimale en minuscules. Utilisez cette valeur comme champ de formulaire x-amz-signature.

Construire le formulaire HTML de téléversement

Le formulaire de téléversement doit utiliser method="POST" et enctype="multipart/form-data". L'attribut action doit être l'URL du bucket au format virtual-hosted.

Exemple de formulaire

<form action="https://<nom_bucket>.s3.<region>.io.cloud.ovh.net/"
      method="POST"
      enctype="multipart/form-data">

  <!-- Champs d'authentification requis -->
  <input type="hidden" name="key"               value="uploads/${filename}">
  <input type="hidden" name="policy"            value="<politique_encodee_base64>">
  <input type="hidden" name="x-amz-algorithm"  value="AWS4-HMAC-SHA256">
  <input type="hidden" name="x-amz-credential" value="<cle_acces>/20260706/<region>/s3/aws4_request">
  <input type="hidden" name="x-amz-date"       value="20260706T000000Z">
  <input type="hidden" name="x-amz-signature"  value="<signature_hex>">

  <!-- Champs optionnels (exemples) -->
  <input type="hidden" name="Content-Type"              value="image/jpeg">
  <input type="hidden" name="success_action_status"     value="201">
  <input type="hidden" name="x-amz-meta-uploaded-by"   value="utilisateur-123">

  <!-- Le champ file doit toujours être en dernier -->
  <input type="file" name="file">
  <button type="submit">Téléverser</button>
</form>

Champs de formulaire requis

Champs de formulaire optionnels

Gérer les réponses

Réponses de succès

Si success_action_redirect est défini et que le téléversement réussit, le navigateur est redirigé vers cette URL. Les paramètres de requête bucket, key et etag sont ajoutés automatiquement. success_action_redirect a la priorité sur success_action_status lorsque les deux champs sont présents.

Réponses d'erreur

En cas d'échec, OVHcloud retourne un corps d'erreur XML compatible S3 :

<Error>
  <Code>AccessDenied</Code>
  <Message>...</Message>
  <RequestId>...</RequestId>
</Error>

Conditions d'erreur courantes :

Chiffrement côté serveur (SSE)

SSE-S3 - Clé gérée par OVHcloud

Pour demander un chiffrement côté serveur avec une clé AES-256 gérée par OVHcloud, ajoutez le champ caché suivant au formulaire :

Ajoutez la condition correspondante à la POST Policy :

{"x-amz-server-side-encryption": "AES256"}

SSE-C - Clé fournie par le client

Pour chiffrer l'objet avec une clé que vous fournissez, ajoutez les trois champs suivants au formulaire. Tous les trois doivent avoir des conditions correspondantes dans la POST Policy.

Comportement avec le versioning

L'état du versioning du bucket cible affecte la réponse au téléversement :

Pour plus d'informations, consultez le guide « Object Storage - Premiers pas avec la gestion de versions ».

Aller plus loin

Pour une formation ou une assistance technique sur la mise en œuvre de nos solutions, contactez votre commercial ou consultez la page Professional Services pour obtenir un devis et faire analyser votre projet par nos experts.

Échangez avec notre communauté d'utilisateurs.

¹ : S3 est une marque déposée appartenant à Amazon Technologies, Inc. Les services de OVHcloud ne sont pas sponsorisés, approuvés, ou affiliés de quelque manière que ce soit.