วิธีการเริ่มต้นวันที่ JavaScript กับเขตเวลาที่ต้องการ

ฉันมีเวลาวันที่ในเขตเวลาที่เฉพาะเจาะจงเป็นสตริงและฉันต้องการแปลงเป็นเวลาท้องถิ่น แต่ฉันไม่ทราบวิธีตั้งค่าเขตเวลาในวัตถุ Date

ตัวอย่างเช่นฉันมีFeb 28 2013 7:00 PM ET,แล้วฉันสามารถ

var mydate = new Date();
mydate.setFullYear(2013);
mydate.setMonth(02);
mydate.setDate(28);
mydate.setHours(7);
mydate.setMinutes(00);  

เท่าที่ฉันรู้ฉันสามารถตั้งเวลา UTC หรือเวลาท้องถิ่นได้ แต่ฉันจะตั้งเวลาในเขตเวลาอื่นได้อย่างไร

ฉันพยายามใช้การเพิ่ม / ลบออฟเซ็ตจาก UTC แต่ฉันไม่ทราบวิธีตอบโต้การออมตามฤดูกาล ไม่แน่ใจว่าฉันกำลังมุ่งหน้าไปในทิศทางที่ถูกต้องหรือไม่

ฉันจะเปลี่ยนเวลาจากเขตเวลาอื่นเป็นเวลาท้องถิ่นด้วย javascript ได้อย่างไร

พื้นหลัง

Dateวัตถุของ JavaScript ติดตามเวลาใน UTC ภายใน แต่โดยทั่วไปจะรับอินพุตและสร้างผลลัพธ์ในเวลาท้องถิ่นของคอมพิวเตอร์ที่กำลังทำงานอยู่ มีสิ่งอำนวยความสะดวกน้อยมากสำหรับการทำงานกับเวลาในเขตเวลาอื่น

การเป็นตัวแทนภายในของDateวัตถุเป็นตัวเลขเดียวซึ่งแสดงถึงจำนวนมิลลิวินาทีที่ผ่านไปนับตั้งแต่1970-01-01 00:00:00 UTCโดยไม่คำนึงถึงวินาทีกระโดด ไม่มีเขตเวลาหรือรูปแบบสตริงที่จัดเก็บในวัตถุ Date เอง เมื่อมีการใช้ฟังก์ชันต่าง ๆ ของDateวัตถุเขตเวลาท้องถิ่นของคอมพิวเตอร์จะถูกนำไปใช้กับการเป็นตัวแทนภายใน หากฟังก์ชั่นสร้างสตริงข้อมูลสถานที่ของคอมพิวเตอร์อาจถูกนำมาพิจารณาเพื่อกำหนดวิธีการสร้างสตริงนั้น รายละเอียดแตกต่างกันไปตามฟังก์ชั่นและบางอย่างเฉพาะการใช้งาน

การดำเนินการเดียวที่Dateวัตถุสามารถทำได้กับเขตเวลาที่ไม่ใช่ในท้องที่คือ:

• มันสามารถแยกสตริงที่มี UTC ชดเชยตัวเลขจากเขตเวลาใด ๆ มันใช้สิ่งนี้เพื่อปรับค่าการแยกวิเคราะห์และเก็บเทียบเท่า UTC เวลาท้องถิ่นดั้งเดิมและการชดเชยจะไม่ถูกเก็บไว้ในDateวัตถุที่เป็นผลลัพธ์ ตัวอย่างเช่น:

  var d = new Date("2020-04-13T00:00:00.000+08:00");
  d.toISOString()  //=> "2020-04-12T16:00:00.000Z"
  d.valueOf()      //=> 1586707200000  (this is what is actually stored in the object)
  

• ในสภาพแวดล้อมที่ใช้ECMASCript Internationalization API (aka "Intl") Dateวัตถุสามารถสร้างสตริงเฉพาะสถานที่เพื่อปรับเป็นตัวระบุเขตเวลาที่กำหนด สามารถทำได้ผ่านtimeZoneตัวเลือกtoLocaleStringและรูปแบบต่างๆ การใช้งานส่วนใหญ่จะสนับสนุน IANA 'America/New_York'เวลาตัวระบุโซนเช่น ตัวอย่างเช่น:

  var d = new Date("2020-04-13T00:00:00.000+08:00");
  d.toLocaleString('en-US', { timeZone: 'America/New_York' })
  //=> "4/12/2020, 12:00:00 PM"
  // (midnight in China on Apring 13th is noon in New York on April 12th)
  

  สภาพแวดล้อมที่ทันสมัยส่วนใหญ่รองรับชุดตัวระบุเขตเวลาแบบเต็มของ IANA ( ดูตารางความเข้ากันได้ที่นี่ ) อย่างไรก็ตามโปรดทราบว่าตัวระบุเฉพาะที่จำเป็นต้องได้รับการสนับสนุนจาก Intl คือ'UTC'ดังนั้นคุณควรตรวจสอบอย่างรอบคอบหากคุณต้องการสนับสนุนเบราว์เซอร์รุ่นเก่าหรือสภาพแวดล้อมที่ผิดปกติ (ตัวอย่างเช่นอุปกรณ์ IoT ที่มีน้ำหนักเบา)

ห้องสมุด

มีหลายไลบรารีที่สามารถใช้ทำงานกับเขตเวลาได้ แม้ว่าพวกเขาจะยังไม่สามารถทำให้Dateวัตถุทำงานแตกต่างกัน แต่พวกเขามักจะใช้ฐานข้อมูลเขตเวลามาตรฐาน IANA และให้ฟังก์ชั่นการใช้งานใน JavaScript ไลบรารีสมัยใหม่ใช้ข้อมูลเขตเวลาที่ให้บริการโดย Intl API แต่โดยทั่วไปแล้วไลบรารีที่เก่ากว่าจะมีค่าใช้จ่ายโดยเฉพาะถ้าคุณใช้งานในเว็บเบราว์เซอร์เนื่องจากฐานข้อมูลอาจมีขนาดใหญ่ขึ้นเล็กน้อย บางไลบรารีเหล่านี้ยังช่วยให้คุณสามารถเลือกลดชุดข้อมูลไม่ว่าจะสนับสนุนเขตเวลาใดและ / หรือตามช่วงวันที่ที่คุณสามารถทำงานได้

นี่คือห้องสมุดที่ต้องพิจารณา:

ไลบรารีบนพื้นฐานระหว่างประเทศ

การพัฒนาใหม่ควรเลือกจากการใช้งานอย่างใดอย่างหนึ่งซึ่งขึ้นอยู่กับ Intl API สำหรับข้อมูลเขตเวลา:

• Luxon (ผู้สืบทอดของMoment.js )
• date-fns-tz (ส่วนขยายสำหรับdate-fns )

ห้องสมุดที่ไม่ใช่ของต่างประเทศ

ไลบรารีเหล่านี้ได้รับการบำรุงรักษา แต่มีภาระในการทำแพ็กเกจข้อมูลเขตเวลาของตัวเอง

• js-joda / timezone (ส่วนขยายสำหรับjs-joda )
• ช่วงเวลาขณะนี้ * (ส่วนขยายสำหรับMoment.js )
• date-fns-timezone (ส่วนขยายสำหรับ 1.x ที่เก่ากว่าของdate-fns )
• BigEasy / เขต
• tz.js

* ในขณะที่ก่อนหน้านี้ได้แนะนำ Moment และ Moment-Timezone ทีม Moment ตอนนี้ชอบให้ผู้ใช้เลือก Luxon สำหรับการพัฒนาใหม่

ห้องสมุดที่เลิกผลิตแล้ว

ห้องสมุดเหล่านี้ถูกยกเลิกอย่างเป็นทางการและไม่ควรใช้อีกต่อไป

• WallTime-js
• TimeZoneJS

ข้อเสนอในอนาคต

TC39 ขมับเสนอจุดมุ่งหมายที่จะให้ชุดใหม่ของวัตถุมาตรฐานสำหรับการทำงานกับวันที่และเวลาในภาษาจาวาสคริปต์ตัวเอง ซึ่งจะรวมถึงการสนับสนุนวัตถุที่รับรู้เขตเวลา

อย่างที่แมตต์จอห์นสันกล่าว

หากคุณสามารถ จำกัด การใช้งานของคุณกับเว็บเบราว์เซอร์ที่ทันสมัยคุณสามารถทำสิ่งต่อไปนี้ได้โดยไม่ต้องมีไลบรารีพิเศษ:

new Date().toLocaleString("en-US", {timeZone: "America/New_York"})

นี่ไม่ใช่โซลูชันที่ครอบคลุม แต่ใช้ได้กับหลาย ๆ สถานการณ์ที่ต้องใช้การแปลงผลลัพธ์ (จาก UTC หรือเวลาท้องถิ่นเป็นโซนเวลาที่ระบุ แต่ไม่ใช่ทิศทางอื่น)

ดังนั้นแม้ว่าเบราว์เซอร์จะไม่สามารถอ่านเขตเวลาของ IANA เมื่อสร้างวันที่หรือมีวิธีการใด ๆ ในการเปลี่ยนเขตเวลาในวัตถุ Date ที่มีอยู่ดูเหมือนว่าจะมีแฮ็กอยู่รอบ ๆ :

function changeTimezone(date, ianatz) {

  // suppose the date is 12:00 UTC
  var invdate = new Date(date.toLocaleString('en-US', {
    timeZone: ianatz
  }));

  // then invdate will be 07:00 in Toronto
  // and the diff is 5 hours
  var diff = date.getTime() - invdate.getTime();

  // so 12:00 in Toronto is 17:00 UTC
  return new Date(date.getTime() + diff);

}

// E.g.
var there = new Date();
var here = changeTimezone(there, "America/Toronto");

console.log(`Here: ${here.toString()}\nToronto: ${there.toString()}`);

คุณสามารถระบุการชดเชยเขตเวลาได้new Date()เช่น:

new Date('Feb 28 2013 19:00:00 EST')

หรือ

new Date('Feb 28 2013 19:00:00 GMT-0500')

ตั้งแต่Dateเวลา UTC ของร้านค้า (เช่นgetTimeส่งคืนใน UTC) จาวาสคริปต์จะแปลงเวลาเป็น UTC และเมื่อคุณเรียกสิ่งต่าง ๆ เช่นtoStringจาวาสคริปต์จะแปลงเวลา UTC เป็นเขตเวลาท้องถิ่นของเบราว์เซอร์และส่งคืนสตริงในเขตเวลาท้องถิ่นเช่นถ้าฉันใช้UTC+8:

> new Date('Feb 28 2013 19:00:00 GMT-0500').toString()
< "Fri Mar 01 2013 08:00:00 GMT+0800 (CST)"

นอกจากนี้คุณสามารถใช้getHours/Minute/Secondวิธีการปกติ:

> new Date('Feb 28 2013 19:00:00 GMT-0500').getHours()
< 8

(ซึ่ง8หมายความว่าหลังจากเวลาถูกแปลงเป็นเวลาท้องถิ่นของฉัน - UTC+8คือจำนวนชั่วโมง8)

วิธีนี้จะช่วยแก้ปัญหาของคุณได้โปรดอย่าลังเลที่จะเสนอวิธีแก้ไข วิธีนี้จะบัญชีสำหรับการปรับเวลาตามฤดูกาลสำหรับวันที่กำหนดด้วย

dateWithTimeZone = (timeZone, year, month, day, hour, minute, second) => {
  let date = new Date(Date.UTC(year, month, day, hour, minute, second));

  let utcDate = new Date(date.toLocaleString('en-US', { timeZone: "UTC" }));
  let tzDate = new Date(date.toLocaleString('en-US', { timeZone: timeZone }));
  let offset = utcDate.getTime() - tzDate.getTime();

  date.setTime( date.getTime() + offset );

  return date;
};

วิธีใช้กับเขตเวลาและเวลาท้องถิ่น:

dateWithTimeZone("America/Los_Angeles",2019,8,8,0,0,0)

ฉันพบวิธีที่ได้รับการสนับสนุนมากที่สุดในการทำเช่นนี้โดยไม่ต้องกังวลเกี่ยวกับห้องสมุดของบุคคลที่สามคือการใช้getTimezoneOffsetเพื่อคำนวณเวลาประทับที่เหมาะสมหรืออัปเดตเวลาจากนั้นใช้วิธีการปกติเพื่อให้ได้วันและเวลาที่จำเป็น

var mydate = new Date();
mydate.setFullYear(2013);
mydate.setMonth(02);
mydate.setDate(28);
mydate.setHours(7);
mydate.setMinutes(00);

// ET timezone offset in hours.
var timezone = -5;
// Timezone offset in minutes + the desired offset in minutes, converted to ms.
// This offset should be the same for ALL date calculations, so you should only need to calculate it once.
var offset = (mydate.getTimezoneOffset() + (timezone * 60)) * 60 * 1000;

// Use the timestamp and offset as necessary to calculate min/sec etc, i.e. for countdowns.
var timestamp = mydate.getTime() + offset,
    seconds = Math.floor(timestamp / 1000) % 60,
    minutes = Math.floor(timestamp / 1000 / 60) % 60,
    hours   = Math.floor(timestamp / 1000 / 60 / 60);

// Or update the timestamp to reflect the timezone offset.
mydate.setTime(mydate.getTime() + offset);
// Then Output dates and times using the normal methods.
var date = mydate.getDate(),
    hour = mydate.getHours();

แก้ไข

ก่อนหน้านี้ฉันใช้UTCวิธีการเมื่อทำการแปลงวันที่ซึ่งไม่ถูกต้อง ด้วยการเพิ่มการชดเชยให้กับเวลาการใช้getฟังก์ชั่นท้องถิ่นจะส่งกลับผลลัพธ์ที่ต้องการ

ฉันพบปัญหาคล้ายกันกับการทดสอบหน่วย (โดยเฉพาะอย่างยิ่งเมื่อล้อเล่นเมื่อทดสอบหน่วยทำงานในเครื่องเพื่อสร้างสแนปชอตจากนั้นเซิร์ฟเวอร์ CI จะทำงานใน (อาจ) เขตเวลาที่แตกต่างกัน ฉันเยาะเย้ยเราDateและวิธีการสนับสนุนบางอย่างเช่น:

describe('...', () => {
  let originalDate;

  beforeEach(() => {
    originalDate = Date;
    Date = jest.fn(
      (d) => {
        let newD;
        if (d) {
          newD = (new originalDate(d));
        } else {
          newD = (new originalDate('2017-05-29T10:00:00z'));
        }
        newD.toLocaleString = () => {
          return (new originalDate(newD.valueOf())).toLocaleString("en-US", {timeZone: "America/New_York"});
        };
        newD.toLocaleDateString = () => {
          return (new originalDate(newD.valueOf())).toLocaleDateString("en-US", {timeZone: "America/New_York"});
        };
        newD.toLocaleTimeString = () => {
          return (new originalDate(newD.valueOf())).toLocaleTimeString("en-US", {timeZone: "America/New_York"});
        };
        return newD;
      }
    );
    Date.now = () => { return (Date()); };
  });

  afterEach(() => {
    Date = originalDate;
  });

});

ลองใช้ ctoc จาก npm https://www.npmjs.com/package/ctoc_timezone

มันมีฟังก์ชั่นง่าย ๆ ในการเปลี่ยนเขตเวลา (เขตเวลาส่วนใหญ่ประมาณ 400) และรูปแบบที่กำหนดเองทั้งหมดที่คุณต้องการให้แสดง

จากคำตอบข้างต้นฉันใช้สายการบินเดียวนี้เพื่อแปลงสตริงเขตเวลายาวเป็นสตริงตัวอักษรสามตัว:

var longTz = 'America/Los_Angeles';
var shortTz = new Date().
    toLocaleString("en", {timeZoneName: "short", timeZone: longTz}).
    split(' ').
    pop();

สิ่งนี้จะให้ PDT หรือ PST ตามวันที่ที่ให้ไว้ ในกรณีการใช้งานเฉพาะของฉันการพัฒนาใน Salesforce (Aura / Lightning) เราสามารถรับเขตเวลาผู้ใช้ในรูปแบบยาวจากแบ็กเอนด์

ฉันรู้ว่ามันสายไปแล้ว 3 ปี แต่บางทีมันอาจช่วยคนอื่นได้เพราะฉันไม่ได้พบอะไรแบบนั้นยกเว้นห้องสมุดช่วงเวลาที่ไม่เหมือนกับสิ่งที่เขาขอที่นี่

ฉันทำอะไรที่คล้ายกับเขตเวลาเยอรมันนี่ซับซ้อนเล็กน้อยเพราะประหยัดเวลากลางวันและกระโดดปีที่คุณมี 366 วัน

อาจต้องใช้งานฟังก์ชั่น "isDaylightSavingTimeInGermany" เพียงเล็กน้อยขณะที่เขตเวลาที่แตกต่างกันจะเปลี่ยนไปตามเวลาที่ต่างกันตามเวลาที่ปรับตามฤดูกาล

อย่างไรก็ตามให้ตรวจสอบหน้านี้: https://github.com/zerkotin/german-timezone-converter/wiki

วิธีการหลักคือ: แปลง LocalDateToGermanTimezone แปลงGermanDateToLocalTimezone

ฉันใช้ความพยายามในการจัดทำเอกสารดังนั้นมันจะไม่เกิดความสับสน

ลอง: date-from-timezoneจะช่วยแก้ไขวันที่ที่คาดหวังด้วยความช่วยเหลือที่มีอยู่Intl.DateTimeFormatตามธรรมชาติ

ฉันใช้วิธีนั้นในหนึ่งในโครงการของฉันไม่กี่ปีที่ผ่านมา แต่ตอนนี้ฉันตัดสินใจที่จะเผยแพร่เป็นโครงการ OS ขนาดเล็ก :)

สำหรับผู้ใช้อิออนฉันรู้สึกแย่กับสิ่งนี้เพราะ.toISOString()จะต้องใช้กับเทมเพลต html

สิ่งนี้จะคว้าวันที่ปัจจุบัน แต่แน่นอนว่าสามารถเพิ่มคำตอบก่อนหน้าสำหรับวันที่เลือก

ฉันได้รับการแก้ไขโดยใช้สิ่งนี้:

date = new Date();
public currentDate: any = new Date(this.date.getTime() - this.date.getTimezoneOffset()*60000).toISOString();

* 60000 กำลังระบุ UTC -6 ซึ่งเป็น CST ดังนั้นไม่ว่าจะต้องใช้ TimeZone ใดสามารถเปลี่ยนแปลงจำนวนและความแตกต่างได้

บางทีนี่อาจช่วยคุณได้

/**
 * Shift any Date timezone.
 * @param {Date} date - Date to update.
 * @param {string} timezone - Timezone as `-03:00`.
 */
function timezoneShifter(date, timezone) {
  let isBehindGTM = false;
  if (timezone.startsWith("-")) {
    timezone = timezone.substr(1);
    isBehindGTM = true;
  }

  const [hDiff, mDiff] = timezone.split(":").map((t) => parseInt(t));
  const diff = hDiff * 60 + mDiff * (isBehindGTM ? 1 : -1);
  const currentDiff = new Date().getTimezoneOffset();

  return new Date(date.valueOf() + (currentDiff - diff) * 60 * 1000);
}



const _now = new Date()
console.log(
  [
    "Here: " + _now.toLocaleString(),
    "Greenwich: " + timezoneShifter(_now, "00:00").toLocaleString(),
    "New York: " + timezoneShifter(_now, "-04:00").toLocaleString(),
    "Tokyo: " + timezoneShifter(_now, "+09:00").toLocaleString(),
    "Buenos Aires: " + timezoneShifter(_now, "-03:00").toLocaleString(),
  ].join('\n')
);

พบปัญหาเดียวกันใช้อันนี้

Console.log (Date.parse ("13 มิ.ย. 2018 10:50:39 GMT + 1"));

มันจะคืนค่ามิลลิวินาทีซึ่งคุณสามารถตรวจสอบได้ว่ามี 100 เขตเวลา + ทำให้เวลาอังกฤษเป็นจริงหวังว่ามันจะช่วย !!