Abrufen der Zeitzone des Clients (und des Offsets) in JavaScript

Question

Wie kann ich die Zeitzoneninformationen des Besuchers erfassen?

Ich brauche beides:

1. die Zeitzone (z. B. Europa/London)
2. und die Abweichung von UTC oder GMT (z. B. UTC+01)

Answer 1

Sie können verwenden:

Moment-Zeitzone

<script src="moment.js"></script>
<script src="moment-timezone-with-data.js"></script>

// retrieve timezone by name (i.e. "America/Chicago")
moment.tz.guess();

Die Erkennung der Zeitzone im Browser ist ziemlich schwierig, da der Browser nur wenige Informationen liefert.

Moment Timezone verwendet Date.getTimezoneOffset() y Date.toString() zu einer Handvoll Zeitpunkte im laufenden Jahr, um so viele Informationen wie möglich über die Browserumgebung zu sammeln. Anschließend werden diese Informationen mit allen geladenen Zeitzonendaten verglichen und die am ehesten übereinstimmende zurückgegeben. Bei Unstimmigkeiten wird die Zeitzone mit der bevölkerungsreichsten Stadt zurückgegeben.

console.log(moment.tz.guess()); // America/Chicago

Answer 2

Ein Einzeiler, der sowohl den Offset als auch die Zeitzone liefert, ist der einfache Aufruf toTimeString() auf ein neues Datumsobjekt. Aus MDN:

El toTimeString() Methode gibt den Zeitanteil eines Datumsobjekts in menschenlesbarer Form in amerikanischem Englisch zurück.

Der Haken an der Sache ist, dass die Zeitzone nicht im IANA-Standardformat angegeben wird; sie ist etwas benutzerfreundlicher als die Angabe "Kontinent/Stadt". IANA Format. Probieren Sie es aus:

console.log(new Date().toTimeString().slice(9));
console.log(Intl.DateTimeFormat().resolvedOptions().timeZone);
console.log(new Date().getTimezoneOffset() / -60);

In Kalifornien gerade jetzt, toTimeString() gibt zurück. Pacific Daylight Time während die Intl API Folgendes zurückgibt America/Los_Angeles . In Kolumbien würden Sie Colombia Standard Time gegen. America/Bogota .

Beachten Sie, dass viele andere Antworten auf diese Frage versuchen, die gleichen Informationen durch den Aufruf von Date.toString() zu erhalten. Dieser Ansatz ist nicht sehr zuverlässig, da MDN erklärt :

Datumsinstanzen beziehen sich auf einen bestimmten Zeitpunkt. Der Aufruf von toString() gibt das Datum in einer für Menschen lesbaren Form in amerikanischem Englisch zurück. [...] Manchmal ist es wünschenswert, einen String des Zeitanteils zu erhalten; so etwas kann mit der toTimeString() méthode.

El toTimeString() Methode ist besonders nützlich, weil konforme Engines, die ECMA-262 implementieren, sich in der Zeichenkette unterscheiden können, die von toString() para Date Objekte, da das Format von der Implementierung abhängt; einfache String-Slicing-Ansätze führen möglicherweise nicht zu konsistenten Ergebnissen über mehrere Engines hinweg.

Answer 3

Versuchen Sie getTimezoneOffset() der Date Objekt:

var curdate = new Date()
var offset = curdate.getTimezoneOffset()

Diese Methode gibt den Zeitzonen-Offset in Minuten zurück, d. h. die Differenz zwischen GMT und Ortszeit in Minuten.

Answer 4

JavaScript:

var d = new Date();
var n = d.getTimezoneOffset();
var timezone = n / -60;
console.log(timezone);

Answer 5

Auf diese Frage gibt es bereits mehr als 30 Antworten, aber ich bin sicher, dass es Leute gibt, die hierher kommen und wirklich nicht wissen, wonach sie suchen.

Überraschung! Sie sind dabei, ein Wespennest zu öffnen!

Ich empfehle dringend die Lektüre dieses Artikels, den ich kürzlich über die Kopfschmerzen im Umgang mit TimeZones in JS geschrieben habe! https://medium.com/@EyeDin/zeit-und-zeitzone-kopfschmerzen-im-javascript-ae4d873a665d

Wonach suchen Sie EXAKT?

Je nach Anwendungsfall benötigen Sie unterschiedliche Dinge.

---

1) Eine Möglichkeit, einen festen Zeitpunkt (z. B. den 13. November 2021 um 11:35:21 Uhr in San Francisco) in die Wanduhrzeit des Benutzers umzuwandeln, der sich irgendwo auf der Welt befinden kann.

Utilice .toLocaleString() .

Es hat mehr Anpassungsparameter für die Formatierung, als Sie sich vorstellen können, und zwar über die beiden Parameter locale y options aufgeführt unter DateTimeFormat . Es werden sogar verschiedene Kalender, Sprachen, Formatierungen von Jahr, Monat, Tag usw. unterstützt (wenn kein Parameter übergeben wird, werden die Standardeinstellungen des Benutzers verwendet, was ideal sein könnte).

Als Entwickler übergeben Sie einfach diesen Zeitpunkt (z. B. die Öffnungszeit einer Verkaufsveranstaltung oder eines Wettbewerbs) als UNIX-Zeitstempelnummer (das ist die Anzahl der Sekunden ab dem 1.1.1970 in UTC, unabhängig von Zeitzone und Sommerzeit) an den Client, und führen Sie dann new Date(timestamp).toLocaleString() . z.B. für den oben genannten Zeitpunkt ist der Wert 1636875321000 (in Millisekunden), über +dateWithTimeZone("America/Los_Angeles",2021,10,13,23,35,21) mit der Funktion aus diese Antwort .

---

2) In der Lage sein, dem Nutzer um 9 Uhr morgens seiner Ortszeit in 3 Monaten eine Benachrichtigung/E-Mail zu schicken

Dies ist eine völlig andere Anforderung! Sehr, sehr anders!

Ist GMT-8:00 nicht genug?

Nein!

Das ist nur die Zeitzone, in der sich der Benutzer zu einem bestimmten Zeitpunkt befindet, wie "jetzt, heute" .

• Woher wissen Sie, ob der Benutzer Sommerzeit hat oder nicht? (Arizona in den USA hat keine, und so viele andere Länder und Staaten und sogar Bezirke!)
• Woher wissen Sie, ob der Benutzer in der DST ist oder nicht? Ist es Winter in San Francisco (GMT-8) oder Sommer in Alaska (wieder GMT-8). Sehen Sie sich diese riesige Liste an, um auszuflippen: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones

Ist "PDT" dafür nicht ausreichend?

Nein!

Erstens gibt es die PDT nicht das ganze Jahr über. Es ist jetzt November und timeanddate.com sagt " Derzeit keine Standorte auf PDT. Würden Sie gerne PST sehen? "(Lesen Sie meinen Medium-Artikel oben für weitere Details).

Wenn Sie nicht auf die kosmetische UI-Zeichenfolge von Client zu Client abzielen, ist diese PDT/CEST/etc. nichts wert!

Warum? Weil Tijuana in Mexiko und San Francisco in den USA im Juni beide in PDT sind, aber sie haben unterschiedliche DST (Daylight Saving) Tage, an denen sie zu PST wechseln. Und das müssen Sie wissen!

Die Sommerzeit-Tage in den USA im Jahr 2022 sind Mar 13, 2022 bis Nov 6, 2022 . Mexikos Sommerzeit-Tage im Jahr 2022 sind 3. April 2022 bis 30. Oktober 2022 . Während also Tijuana und San Francisco in fast 93 % der Tage die gleiche Zeit haben, stimmen sie in 7 % der Tage (z. B. 14. März bis 3. April und 31. Oktober bis 6. November 2022) nicht überein.

Selbst wenn Sie also wissen, dass es November ist und der Nutzer sich in PDT befindet, können Sie nicht sagen, wann (welche Zeitstempelnummer) 9 Uhr morgens am 1. April 2022 im Gerät des Nutzers sein würde.

PS. Schlimmer noch, wenn Sie versuchen, das zu bekommen PDT de new Date().toString() . Zu Ihrer Information: Wenn Sie das Gebietsschema Ihres Rechners ändern a es-MX (Spanisch, das ist die Sprache von 13 % der US-Bevölkerung), so sieht das Ergebnis aus:

> new Date().toString()
'Sun Nov 14 2021 00:47:25 GMT-0800 (hora estándar del Pacífico)'

Viel Glück mit hedP ¡!

Was soll ich dann tun?

Der EINZIGE RICHTIGE WEG ist die Verwendung von IANA- (sprich "Standard-") Zeitzonenwerten. Das ist die zweite Spalte von diese Wikipedia-Seite . Es kommt von:

const timeZoneIANA = Intl.DateTimeFormat().resolvedOptions().timeZone;

Es gibt den IANA-Wert zurück, der lautet America/Los_Angeles für San Francisco. Dies ist der Wert, den Sie in Ihrer DB für den Benutzer speichern sollten, wenn überhaupt. Sie können alle Arten von Informationen über ihn unter timezones.json Paket, und konvertieren Sie eine Zeit von/nach dieser Zeitzone, plus den Tag (der wichtig ist) wie diese Antwort .

Was ist mit IE11?

Der IE11 unterstützt das nicht Intl.... Sache. Die meisten Polyfills sind nur raten es und sind ungenau. Also, versuchen Sie, Unterstützung für IE11 fallen zu lassen, oder verwenden Sie eine Bibliothek und bereiten Sie sich auf einige Ungenauigkeit.

---

3) Ich möchte nur herausfinden, in welcher Zeitzone sie sich gerade befinden (z. B. -8:00)

Das sollten Sie wahrscheinlich nicht. Ich kann mir keinen wirklichen Grund vorstellen, warum Sie das brauchen. Noch einmal: Wenn Sie diesen Wert für heute kennen, sagt das nichts darüber aus, wie dieser Wert morgen sein wird.

Auf jeden Fall können Sie diesen Wert immer erhalten, indem Sie

new Date().getTimezoneOffset() / 60

auf der Client-Seite.

HINWEIS: .getTimezoneOffset() ist NICHT der Zeitzonen-Offset des Datumsobjekts, auf dem Sie die Funktion aufrufen. Bitte lesen Sie die Dokumentation.

Um genau zu sein, nimmt es das übergebene Date-Objekt (das einen Zeitstempel hat, der sich auf einen einzelnen Zeitpunkt in der Geschichte bezieht) und sagt dann, was der Unterschied zwischen der UTC-Zeit und der Ortszeit zu diesem Zeitpunkt ist.

Auch hier kommt es auf das Datum an. Siehe:

console.log(new Date("6/13/2021").getTimezoneOffset() / 60); // It's 7 on a machine that runs in San Francisco
console.log(new Date("11/13/2021").getTimezoneOffset() / 60); // It's 8 on a machine that runs in in San Francisco

---

Gibt es Bibliotheken?

Hier ist eine Liste von Bibliotheken die den Austausch von Zeitzonen unterstützen.

Aber denken Sie daran, dass Sie zuerst das Entwurfsproblem lösen und dann nach dem Code suchen müssen. Dinge rund um die Zeitzone können leicht kompliziert werden und Sie müssen wissen, dass "PDT" und "GMT-8" NICHT das ganze Jahr über informative/wertvolle Zeitzonenwerte sind, die in der DB für den Benutzer gespeichert werden müssen. :)