عرض التاريخ/الوقت بالتنسيق المحلي للمستخدم وإزاحة الوقت

Question

أريد أن يقدم الخادم دائمًا التواريخ بالتوقيت العالمي المنسق (UTC) بتنسيق HTML، وأن يقوم JavaScript على موقع العميل بتحويلها إلى المنطقة الزمنية المحلية للمستخدم.

مكافأة إذا كان بإمكاني الإخراج بتنسيق التاريخ المحلي الخاص بالمستخدم.

Answer 1

يبدو أن الطريقة الأكثر ضمانًا للبدء بتاريخ UTC هي إنشاء تاريخ جديد Date الكائن واستخدام setUTC… طرق لتعيينه على التاريخ/الوقت الذي تريده.

ثم المختلفة toLocale…String ستوفر الأساليب مخرجات محلية.

مثال:

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

بعض المراجع:

• toLocaleString
• toLocaleDateString
• toLocaleTimeString
• getTimezoneOffset

Answer 2

للمشاريع الجديدة، استخدم فقط moment.js

هذا السؤال قديم جدًا، لذا moment.js لم تكن موجودة في ذلك الوقت، ولكن بالنسبة للمشاريع الجديدة، فهي تبسط مهام مثل هذه كثيرًا.

من الأفضل أن تحليل سلسلة التاريخ الخاصة بك من UTC على النحو التالي (إنشاء ملف ايزو-8601 سلسلة متوافقة على الخادم للحصول على نتائج متسقة عبر جميع المتصفحات):

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

الآن استخدم فقط m في تطبيقك، يتم ضبط moment.js افتراضيًا على المنطقة الزمنية المحلية لعمليات العرض.هناك العديد من الطرق لتنسيق قيم التاريخ والوقت أو استخراج أجزاء منه

يمكنك أيضًا تنسيق كائن ثانٍ في لغة المستخدمين مثل هذا:

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

لتحويل كائن moment.js إلى منطقة زمنية مختلفة (أيلا المحلي ولا UTC)، ستحتاج إلى ملحق المنطقة الزمنية moment.js.تحتوي هذه الصفحة أيضًا على بعض الأمثلة، وهي سهلة الاستخدام جدًا.

Answer 3

يمكنك استخدام new Date().getTimezoneOffset()/60 للمنطقة الزمنية.هنالك أيضا toLocaleString() طريقة لعرض التاريخ باستخدام لغة المستخدم.

وهنا القائمة الكاملة: العمل مع التواريخ

Answer 4

بمجرد الانتهاء من إنشاء كائن التاريخ، إليك مقتطف للتحويل:

تأخذ الدالة كائن تاريخ بتنسيق UTC وسلسلة تنسيق.
سوف تحتاج إلى Date.strftime النموذج المبدئي.

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

    return d.strftime(format);
}

Answer 5

في JS، لا توجد طرق بسيطة ومتعددة المنصات لتنسيق وقت التاريخ المحلي، باستثناء تحويل كل خاصية كما هو مذكور أعلاه.

إليك طريقة سريعة أستخدمها للحصول على YYYY-MM-DD المحلي.لاحظ أن هذا يعد اختراقًا، حيث أن التاريخ النهائي لن يتضمن المنطقة الزمنية الصحيحة بعد الآن (لذلك عليك تجاهل المنطقة الزمنية).إذا كنت بحاجة إلى أي شيء آخر أكثر، أستخدم 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)

تقوم الدالة d.getTimezoneOffset() بإرجاع إزاحة المنطقة الزمنية بالدقائق، وترجع الدالة d.getTime() بالمللي ثانية، وبالتالي x 60,000.

Answer 6

إليك ما استخدمته في المشاريع السابقة:

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

Answer 7

ال .getTimezoneOffset() تُبلغ الطريقة عن إزاحة المنطقة الزمنية بالدقائق، مع احتساب "غربًا" من المنطقة الزمنية GMT/UTC، مما يؤدي إلى قيمة إزاحة سلبية عما اعتاد عليه المرء عادةً.(على سبيل المثال، سيتم الإبلاغ عن توقيت نيويورك ليكون +240 دقيقة أو +4 ساعات)

للحصول على إزاحة المنطقة الزمنية العادية بالساعات، تحتاج إلى استخدام:

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

التفاصيل الهامة:
لاحظ أن التوقيت الصيفي يؤخذ في الاعتبار في النتيجة - لذا فإن ما توفره لك هذه الطريقة هو حقًا وقت إزاحة - وليس الجغرافية الفعلية وحدة زمنية عوض.

Answer 8

مع التاريخ من كود PHP استخدمت شيئًا كهذا ..

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

يمكننا أن نسميها مثل هذا

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

Answer 9

أقوم بخلط الإجابات حتى الآن وأضيف إليها، لأنه كان علي قراءتها جميعًا والتحقيق فيها بشكل إضافي لفترة من الوقت لعرض سلسلة تاريخ ووقت من db بتنسيق المنطقة الزمنية المحلية للمستخدم.

تأتي سلسلة التاريخ والوقت من قاعدة بيانات python/Django بالتنسيق:12/05/2016 15:12:24

لا يبدو أن الاكتشاف الموثوق للغة المتصفح في JavaScript يعمل في جميع المتصفحات (انظر جافا سكريبت للكشف عن تفضيلات لغة المتصفح)، لذلك أحصل على لغة المتصفح من الخادم.

بايثون/جانجو:إرسال لغة متصفح الطلب كمعلمة سياق:

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

لغة البرمجة:اكتبه في إدخال مخفي:

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

جافا سكريبت:الحصول على قيمة المدخلات المخفية على سبيل المثال.en-GB,en-US;q=0.8,en;q=0.6/ ثم خذ اللغة الأولى في القائمة فقط عبر الاستبدال والتعبير العادي

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

جافا سكريبت:تحويل إلى التاريخ والوقت وتهيئته:

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

يرى: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString

والنتيجة هي (لغة المتصفح en-gb):12/05/2016، الساعة 14:58

Answer 10

أفضل حل صادفته هو إنشاء علامات [time Display = "llll" datetime = "UTC TIME" /] واستخدام جافا سكريبت (jquery) لتحليلها وعرضها بالنسبة إلى وقت المستخدم.

http://momentjs.com/ لحظة.js

سوف يعرض الوقت بشكل جيد.

Answer 11

يمكنك استخدام ما يلي، والذي يوضح إزاحة المنطقة الزمنية عن توقيت جرينتش بالدقائق:

new Date().getTimezoneOffset();

ملحوظة :- تقوم هذه الدالة بإرجاع رقم سالب.

Answer 12

تعد getTimeZoneOffset() وtoLocaleString مفيدة للعمل الأساسي للتاريخ، ولكن إذا كنت بحاجة إلى دعم حقيقي للمنطقة الزمنية، فاطلع على mde's TimeZone.js.

هناك عدد قليل من الخيارات التي تمت مناقشتها في الإجابة على هذا السؤال

Answer 13

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

Answer 14

لتحويل التاريخ إلى تاريخ محلي، استخدم طريقة toLocaleDateString().

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

لتحويل الوقت إلى التوقيت المحلي، استخدم طريقة toLocaleTimeString().

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

Answer 15

لا أعرف كيفية القيام بالإعدادات المحلية، ولكن جافا سكريبت هي تقنية من جانب العميل.

usersLocalTime = new Date();

سيحتوي على وقت العميل وتاريخه (كما ورد في متصفحه، وبالتالي الكمبيوتر الذي يجلس عليه).يجب أن يكون من السهل تضمين وقت الخادم في الاستجابة وإجراء بعض العمليات الحسابية البسيطة لتخمين إزاحة الوقت.