it-swarm-id.com

Menampilkan tanggal/waktu dalam format lokal pengguna dan waktu offset

Saya ingin server selalu menyajikan tanggal dalam UTC dalam HTML, dan meminta JavaScript di situs klien untuk mengubahnya menjadi zona waktu lokal pengguna.

Bonus jika saya bisa menampilkan dalam format tanggal lokal pengguna.

145
kch

Tampaknya cara yang paling mudah untuk memulai dengan tanggal UTC adalah membuat objek Date baru dan menggunakan metode setUTC… untuk mengaturnya ke tanggal/waktu yang Anda inginkan.

Kemudian berbagai metode toLocale…String akan memberikan output lokal.

Contoh:

// This would come from the server.
// Also, this whole block could probably be made into an mktime function.
// All very bare here for quick grasping.
d = new Date();
d.setUTCFullYear(2004);
d.setUTCMonth(1);
d.setUTCDate(29);
d.setUTCHours(2);
d.setUTCMinutes(45);
d.setUTCSeconds(26);

console.log(d);                        // -> Sat Feb 28 2004 23:45:26 GMT-0300 (BRT)
console.log(d.toLocaleString());       // -> Sat Feb 28 23:45:26 2004
console.log(d.toLocaleDateString());   // -> 02/28/2004
console.log(d.toLocaleTimeString());   // -> 23:45:26

Beberapa referensi:

148
kch

Untuk proyek baru, cukup gunakan moment.js

Pertanyaan ini cukup lama, jadi moment.js tidak ada pada waktu itu, tetapi untuk proyek baru, ini sangat menyederhanakan tugas seperti ini. 

Yang terbaik adalah parse string tanggal Anda dari UTC sebagai berikut (buat ISO-8601 string yang kompatibel di server untuk mendapatkan hasil yang konsisten di semua browser):

var m = moment("2013-02-08T09:30:26Z");

Sekarang cukup gunakan m di aplikasi Anda, default moment.js ke zona waktu lokal untuk operasi tampilan. Ada banyak cara untuk memformat nilai tanggal dan waktu atau mengekstrak bagiannya.

Anda bahkan dapat memformat objek momen di lokal pengguna seperti ini:

m.format('LLL') // Returns "February 8 2013 8:30 AM" on en-us

Untuk mengubah objek moment.js menjadi zona waktu yang berbeda (mis. Bukan yang lokal maupun UTC), Anda memerlukan ekstensi zona waktu moment.js . Halaman itu juga memiliki beberapa contoh, cukup mudah digunakan.

61
theDmi

Anda dapat menggunakan new Date().getTimezoneOffset()/60 untuk zona waktu. Ada juga metode toLocaleString() untuk menampilkan tanggal menggunakan lokal pengguna.

Inilah seluruh daftar: Bekerja dengan Tanggal

19
jop

Setelah objek tanggal Anda dibuat, inilah cuplikan untuk konversi:

Fungsi ini mengambil objek Tanggal berformat UTC dan string format.
Anda memerlukan prototipe Date.strftime.

function UTCToLocalTimeString(d, format) {
    if (timeOffsetInHours == null) {
        timeOffsetInHours = (new Date().getTimezoneOffset()/60) * (-1);
    }
    d.setHours(d.getHours() + timeOffsetInHours);

    return d.strftime(format);
}
6
simianarmy

Inilah yang saya gunakan dalam proyek sebelumnya:

var myDate = new Date();
var tzo = (myDate.getTimezoneOffset()/60)*(-1);
//get server date value here, the parseInvariant is from MS Ajax, you would need to do something similar on your own
myDate = new Date.parseInvariant('<%=DataCurrentDate%>', 'yyyyMMdd hh:mm:ss');
myDate.setHours(myDate.getHours() + tzo);
//here you would have to get a handle to your span / div to set.  again, I'm using MS Ajax's $get
var dateSpn = $get('dataDate');
dateSpn.innerHTML = myDate.localeFormat('F');
5
Mark

Di JS tidak ada cara sederhana dan lintas platform untuk memformat waktu tanggal lokal, di luar konversi setiap properti seperti yang disebutkan di atas. 

Ini adalah peretasan cepat yang saya gunakan untuk mendapatkan YYYY-MM-DD lokal. Perhatikan bahwa ini adalah peretasan, karena tanggal akhir tidak akan memiliki zona waktu yang benar lagi (jadi Anda harus mengabaikan zona waktu). Jika saya membutuhkan hal lain lagi, saya menggunakan moment.js. 

var d = new Date();    
d = new Date(d.getTime() - d.getTimezoneOffset() * 60000)
var yyyymmdd = t.toISOString().slice(0,0); 
// 2017-05-09T08:24:26.581Z (but this is not UTC)

The d.getTimezoneOffset () mengembalikan offset zona waktu dalam beberapa menit, dan d.getTime () dalam ms, maka x 60.000.

4
Jeremy Chone

Metode .getTimezoneOffset() melaporkan offset zona waktu dalam hitungan menit, menghitung "ke arah barat" dari zona waktu GMT/UTC, menghasilkan nilai offset yang negatif terhadap apa yang biasa digunakan orang. (Contoh, waktu New York akan dilaporkan +240 menit atau +4 jam)

Untuk mendapatkan offset zona waktu normal dalam jam, Anda perlu menggunakan:

var timeOffsetInHours = -(new Date()).getTimezoneOffset()/60

Detail penting:
Perhatikan bahwa waktu penghematan siang hari diperhitungkan dalam hasil - jadi apa metode ini memberi Anda benar-benar offset waktu - bukan offset geografis zona waktu aktual.

3
Már Örlygsson

Dengan tanggal dari kode PHP saya menggunakan sesuatu seperti ini ..

function getLocalDate(php_date) {
  var dt = new Date(php_date);
  var minutes = dt.getTimezoneOffset();
  dt = new Date(dt.getTime() + minutes*60000);
  return dt;
}

Kita bisa menyebutnya seperti ini

var localdateObj = getLocalDate('2015-09-25T02:57:46');
3
hriziya

Saya mencampur jawaban sejauh ini dan menambahkannya, karena saya harus membaca semuanya dan menyelidiki tambahan untuk sementara waktu untuk menampilkan string waktu tanggal dari db dalam format zona waktu lokal pengguna.

String datetime berasal dari python/Django db dalam format: 2016-12-05T15: 12: 24.215Z

Deteksi bahasa browser yang andal dalam JavaScript tampaknya tidak berfungsi di semua browser (lihat JavaScript untuk mendeteksi preferensi bahasa browser ), jadi saya mendapatkan bahasa browser dari server.

Python/Django: kirim bahasa browser permintaan sebagai parameter konteks:

language = request.META.get('HTTP_ACCEPT_LANGUAGE')
return render(request, 'cssexy/index.html', { "language": language })

HTML: tulis dalam input tersembunyi:

<input type="hidden" id="browserlanguage" value={{ language }}/>

JavaScript: dapatkan nilai input tersembunyi mis. en-GB, en-US; q = 0.8, en; q = 0.6/dan kemudian mengambil bahasa pertama dalam daftar hanya melalui ganti dan ekspresi reguler

const browserlanguage = document.getElementById("browserlanguage").value;
var defaultlang = browserlanguage.replace(/(\w{2}\-\w{2}),.*/, "$1");

JavaScript: konversikan ke datetime dan formatlah:

var options = { hour: "2-digit", minute: "2-digit" };
var dt = (new Date(str)).toLocaleDateString(defaultlang, options);

Lihat: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString

Hasilnya adalah (bahasa browser adalah en-gb): 05/12/2016, 14:58

3
Anja

Solusi terbaik yang saya temui adalah membuat tag [time display = "llll" datetime = "UTC TIME" /], dan menggunakan javascript (jquery) untuk mengurai dan menampilkannya relatif terhadap waktu pengguna.

http://momentjs.com/ Moment.js 

akan menampilkan waktu dengan baik.

2
Daniel

Anda dapat menggunakan yang berikut ini, yang melaporkan zona waktu offset dari GMT dalam beberapa menit: 

new Date().getTimezoneOffset();

Catatan : - fungsi ini mengembalikan angka negatif.

2
dave

getTimeZoneOffset () dan toLocaleString bagus untuk pekerjaan tanggal dasar, tetapi jika Anda membutuhkan dukungan zona waktu nyata, lihat TimeZone.js mde

Ada beberapa opsi yang dibahas dalam jawaban untuk pertanyaan ini

1
Aeon

Untuk mengonversi tanggal ke tanggal lokal, gunakan metode toLocaleDateString ().

var date = (new Date(str)).toLocaleDateString(defaultlang, options);

Untuk mengonversi waktu ke waktu lokal, gunakan metode toLocaleTimeString ().

var time = (new Date(str)).toLocaleTimeString(defaultlang, options);
0
Codemaker

// new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]])
var serverDate = new Date(2018, 5, 30, 19, 13, 15); // just any date that comes from server
var serverDateStr = serverDate.toLocaleString("en-US", {
  year: 'numeric',
  month: 'numeric',
  day: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric'
})
var userDate = new Date(serverDateStr + " UTC");
var locale = window.navigator.userLanguage || window.navigator.language;

var clientDateStr = userDate.toLocaleString(locale, {
  year: 'numeric',
  month: 'numeric',
  day: 'numeric'
});

var clientDateTimeStr = userDate.toLocaleString(locale, {
  year: 'numeric',
  month: 'numeric',
  day: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric'
});

console.log("Server UTC date: " + serverDateStr);
console.log("User's local date: " + clientDateStr);
console.log("User's local date&time: " + clientDateTimeStr);

0
Sergey