is it possible to convert a UTC date coming from a server to a specific (UK) timezone using JavaScript? This is for the case where users may have the incorrect local timezone configured.
You can specify a time zone in the options passed to toLocaleString, which will use the point-in-time represented by the Date object to create a localized string that is converted to the specified time zone.
For example:
new Date("2020-09-17T17:15:00.000Z").toLocaleString('en-GB', { timeZone: 'Europe/London' })
//=> "17/09/2020, 18:15:00"
Note the first parameter is the locale for the format, not the time zone. If you don't want a specific format, you can pass undefined instead - which will use the user's active locale settings to choose the format.
Note also that you can not get a Date object that is in that time zone. The Date object only stores a point in time (as a Unix timestamp with millisecond precision), and it always uses the computer's local time zone setting for its functions that need local time conversions (except as show above).
(The TC39 Temporal proposal is working to improve this.)
Related
My scenario is a Date object created using the browser timezone (just using new Date()) and sent to the server, but I want to send this date with another specific timezone let's assume it's, Europe/Athens.
What would be the best representation of the actual date string so I can convert it back to a Date object in the backend in the actual Europe/Athens date?
I have the timezone info but not sure how to get a Fri Feb 05 2021 05:30:00 GMT-0500 (Eastern Standard Time) and convert it to Europe/Athens date.
I have tried to use date-fns but didn't get far.
You've got a few different questions and misconceptions, so I will attempt to address each of them, starting with question in the title:
How to convert a Date in specific Timezone and send to server
If you mean a date like 2021-01-18, that cannot be in a particular time zone. It is, by definition, just a date. Think about a printed calendar you might hang on your wall that has a square for each date. There are no time zones associated with such calendars. One can ask "what date is it now in a particular time zone", but the answer itself has no time zone.
If instead you meant a JavaScript Date object, the answer is again "you can't". The Date object is not actually a date, nor does it have a time zone, but rather it is a timestamp. Internally, a Date object only holds one value - the number of milliseconds that have elapsed since 1970-01-01 00:00:00.000 UTC (not considering leap seconds). It has no time zone. Instead, some functions such as .toString() will apply the system-local time zone while operating. That time zone comes from the operating system (in most cases). It is not stored inside the Date object itself.
My scenario is a Date object created using the browser timezone (just using new Date()) ...
That will use the system clock where the browser is running, but the time zone is not relevant. The Date object will be constructed from the Unix timestamp that represents "now". Such timestamps are inherently UTC based. The browser fetches the UTC time directly from the operating system, without considering time zone.
... and sent to the server
One cannot send an object to a server without going through deserialization on one side and serialization on the other.
... but I want to send this date with another specific timezone let's assume it's, Europe/Athens.
What would be the best representation of the actual date string so I can convert it back to a Date object in the backend in the actual Europe/Athens date?
Since the object only represents "now", you don't need to send it in a time zone specific format. Just send the UTC time. The ideal format is ISO 8601, which can be obtained directly using the .toISOString() function from the Date object.
Depending on your use case, you might also consider whether you might instead just take the UTC time from the server instead. At least you will have some control over the clock.
On the server side, if you need the time in a specific time zone, then convert from UTC to that time zone on the server, not on the client.
Also, from comments:
I believe even EPOCH is different between timezones. I could just get the EPOCh and then try to work with converting to specific timezones.
That is incorrect on a few levels. First, understand that epoch is just an English word meaning essentially "a representation of a starting point". It isn't a format, nor is it an acronym. In JavaScript, Date objects use Unix timestamps, which use an epoch of 1970-01-01T00:00:00.000Z. In other words, Midnight Jan 1st 1970 UTC is the 0 timestamp. Sometimes, such timestamps are referred to as "epoch time". That's a misnomer in my opinion, but even still - they are always UTC based. There is no time zone, and thus they are the same for the whole world.
Try to use toLocaleString:
let date = (new Date()).toLocaleString("en-US", {timeZone: "Europe/Athens"});
According to this date-time strings without a time zone should be interpreted as local time.
When the time zone offset is absent, date-only forms are interpreted as a UTC time and date-time forms are interpreted as local time.
Our API returns time stamps of various different time zones but we always want to display them in those different time zones (these are flight times and are always shown as local to the airport).
In most browsers I can pass this string to a Date object and it is interpreted as the user's local time zone but I don't care that it's the wrong time zone since we don't compare Dates across time zones. When I use Intl.DateTimeFormat.format to display it as a string it displays the same time as the string specifies which is what I want.
In Safari these time strings are interpreted as UTC and then the string format converts it to local time.
new Date("2020-05-06T13:25:00").getTime() === new Date("2020-05-06T13:25:00Z").getTime()
This returns true in Safari but false everywhere else. (It will also return true if your local timezone is UTC but we're not considering that case).
This is Safari running on a computer set to CDT. It taken 13:25 as UTC then displaying it with -5 hours.
This is Chrome (on Windows - not sure if that's relevant, I don't have access to a Mac). But it's taking the same timestamp as being local time and so then displays it as the same time. This is what I want.
Is there anyway we can work around this so I can return a time stamp which is then parsed as local time so it displays correctly.
I am using firebase toDate()-method to get a Date object from my timestamp:
myTimestamp.toDate()
This creates a Date-object (which I need), but in local time (the time my operating system uses). How can I get it to give me a Date-Object in CEST/CET?
edit:
The timestamp comes from firebase and I am using their toDate() method.
The integer value contained by a Date object (milliseconds since unix epoch) is not affected by timezones. It represents the same point in time for all people on the planet.
However, when you print a Date object, you will see the date rendered with local timezone. If you want just that integer number inside the Date, call getTime() on it for use elsewhere.
You can feed a Date (or the underlying number) to other libraries that may do what you really want with the date, including momentjs with moment-timezone. For example, this may work with moment:
moment(your_date).tz('Desired Timezone').format('ha z')
I am using new Date(<date-string>) and then .getTime() to pass date strings to milliseconds from 1970.
The problem is that the date strings does not contain the timezone on them. They are British, so the timezone will be GMT or GMT+1 depending on the date...
When I use this technique in the front-end (Chrome), or in the back-end (Node.js). The time zone taken is the British one (GMT or GMT+1 depending on the date). I assume that is taken from the OS.
However, when using a Node.js server which I have been told is configured to be in UTC... the timezone is always going to be GMT, leading to errors during the British Summer Time.
Is there any way to tell Date to take the timezone from the OS without changing the server configuration?
Example:
var aDate = new Date('2016-06-23 10:15:0');
var timestamp = aDate.getTime();
Just in case my explanation is not clear:
// Executed on 28-06-2016
// In the browser (in London)
new Date().getTimezoneOffset(); // -60
new Date('28-06-2016 11:11:11').getTimezoneOffset(); // -60
new Date('28-01-2016 11:11:11').getTimezoneOffset(); // 0
// In the Node.js server I am forced to use, which is configured to use UTC
new Date().getTimezoneOffset(); // 0
new Date('28-06-2016 11:11:11').getTimezoneOffset(); // 0
new Date('28-01-2016 11:11:11').getTimezoneOffset(); // 0
// Ideally, I would like to have the output I get in the browser when I run the code in the UTC Node.js server
I recommend using Moment Timezone for this, since this would be needlessly complicated to implement without a library. To get UTC in milliseconds from a given date in a given timezone, you can do this:
const moment = require('moment-timezone');
function londonTimeToUTC(dateString) {
return moment.tz(dateString, 'DD-MM-YYYY HH:mm:ss', 'Europe/London').valueOf();
}
console.log(londonTimeToUTC('28-06-2016 11:11:11')); // 1467108671000
console.log(londonTimeToUTC('28-01-2016 11:11:11')); // 1453979471000
The second argument passed to moment.tz() is a format string, which is necessary if the date string is not in ISO format. The third argument is any valid timezone identifier.
Is there any way to tell Date to take the timezone from the OS without changing the server configuration?
The time zone from the OS is what the Date object uses. If you're asking if you can change that time zone without changing the configuration, then no - there is not a way to do that. The Date object always takes on the behavior of the local time zone. Even if you supply an offset in the input string, it just uses that to determine the internal UTC timestamp. Output via most of the properties (including toString and getTimezoneOffset) will always use the local time zone.
Even in your examples, you cannot count on the browser behavior always returning the values you showed, simply because each user visiting your web site may have a different time zone setting.
The recommended way to deal with this is by using the moment.js library, which can handle UTC and local time by itself, but may require use of the moment-timezone extension if you are wanting to work with a specific time zone, such as Europe/London.
Now, with that said, if you're certain that your entire node.js application will run in a single time zone, and you're running on Linux or OSX (not Windows), then you can indeed change which time zone that node.js considers to be "local". Simply set the TZ environment variable before you launch node, like this:
env TZ='Europe/London' node server.js
There is no equivalent for the browser, or for Windows. And you still have to contend with possible non-UK users on your web site - so this doesn't guaranteed a match between client and server time. But it does address your question.
See also:
How to initialize javascript date to a particular timezone
How to make the timezone of date to UTC
How to set default timezone in Node.js
We are displaying schedules on our webpage which is build on GWT. Client system using different timezone from server and because of that, all the schedules were displaying wrong. Is there a way to set default time zone when we load the page? Like the way we do it in java:
TimeZone.setDefault(TimeZone.getTimeZone("Asia/Kolkata"));
Thanks!!!
No, you can't set the timezone of Date objects in javascript. Usually you use only UTC and epoch-based timestamps.
Only when creating a Date from a string or from year, month etc. the local timezone will be used, you can only get the timezone offset.
Converting a timezone can only be done by re-setting the Hours of the Date object (example described here), creating a date which looks-like having an offset timezone but is just utc.
In case you are using moment.js for your dates, you can set the default timezone for all newly created moments with:
moment.tz.setDefault(String)
https://momentjs.com/timezone/docs/#/using-timezones/default-timezone/