Comment gérer les dates et fuseaux horaires sans bugs en JavaScript ?

Question

Mes utilisateurs sont en Haïti, au Canada et en France. Les dates d'événements s'affichent décalées d'une heure pour certains. Comment stocker et afficher correctement ?

Accepted Answer

La règle d'or : **stocker en UTC, afficher dans le fuseau de l'utilisateur**.

1. Côté serveur/BDD : enregistre des instants UTC (`timestamptz` en PostgreSQL, ISO `2026-09-26T18:00:00Z` en JSON).
2. Côté client : formate avec `Intl.DateTimeFormat`, qui connaît les règles d'heure d'été :

```js
const d = new Date('2026-09-26T18:00:00Z');
new Intl.DateTimeFormat('fr-HT', {
  dateStyle: 'full', timeStyle: 'short', timeZone: 'America/Port-au-Prince',
}).format(d);
```

3. Pour un événement physique (« 18h à Port-au-Prince »), stocke aussi le **fuseau IANA** de l'événement (`America/Port-au-Prince`). Sinon, un changement d'heure d'été décale l'heure affichée.

Évite `new Date('2026-09-26')` sans heure : c'est interprété en UTC, et ça affiche le jour précédent à l'ouest de Greenwich. L'API `Temporal` règle ces problèmes proprement là où elle est disponible.

1 réponse