关于javascript：将UTC日期时间转换为本地日期时间


Convert UTC date time to local date time

从服务器中，我得到一个日期时间变量，格式是：6/29/2011 4:52:48 PM，它的格式是UTC时间。我想使用javascript将其转换为当前用户的浏览器时间。

如何使用javascript或jquery来实现这一点？

相关讨论

在将字符串转换为javascript中的日期之前，将"utc"附加到该字符串：

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

在我看来，一般情况下，服务器应该始终以标准化的ISO 8601格式返回日期时间。

更多信息在这里：

  • http://www.w3.org/tr/note-datetime
  • https://en.wikipedia.org/wiki/iso_

在这种情况下，服务器将返回'2011-06-29T16:52:48.000Z'，它将直接馈送到JS日期对象中。

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

localDate将在正确的当地时间，在我的例子中是两小时后(dk时间)。

只要您与服务器期望的格式保持一致，就不必进行所有这些分析，因为它们只会使事情变得复杂。

相关讨论

这是一个通用的解决方案：

1
2
3
4
5
6
7
8
9
10
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;  
}

用途：

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

根据客户端本地设置显示日期：

1
date.toLocaleString();
相关讨论

您应该获得客户机的(UTC)偏移量(分钟)：

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

然后对从服务器得到的时间进行相应的加或减。

希望这有帮助。

把这个功能放在你的头脑里：

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

然后为页面正文中的每个日期生成以下内容：

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

要删除GMT和时区，请更改以下行：

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

对我来说，以上的解决方案不起作用。

使用IE，将UTC日期时间转换为本地时间有点困难。对于我来说，来自Web API的日期时间是'2018-02-15T05:37:26.007'，我想根据本地时区进行转换，所以我在javascript中使用了下面的代码。

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

在尝试了其他几篇没有好结果的文章后，我觉得这是可行的：

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

这与从当地日期到UTC的相反：

1
2
3
convertLocalDatetoUTCDate: function(date){
    return new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(),  date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds());
}
相关讨论

将其用于UTC和本地时间转换，反之亦然。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//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;
}
相关讨论

这对我很有用：

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

如果您不介意使用OCx1(8)，并且您的时间是UTC，请使用以下内容：

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

如果您的时间不是以UTC为单位，而是您知道的任何其他区域设置，请使用以下内容：

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

如果您的时间已经在本地，请使用以下选项：

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

Matt的答案缺少这样一个事实：在date()和它需要转换的日期时间之间，夏令时可能是不同的，这是我的解决方案：

1
2
3
4
5
6
7
8
9
10
    function ConvertUTCTimeToLocalTime(UTCDateString)
    {
        var convertdLocalTime = new Date(UTCDateString);

        var hourOffset = convertdLocalTime.getTimezoneOffset() / 60;

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

        return convertdLocalTime;
    }

调试器中的结果是：

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

这是一个基于Adorjan Prince答案的简化解决方案：

1
2
3
4
5
function convertUTCDateToLocalDate(date) {
    var newDate = new Date(date);
    newDate.setMinutes(date.getMinutes() - date.getTimezoneOffset());
    return newDate;
}

用途：

1
var date = convertUTCDateToLocalDate(new Date(date_string_you_received));
相关讨论

在末尾添加时区，在本例中为"UTC"：

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

之后，使用toLocale()*函数族以正确的区域设置显示日期。

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

在我看来，最简单的

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

(我原以为第一行就足够了，但有些时区在几小时内就关闭了)

相关讨论

JSON日期字符串(用C序列化)看起来像"2015-10-13t18:58:17"。

在角度上，(跟随Hulvej)制作一个localDate滤波器：

1
2
3
4
5
6
myFilters.filter('localdate', function () {
    return function(input) {
        var date = new Date(input + '.000Z');
        return date;
    };
})

然后，显示本地时间，如下所示：

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

使用YYYY-MM-DD hh:mm:ss格式：

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

要从YYYY-MM-DD hh:mm:ss格式转换，请确保日期遵循ISO 8601格式。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
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)

需要注意的重要事项

  • 必须用T分隔日期和时间，在某些浏览器中，空间将不起作用。
  • 您必须使用此格式设置时区+hh:mm，使用时区字符串(例如："utc")在许多浏览器中不起作用。+hh:mm表示与UTC时区的偏移量。

    • 如果有人想要显示转换时间到特定ID元素并应用日期格式字符串yyyy-mm-dd的函数，我会回答这个问题。这里date1是字符串，id是要显示的元素的ID。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    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();
                }

    我知道答案已经被接受了，但我之所以来到这里，是因为谷歌和我确实从接受的答案中获得了灵感，所以我确实想在有人需要的时候分享它。

    @Adorojan's的回答几乎是正确的。但添加偏移量是不正确的，因为如果浏览器日期早于格林尼治标准时间，偏移量值将为负值，反之亦然。以下是我提供的解决方案，对我来说非常有效：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    // 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()+"");

    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);
    }

    基于@digitalbath answer，这里有一个小函数来获取UTC时间戳并在给定的dom元素中显示本地时间(最后一部分使用jquery)：

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

    1
    2
    3
    4
    5
    6
    7
    8
       <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');

    对我来说，这个很管用

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

    我编写了一个很好的小脚本，它采用UTC时间段，并将其转换为客户机系统时区，并以d/m/y h:i:s(如php date函数)格式返回：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    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;

    };

    你可以用momentjs，moment(date).format()总是在本地日期给出结果。

    奖金，你可以任意格式化。例如

    1
    2
    3
    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");

    更多详情请参考Moment JS网站

    在角度上，我用本的回答：

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

    编辑：Angular 1.3.0在日期过滤器中添加了UTC支持，我还没有使用它，但应该更简单，格式如下：

    1
    {{ date_expression | date : format : timezone}}

    角度1.4.3日期API

    1
    2
    3
    4
    5
    6
    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;
    }

    对于访问的其他人-使用此函数从UTC字符串中获取本地日期对象，应注意DST，并将在IE、iPhone等上工作。

    我们拆分字符串(因为某些浏览器不支持JS日期分析)我们从UTC中得到差异，然后从UTC时间中减去它，这给了我们本地时间。因为返回的偏移量是用dst计算的(如果我错了，请纠正我)，所以它将把时间设置回变量"utc"。最后返回日期对象。