Ubah waktu tanggal UTC menjadi waktu tanggal lokal


337

Dari server saya mendapatkan variabel datetime dalam format ini: 6/29/2011 4:52:48 PMdan itu dalam waktu UTC. Saya ingin mengubahnya menjadi waktu browser pengguna saat ini menggunakan JavaScript.

Bagaimana ini bisa dilakukan menggunakan JavaScript atau jQuery?



1
Hati-hati. Itu format tanggal yang aneh, jadi pastikan untuk menentukannya dalam solusi apa pun yang Anda gunakan. Jika memungkinkan, minta server untuk mengirim tanggal dalam format ISO.
Michael Scheper

Jawaban:


404

Tambahkan 'UTC' ke string sebelum mengubahnya menjadi tanggal dalam javascript:

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
function localizeDateStr (date_to_convert_str) {var date_to_convert = Tanggal baru (date_to_convert_str); var local_date = Tanggal baru (); date_to_convert.setHours (date_to_convert.getHours () + local_date.getTimezoneOffset ()); return date_to_convert.toString (); }
matt

4
@matt offSet mengembalikan menit, bukan jam, Anda perlu membagi dengan 60
bladefist

50
Ini mengasumsikan bahwa bagian tanggal dari string mengikuti standar AS, mm / dd / YYYY, yang tidak jelas terjadi di Eropa dan di bagian lain dunia.
AsGoodAsItGets

7
@ digitalbath Bekerja di Chrome tetapi tidak berfungsi di Firefox.
Ganesh Satpute


138

Dalam pandangan saya server harus selalu dalam kasus umum mengembalikan datetime dalam format ISO 8601 standar .

Info lebih lanjut di sini:

Dalam hal ini server akan mengembalikan '2011-06-29T16:52:48.000Z'yang akan memberi makan langsung ke objek Tanggal JS.

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

Itu localDateakan berada di waktu lokal yang tepat yang dalam kasus saya akan dua jam kemudian (waktu DK).

Anda benar - benar tidak perlu melakukan semua penguraian ini yang hanya mempersulit barang, selama Anda konsisten dengan format apa yang diharapkan dari server.


1
bagaimana cara mendapatkan tanggal format iso? saya mendapatkan tanggal dalam format UTC dengan UTC ditambahkan sampai akhir
Deepika

8
@Colin itu tergantung bahasa. Dalam C # Anda dapat memformat DateTimeobjek .toString("o")yang mengembalikan string berformat ISO-8601 seperti yang ditunjukkan di atas. msdn.microsoft.com/en-us/library/zdtaw1bw(v=vs.110).aspx Dalam javascript itu new Date().toISOString(). developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Hulvej

99

Ini adalah solusi universal:

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

Pemakaian:

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

Tampilkan tanggal berdasarkan pengaturan lokal klien:

date.toLocaleString();

41
Tidak berfungsi dengan semua zona waktu. Ada alasan bagus mengapa getTimeZoneOffset dalam hitungan menit! geografisylists.com/list20d.html
siukurnin

5
@siukurnin. jadi untuk mengelola zona waktu yang aneh, gunakan newDate.setTime (date.getTime () + date.getTimezoneOffset () * 60 * 1000)
Guillaume Gendre

18
newDate.setMinutes (date.getMinutes () - date.getTimezoneOffset ()) sudah cukup. Dalam mengoreksi jam juga
Lu55

1
Cukup yakin ini tidak mungkin bekerja untuk zona waktu mana saja yang berjarak 30 menit? Tampaknya membulatkan ke seluruh jam.
NickG

2
Ini juga sepertinya tidak mengatur tanggal dengan benar ketika pergeseran zona waktu melintasi tengah malam; mungkin karena hanya menggunakan setHours yang tidak memengaruhi tanggal?
Uniphonic

37

Anda harus mendapatkan ofset (UTC) klien (dalam menit):

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

Dan kemudian tambahkan koresponden atau substraksi ke waktu yang Anda dapatkan dari server.

Semoga ini membantu.


2
Bagaimana dengan DST?
Kaya

26

Bagi saya solusi di atas tidak berhasil.

Dengan IE, konversi tanggal-waktu UTC ke lokal sedikit rumit. Bagi saya, tanggal-waktu dari web API adalah '2018-02-15T05:37:26.007'dan saya ingin mengonversi sesuai zona waktu lokal jadi saya menggunakan kode di bawah ini dalam JavaScript.

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

21

Masukkan fungsi ini di kepala Anda:

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

Kemudian hasilkan yang berikut untuk setiap tanggal di badan halaman Anda:

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

Untuk menghapus GMT dan zona waktu, ubah baris berikut:

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

20

Ini bekerja untuk saya:

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

10

Setelah mencoba beberapa lainnya yang diposting di sini tanpa hasil yang baik, ini sepertinya berhasil bagi saya:

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

Dan ini bekerja sebaliknya, dari Tanggal Lokal ke UTC:

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

1
Lebih sedikit kode untuk digunakan new Date(+date + date.getTimezoneOffset() * 6e4). ;-)
RobG

itu tidak akan berfungsi, waktu saya di utc adalah "2020-04-02T11: 09: 00", jadi coba ini dari Singapura, Tanggal baru (+ Tanggal baru ("2020-04-02T11: 09: 00") + Tanggal baru ( "2020-04-02T11: 09: 00"). GetTimezoneOffset () * 6e4), memberikan waktu yang salah
AhammadaliPK

ini berfungsi, Tanggal baru ("2020-04-02T11: 09: 00" + 'Z');
AhammadaliPK

10

Tambahkan zona waktu di akhir, dalam hal ini 'UTC':

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

setelah itu, gunakan keluarga fungsi toLocale () * untuk menampilkan tanggal di lokal yang benar

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

9

Jawaban Matt tidak memiliki fakta bahwa waktu musim panas bisa berbeda antara Date () dan tanggal saat itu perlu dikonversi - berikut ini solusi saya:

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

        var hourOffset = convertdLocalTime.getTimezoneOffset() / 60;

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

        return convertdLocalTime;
    }

Dan hasilnya di debugger:

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

9

Gunakan ini untuk konversi waktu UTC dan Lokal dan sebaliknya.

//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
apa yang terjadi pada saat penghematan siang hari. Zona waktu CET
NovusMobile


9

Ini adalah solusi yang disederhanakan berdasarkan jawaban Adorjan Princ:

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

Pemakaian:

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

Mengapa ini diturunkan pada 9 Oktober 2017? Tolong tulis komentar untuk membantu saya memahami pendapat Anda.
huha

9

Jika Anda tidak keberatan menggunakan moment.jsdan waktu Anda di UTC gunakan saja yang berikut ini:

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

jika waktu Anda tidak ada dalam utc tetapi tempat lain yang Anda kenal, gunakan berikut ini:

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

jika waktu Anda sudah di lokal, maka gunakan berikut ini:

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

5

Bagi saya yang paling sederhana tampaknya menggunakan

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

(saya pikir baris pertama bisa cukup tetapi ada zona waktu yang tidak aktif dalam fraksi jam)


Apakah ada yang punya masalah dengan ini? Ini sepertinya pilihan terbaik bagi saya. Saya mengambil string UTC yang memiliki "(UTC)" di akhir, mengaturnya sebagai objek Date menggunakan new Date('date string'), dan kemudian menambahkan dua baris ini dan tampaknya akan kembali dengan waktu yang didasarkan sepenuhnya dari timestamp UTC server dengan penyesuaian yang dibuat agar sesuai dengan waktu setempat pengguna. Saya harus khawatir tentang fraksi aneh dari zona waktu satu jam juga ... Tidak yakin apakah itu tahan dengan sempurna sepanjang waktu ...
tylerl

mencoba banyak pilihan lain, tidak ada yang berhasil, Tapi ini berhasil
Sameera K

5

String tanggal JSON (bersambung dalam C #) terlihat seperti "2015-10-13T18: 58: 17".

Dalam sudut, (mengikuti Hulvej) buat localdatefilter:

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

Kemudian, tampilkan waktu setempat seperti:

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

3

Menggunakan 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)"

Untuk mengkonversi dari YYYY-MM-DD hh:mm:ssformat, pastikan tanggal Anda mengikuti format ISO 8601 .

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)

Hal-hal penting yang perlu diperhatikan

  1. Anda harus memisahkan tanggal dan waktu dengan a T , spasi tidak akan berfungsi di beberapa browser
  2. Anda harus mengatur zona waktu menggunakan format ini +hh:mm, menggunakan string untuk zona waktu (mis.: 'UTC') tidak akan berfungsi di banyak browser. +hh:mmmewakili offset dari zona waktu UTC.

3

@Adorojan'sjawabannya hampir benar. Tetapi penambahan offset tidak benar karena nilai offset akan negatif jika tanggal browser lebih cepat dari GMT dan sebaliknya. Di bawah ini adalah solusi yang saya gunakan dan bekerja dengan baik untuk saya:

// 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

Bagi saya, ini bekerja dengan baik

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

2

Saya Menjawab Ini Jika Ada yang menginginkan fungsi yang menampilkan waktu yang dikonversi ke elemen id tertentu dan menerapkan string format tanggal yyyy-mm-dd di sini date1 adalah string dan id adalah id dari elemen yang akan ditampilkan waktu itu.

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

saya tahu bahwa jawaban telah diterima tetapi saya dapatkan di sini karena google dan saya menyelesaikannya dengan mendapatkan inspirasi dari jawaban yang diterima jadi saya ingin membagikannya jika seseorang membutuhkannya.


1

Berdasarkan jawaban @ digitalbath, berikut adalah fungsi kecil untuk mengambil stempel waktu UTC dan menampilkan waktu lokal dalam elemen DOM yang diberikan (menggunakan jQuery untuk bagian terakhir ini):

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

Saya menulis skrip kecil yang bagus yang mengambil zaman UTC dan mengubahnya menjadi zona waktu sistem klien dan mengembalikannya dalam format d / m / YH: i: s (seperti fungsi tanggal PHP):

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

Anda dapat menggunakan momentjs ,moment(date).format() akan selalu memberikan hasil pada tanggal lokal .

Bonus , Anda dapat memformat dengan cara apa pun yang Anda inginkan. Untuk misalnya.

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

Untuk lebih jelasnya Anda dapat merujuk situs web Moment js


0

Anda bisa menyelesaikannya menggunakan moment.js file .

Sederhana saja, Anda baru saja menyebutkan tempat zona waktu.

Contoh: Jika Anda mengubah datetime Anda ke zona waktu Asia / Kolkata, Anda hanya perlu menyebutkan nama tempat zona waktu yang diperoleh dari moment.js

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


0

Saya telah membuat satu fungsi yang mengubah semua zona waktu menjadi waktu lokal.

Saya tidak menggunakan getTimezoneOffset (), karena tidak mengembalikan nilai offset yang tepat

Persyaratan:

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

Dalam kasus saya, saya harus menemukan perbedaan tanggal dalam hitungan detik. Tanggal adalah string tanggal UTC, jadi saya mengubahnya menjadi objek tanggal lokal. Inilah yang saya lakukan:

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

Bagi yang lain yang berkunjung - gunakan fungsi ini untuk mendapatkan objek tanggal Lokal dari string UTC, harus mengurus DST dan akan bekerja pada IE, IPhone dll.

Kami membagi string (Karena penguraian Tanggal JS tidak didukung pada beberapa browser) Kami mendapatkan perbedaan dari UTC dan mengurangkannya dari waktu UTC, yang memberi kami waktu lokal. Karena offset yang dikembalikan dihitung dengan DST (koreksi saya jika saya salah), maka waktu akan diset kembali ke variabel "utc". Akhirnya kembalikan objek tanggal.


-1

Di Angular saya menggunakan jawaban Ben seperti ini:

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

Sunting: Angular 1.3.0 menambahkan dukungan UTC ke filter tanggal, saya belum menggunakannya tetapi harus lebih mudah, berikut formatnya:

{{ date_expression | date : format : timezone}}

API Tanggal 1.4.3 Angular

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.