Konvertieren Sie die UTC-Datums- und Uhrzeitangabe in die lokale Datums- und Uhrzeitangabe


336

Vom Server erhalte ich eine datetime-Variable in diesem Format: 6/29/2011 4:52:48 PMund sie ist in UTC-Zeit. Ich möchte es mit JavaScript in die Browserzeit des aktuellen Benutzers konvertieren.

Wie geht das mit JavaScript oder jQuery?



1
Achtung. Das ist ein seltsames Datumsformat. Geben Sie es daher in der von Ihnen verwendeten Lösung an. Wenn möglich, lassen Sie den Server das Datum im ISO-Format senden.
Michael Scheper

Antworten:


402

Fügen Sie 'UTC' an die Zeichenfolge an, bevor Sie sie in ein Datum in Javascript konvertieren:

var date = new Date('6/29/2011 4:52:48 PM UTC');
date.toString() // "Wed Jun 29 2011 09:52:48 GMT-0700 (PDT)"

5
Funktion localizeDateStr (date_to_convert_str) {var date_to_convert = neues Datum (date_to_convert_str); var local_date = new Date (); date_to_convert.setHours (date_to_convert.getHours () + local_date.getTimezoneOffset ()); return date_to_convert.toString (); }
Matt

4
@matt offSet gibt Minuten zurück, nicht Stunden, Sie müssen durch 60 teilen
bladefist

50
Dies setzt voraus, dass der Datumsteil der Zeichenfolge dem US-Standard MM / TT / JJJJ entspricht, was in Europa und anderen Teilen der Welt offensichtlich nicht der Fall ist.
AsGoodAsItGets

7
@digitalbath Funktioniert unter Chrome, aber nicht unter Firefox.
Ganesh Satpute


137

Aus meiner Sicht sollten Server im Allgemeinen immer eine Datums- / Uhrzeitangabe im standardisierten ISO 8601-Format zurückgeben .

Mehr Infos hier:

In diesem Fall würde der Server zurückkehren, '2011-06-29T16:52:48.000Z'der direkt in das JS Date-Objekt eingespeist würde .

var utcDate = '2011-06-29T16:52:48.000Z';  // ISO-8601 formatted date returned from server
var localDate = new Date(utcDate);

Das localDatewird in der richtigen Ortszeit sein, die in meinem Fall zwei Stunden später sein würde (DK-Zeit).

Sie müssen wirklich nicht all diese Analysen durchführen, was die Dinge nur kompliziert macht, solange Sie mit dem Format übereinstimmen, das Sie vom Server erwarten können.


1
Wie bekomme ich das Datum im ISO-Format? Ich bekomme Datum im UTC-Format mit UTC an das Ende angehängt
Deepika

8
@Colin das ist sprachabhängig. In C # können Sie ein DateTimeObjekt .toString("o")formatieren, mit dem eine ISO-8601-formatierte Zeichenfolge wie oben gezeigt zurückgegeben wird. msdn.microsoft.com/en-us/library/zdtaw1bw(v=vs.110).aspx In Javascript ist es new Date().toISOString(). developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Hulvej

98

Dies ist eine universelle Lösung:

function convertUTCDateToLocalDate(date) {
    var newDate = new Date(date.getTime()+date.getTimezoneOffset()*60*1000);

    var offset = date.getTimezoneOffset() / 60;
    var hours = date.getHours();

    newDate.setHours(hours - offset);

    return newDate;   
}

Verwendungszweck:

var date = convertUTCDateToLocalDate(new Date(date_string_you_received));

Zeigen Sie das Datum basierend auf der lokalen Clienteinstellung an:

date.toLocaleString();

41
Funktioniert nicht mit allen Zeitzonen. Es gibt einen guten Grund, warum getTimeZoneOffset in Minuten ist! geographylists.com/list20d.html
Siukurnin

5
@ Siukurnin. Um eine seltsame Zeitzone zu verwalten, verwenden Sie newDate.setTime (date.getTime () + date.getTimezoneOffset () * 60 * 1000)
Guillaume Gendre

18
newDate.setMinutes (date.getMinutes () - date.getTimezoneOffset ()) würde ausreichen. In
korrekten

1
Ziemlich sicher, dass dies unmöglich für eine Zeitzone funktionieren kann, die 30 Minuten entfernt ist? Es scheint sich auf ganze Stunden zu runden.
NickG

2
Dies scheint auch das Datum nicht richtig einzustellen, wenn die Zeitzonenverschiebung Mitternacht überschreitet. möglicherweise, weil nur setHours verwendet wird, was das Datum nicht beeinflusst?
Uniphonic

37

Sie sollten den (UTC) Offset (in Minuten) des Clients erhalten:

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

Und dann addiert oder subtrahiert der Korrespondent die Zeit, die Sie vom Server erhalten.

Hoffe das hilft.


2
Was ist mit der Sommerzeit?
Rich

26

Für mich haben die oben genannten Lösungen nicht funktioniert.

Mit IE ist die UTC-Konvertierung von Datum und Uhrzeit in lokal wenig schwierig. Für mich ist das Datum und die Uhrzeit der Web-API '2018-02-15T05:37:26.007'und ich wollte gemäß der lokalen Zeitzone konvertieren, daher habe ich den folgenden Code in JavaScript verwendet.

var createdDateTime = new Date('2018-02-15T05:37:26.007' + 'Z');

21

Setzen Sie diese Funktion in Ihren Kopf:

<script type="text/javascript">
function localize(t)
{
  var d=new Date(t+" UTC");
  document.write(d.toString());
}
</script>

Generieren Sie dann für jedes Datum im Hauptteil Ihrer Seite Folgendes:

<script type="text/javascript">localize("6/29/2011 4:52:48 PM");</script>

Ändern Sie die folgende Zeile, um die GMT und die Zeitzone zu entfernen:

document.write(d.toString().replace(/GMT.*/g,""));

20

Das funktioniert bei mir:

function convertUTCDateToLocalDate(date) {
    var newDate = new Date(date.getTime() - date.getTimezoneOffset()*60*1000);
    return newDate;   
}

10

Nachdem ich einige andere hier ohne gute Ergebnisse ausprobiert hatte, schien dies für mich zu funktionieren:

convertUTCDateToLocalDate: function (date) {
    return new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(),  date.getHours(), date.getMinutes(), date.getSeconds()));
}

Und dies funktioniert in umgekehrter Richtung, vom lokalen Datum bis zur UTC:

convertLocalDatetoUTCDate: function(date){
    return new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(),  date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds());
}

1
Weniger Code zu verwenden new Date(+date + date.getTimezoneOffset() * 6e4). ;-)
RobG

es wird nicht funktionieren, meine Zeit in utc ist "2020-04-02T11: 09: 00", also habe ich es aus Singapur versucht, neues Datum (+ neues Datum ("2020-04-02T11: 09: 00") + neues Datum ( "2020-04-02T11: 09: 00"). GetTimezoneOffset () * 6e4), falsche Zeit angegeben
AhammadaliPK

dies funktionierte, neues Datum ("2020-04-02T11: 09: 00" + 'Z');
AhammadaliPK

10

Fügen Sie am Ende die Zeitzone hinzu, in diesem Fall 'UTC':

theDate = new Date( Date.parse('6/29/2011 4:52:48 PM UTC'));

Verwenden Sie danach die Funktionsfamilien toLocale () * , um das Datum im richtigen Gebietsschema anzuzeigen

theDate.toLocaleString();  // "6/29/2011, 9:52:48 AM"
theDate.toLocaleTimeString();  // "9:52:48 AM"
theDate.toLocaleDateString();  // "6/29/2011"

9

In Matts Antwort fehlt die Tatsache, dass die Sommerzeit zwischen Date () und der Datumszeit, die konvertiert werden muss, unterschiedlich sein kann - hier ist meine Lösung:

    function ConvertUTCTimeToLocalTime(UTCDateString)
    {
        var convertdLocalTime = new Date(UTCDateString);

        var hourOffset = convertdLocalTime.getTimezoneOffset() / 60;

        convertdLocalTime.setHours( convertdLocalTime.getHours() + hourOffset ); 

        return convertdLocalTime;
    }

Und die Ergebnisse im Debugger:

UTCDateString: "2014-02-26T00:00:00"
convertdLocalTime: Wed Feb 26 2014 00:00:00 GMT-0800 (Pacific Standard Time)

9

Verwenden Sie diese Option für die UTC- und Ortszeitkonvertierung und umgekehrt.

//Covert datetime by GMT offset 
//If toUTC is true then return UTC time other wise return local time
function convertLocalDateToUTCDate(date, toUTC) {
    date = new Date(date);
    //Local time converted to UTC
    console.log("Time: " + date);
    var localOffset = date.getTimezoneOffset() * 60000;
    var localTime = date.getTime();
    if (toUTC) {
        date = localTime + localOffset;
    } else {
        date = localTime - localOffset;
    }
    date = new Date(date);
    console.log("Converted time: " + date);
    return date;
}

3
Was geschah zur Zeit der Sommerzeit? MEZ Zeitzone
NovusMobile


9

Dies ist eine vereinfachte Lösung, die auf der Antwort von Adorjan Princ basiert:

function convertUTCDateToLocalDate(date) {
    var newDate = new Date(date);
    newDate.setMinutes(date.getMinutes() - date.getTimezoneOffset());
    return newDate;
}

Verwendungszweck:

var date = convertUTCDateToLocalDate(new Date(date_string_you_received));

Warum wurde dies am 9. Oktober 2017 abgelehnt? Bitte schreibe einen Kommentar, damit ich deine Meinung verstehen kann.
Huha

9

Wenn Sie nichts dagegen haben moment.jsund Ihre Zeit in UTC ist, verwenden Sie einfach Folgendes:

moment.utc('6/29/2011 4:52:48 PM').toDate();

Wenn Ihre Zeit nicht in utc, sondern in einem anderen Ihnen bekannten Gebietsschema angegeben ist, verwenden Sie Folgendes:

moment('6/29/2011 4:52:48 PM', 'MM-DD-YYYY', 'fr').toDate();

Wenn Ihre Zeit bereits lokal ist, verwenden Sie Folgendes:

moment('6/29/2011 4:52:48 PM', 'MM-DD-YYYY');

5

Für mich schien das einfachste zu verwenden

datetime.setUTCHours(datetime.getHours());
datetime.setUTCMinutes(datetime.getMinutes());

(Ich dachte, die erste Zeile könnte ausreichen, aber es gibt Zeitzonen, die in Bruchteilen von Stunden ausgeschaltet sind.)


Hat jemand irgendwelche Probleme damit? Dies scheint mir die beste Option zu sein. Ich habe eine UTC-Zeichenfolge mit "(UTC)" am Ende genommen, sie mit einem Datumsobjekt eingerichtet new Date('date string')und dann diese beiden Zeilen hinzugefügt, und sie scheint mit einer Zeit zurückzukehren, die vollständig vom UTC-Zeitstempel des Servers abhängt mit Anpassungen, die vorgenommen wurden, um sie an die Ortszeit des Benutzers anzupassen. Ich muss mir auch Sorgen um die seltsamen Zeitzonen von Bruchteilen einer Stunde machen ... Ich bin mir nicht sicher, ob es die ganze Zeit perfekt hält ...
Tyler

versuchte viele andere Optionen, keine von ihnen funktionierte, aber das funktioniert
Sameera K

5

Eine JSON-Datumszeichenfolge (in C # serialisiert) sieht aus wie "2015-10-13T18: 58: 17".

Im Winkel (nach Hulvej) machen Sie einen localdateFilter:

myFilters.filter('localdate', function () {
    return function(input) {
        var date = new Date(input + '.000Z');
        return date;
    };
})

Zeigen Sie dann die Ortszeit wie folgt an:

{{order.createDate | localdate | date : 'MMM d, y h:mm a' }}

3

Mit YYYY-MM-DD hh:mm:ssFormat:

var date = new Date('2011-06-29T16:52:48+00:00');
date.toString() // "Wed Jun 29 2011 09:52:48 GMT-0700 (PDT)"

Stellen Sie beim Konvertieren aus dem YYYY-MM-DD hh:mm:ssFormat sicher, dass Ihr Datum dem ISO 8601-Format entspricht .

Year: 
    YYYY (eg 1997)    
Year and month: 
    YYYY-MM (eg 1997-07)
Complete date: 
    YYYY-MM-DD (eg 1997-07-16)
Complete date plus hours and minutes:
    YYYY-MM-DDThh:mmTZD (eg 1997-07-16T19:20+01:00)    
Complete date plus   hours, minutes and seconds:
    YYYY-MM-DDThh:mm:ssTZD (eg 1997-07-16T19:20:30+01:00)    
Complete date plus hours, minutes, seconds and a decimal fraction of a second
    YYYY-MM-DDThh:mm:ss.sTZD (eg 1997-07-16T19:20:30.45+01:00) where:

YYYY = four-digit year
MM   = two-digit month (01=January, etc.)
DD   = two-digit day of month (01 through 31)
hh   = two digits of hour (00 through 23) (am/pm NOT allowed)
mm   = two digits of minute (00 through 59)
ss   = two digits of second (00 through 59)
s    = one or more digits representing a decimal fraction of a second
TZD  = time zone designator (Z or +hh:mm or -hh:mm)

Wichtige Dinge zu beachten

  1. Sie müssen Datum und Uhrzeit durch a trennen. TIn einigen Browsern funktioniert ein Leerzeichen nicht
  2. Sie müssen die Zeitzone in diesem Format einstellen. Die +hh:mmVerwendung einer Zeichenfolge für eine Zeitzone (Beispiel: 'UTC') funktioniert in vielen Browsern nicht. +hh:mmstellen den Versatz von der UTC-Zeitzone dar.

3

@Adorojan'sAntwort ist fast richtig. Das Hinzufügen des Versatzes ist jedoch nicht korrekt, da der Versatzwert negativ ist, wenn das Browserdatum vor GMT liegt und umgekehrt. Nachfolgend finden Sie die Lösung, mit der ich gekommen bin und die für mich einwandfrei funktioniert:

// Input time in UTC
var inputInUtc = "6/29/2011 4:52:48";

var dateInUtc = new Date(Date.parse(inputInUtc+" UTC"));
//Print date in UTC time
document.write("Date in UTC : " + dateInUtc.toISOString()+"<br>");

var dateInLocalTz = convertUtcToLocalTz(dateInUtc);
//Print date in local time
document.write("Date in Local : " + dateInLocalTz.toISOString());

function convertUtcToLocalTz(dateInUtc) {
		//Convert to local timezone
		return new Date(dateInUtc.getTime() - dateInUtc.getTimezoneOffset()*60*1000);
}


3

Für mich funktioniert das gut

if (typeof date === "number") {
  time = new Date(date).toLocaleString();
  } else if (typeof date === "string"){
  time = new Date(`${date} UTC`).toLocaleString();
}

2

Ich beantworte dies, wenn jemand eine Funktion möchte, die die konvertierte Zeit in ein bestimmtes ID-Element anzeigt und die Datumsformatzeichenfolge JJJJ-MM-TT anwendet. Hier ist Datum1 Zeichenfolge und IDs ist die ID des Elements, das zu dieser Zeit angezeigt wird.

function convertUTCDateToLocalDate(date1, ids) 
{
  var newDate = new Date();
  var ary = date1.split(" ");
  var ary2 = ary[0].split("-");
  var ary1 = ary[1].split(":");
  var month_short = Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec');
  newDate.setUTCHours(parseInt(ary1[0]));
  newDate.setUTCMinutes(ary1[1]);
  newDate.setUTCSeconds(ary1[2]);
  newDate.setUTCFullYear(ary2[0]);
  newDate.setUTCMonth(ary2[1]);
  newDate.setUTCDate(ary2[2]);
  ids = document.getElementById(ids);
  ids.innerHTML = " " + newDate.getDate() + "-" + month_short[newDate.getMonth() - 1] + "-" + newDate.getFullYear() + " " + newDate.getHours() + ":" + newDate.getMinutes() + ":" + newDate.getSeconds();
            }

Ich weiß, dass die Antwort bereits akzeptiert wurde, aber ich komme wegen Google hierher und habe sie gelöst, indem ich mich von der akzeptierten Antwort inspirieren ließ, also wollte ich sie nur teilen, wenn jemand sie braucht.


1

Basierend auf der Antwort von @digitalbath gibt es hier eine kleine Funktion zum Abrufen des UTC-Zeitstempels und zum Anzeigen der Ortszeit in einem bestimmten DOM-Element (unter Verwendung von jQuery für diesen letzten Teil):

https://jsfiddle.net/moriz/6ktb4sv8/1/

<div id="eventTimestamp" class="timeStamp">
   </div>
   <script type="text/javascript">
   // Convert UTC timestamp to local time and display in specified DOM element
   function convertAndDisplayUTCtime(date,hour,minutes,elementID) {
    var eventDate = new Date(''+date+' '+hour+':'+minutes+':00 UTC');
    eventDate.toString();
    $('#'+elementID).html(eventDate);
   }
   convertAndDisplayUTCtime('06/03/2015',16,32,'eventTimestamp');
   </script>

0

Ich habe ein nettes kleines Skript geschrieben, das eine UTC-Epoche nimmt und es in die Zeitzone des Client-Systems konvertiert und im Format d / m / YH: i: s (wie die PHP-Datumsfunktion) zurückgibt:

getTimezoneDate = function ( e ) {

    function p(s) { return (s < 10) ? '0' + s : s; }        

    var t = new Date(0);
    t.setUTCSeconds(e);

    var d = p(t.getDate()), 
        m = p(t.getMonth()+1), 
        Y = p(t.getFullYear()),
        H = p(t.getHours()), 
        i = p(t.getMinutes()), 
        s = p(t.getSeconds());

    d =  [d, m, Y].join('/') + ' ' + [H, i, s].join(':');

    return d;

};

0

Sie können momentjs verwenden , moment(date).format()das Ergebnis wird immer im lokalen Datum angegeben .

Bonus , Sie können nach Belieben formatieren. Zum Beispiel.

moment().format('MMMM Do YYYY, h:mm:ss a'); // September 14th 2018, 12:51:03 pm
moment().format('dddd');                    // Friday
moment().format("MMM Do YY"); 

Weitere Informationen finden Sie auf der Website von Moment js


0

Sie können dies mit der Datei moment.js erledigen .

Es ist einfach, Sie haben gerade den Ort der Zeitzone erwähnt.

Beispiel: Wenn Sie Ihre Datums- und Uhrzeitangabe in die Zeitzone Asien / Kolkata konvertieren möchten, müssen Sie nur den Namen des Zeitzonenorts angeben , der aus moment.js erhalten wurde

var UTCDateTime="Your date obtained from UTC";
var ISTleadTime=(moment.tz(UTCDateTime, "Africa/Abidjan")).tz("Asia/Kolkata").format('YYYY-MM-DD LT');


0

Ich habe eine Funktion erstellt, die alle Zeitzonen in Ortszeit konvertiert.

Ich habe getTimezoneOffset () nicht verwendet, da kein korrekter Offsetwert zurückgegeben wird

Bedarf:

1. npm i moment-timezone

function utcToLocal(utcdateTime, tz) {
    var zone = moment.tz(tz).format("Z") // Actual zone value e:g +5:30
    var zoneValue = zone.replace(/[^0-9: ]/g, "") // Zone value without + - chars
    var operator = zone && zone.split("") && zone.split("")[0] === "-" ? "-" : "+" // operator for addition subtraction
    var localDateTime
    var hours = zoneValue.split(":")[0]
    var minutes = zoneValue.split(":")[1]
    if (operator === "-") {
        localDateTime = moment(utcdateTime).subtract(hours, "hours").subtract(minutes, "minutes").format("YYYY-MM-DD HH:mm:ss")
    } else if (operator) {
        localDateTime = moment(utcdateTime).add(hours, "hours").add(minutes, "minutes").format("YYYY-MM-DD HH:mm:ss")
    } else {
        localDateTime = "Invalid Timezone Operator"
    }
    return localDateTime
}

utcToLocal("2019-11-14 07:15:37", "Asia/Kolkata")

//Returns "2019-11-14 12:45:37"

0

In meinem Fall musste ich die Datumsdifferenz in Sekunden ermitteln. Das Datum war eine UTC-Datumszeichenfolge, daher habe ich es in ein lokales Datumsobjekt konvertiert. Das habe ich getan:

let utc1 = new Date();
let utc2 = null;
const dateForCompare = new Date(valueFromServer);
dateForCompare.setTime(dateForCompare.getTime() - dateForCompare.getTimezoneOffset() * 
 60000);
utc2 = dateForCompare;

const seconds = Math.floor(utc1 - utc2) / 1000;

-1
function getUTC(str) {
    var arr = str.split(/[- :]/);
    var utc = new Date(arr[0], arr[1]-1, arr[2], arr[3], arr[4], arr[5]);
    utc.setTime(utc.getTime() - utc.getTimezoneOffset()*60*1000)
    return utc;
}

Für andere Besucher - Verwenden Sie diese Funktion, um ein lokales Datumsobjekt aus einer UTC-Zeichenfolge abzurufen. Sie sollten sich um die Sommerzeit kümmern und funktionieren mit IE, IPhone usw.

Wir teilen die Zeichenfolge (da die JS-Datumsanalyse in einigen Browsern nicht unterstützt wird). Wir erhalten einen Unterschied zur UTC und subtrahieren ihn von der UTC-Zeit, die uns die Ortszeit gibt. Da der zurückgegebene Offset mit der Sommerzeit berechnet wird (korrigieren Sie mich, wenn ich falsch liege), wird diese Zeit in der Variablen "utc" zurückgesetzt. Geben Sie schließlich das Datumsobjekt zurück.


-1

In Angular habe ich Bens Antwort folgendermaßen verwendet:

$scope.convert = function (thedate) {
    var tempstr = thedate.toString();
    var newstr = tempstr.toString().replace(/GMT.*/g, "");
    newstr = newstr + " UTC";
    return new Date(newstr);
};

Bearbeiten: Angular 1.3.0 hat dem Datumsfilter UTC-Unterstützung hinzugefügt. Ich habe es noch nicht verwendet, aber es sollte einfacher sein. Hier ist das Format:

{{ date_expression | date : format : timezone}}

Angular 1.4.3 Date API

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.