Convert UTC date time to local date time

Question 1

From the server I get a datetime variable in this format: 6/29/2011 4:52:48 PM and it is in UTC time. I want to convert it to the current user’s browser time zone using JavaScript.

How this can be done using JavaScript or jQuery?

Question 2

Code Sample here: http://stackoverflow.com/questions/3830418/is-there-a-jquery-plugin-to-convert-utc-datetimes-to-local-user-timezone

Question 3

Be careful. That's a weird date format, so be sure to specify it in whatever solution you use. If possible, get the server to send the date in ISO format.

Question 4

Hello, I had similar problems, I solved it by converting the date/time, before sending to the server, using: var date = new Date('2020年11月06日T01:30:00.000Z'); console.log(date.toLocaleDateString()); console.log(date.toLocaleString()); console.log(date.toLocaleTimeString());

Question 5

My comment is to Example: (UTC Brazil) I typed "15**/12/2020 **22:30:00" and it sent: '2020-12-16T01:30:00.000Z'.

Question 6

Append 'UTC' to the string before converting it to a date in 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)"

Question 7

function localizeDateStr (date_to_convert_str) { var date_to_convert = new Date(date_to_convert_str); var local_date = new Date(); date_to_convert.setHours(date_to_convert.getHours()+local_date.getTimezoneOffset()); return date_to_convert.toString(); }

Question 8

@matt offSet returns minutes, not hours, you need to divide by 60

Question 9

This assumes that the date part of the string is following the US standard, mm/dd/YYYY, which is not obviously the case in Europe and in other parts of the world.

Question 10

@digitalbath Works on Chrome but doesn't work on Firefox.

Question 11

! Beware ! _...parsing of date strings with the Date constructor (and Date.parse, they are equivalent) is strongly discouraged due to browser differences and inconsistencies... (which probably was even more true in 2011)

Question 12

In my point of view servers should always in the general case return a datetime in the standardized ISO 8601-format.

More info here:

IN this case the server would return '2011-06-29T16:52:48.000Z' which would feed directly into the JS Date object.

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

The localDate will be in the right local time which in my case would be two hours later (DK time).

You really don't have to do all this parsing which just complicates stuff, as long as you are consistent with what format to expect from the server.

Question 13

how to get iso format date? i am getting date in UTC format with UTC appended to the end

Question 14

@Colin that's language dependent. In C# you can format a DateTime object with .toString("o") which returns a ISO-8601 formatted string as shown above. msdn.microsoft.com/en-us/library/zdtaw1bw(v=vs.110).aspx In javascript it's new Date().toISOString(). developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

Question 15

For some reason, appending UTC to my timestamp did not work. But appending a 'z' did.

Question 16

@Chaster johnson, nice catch. I was using Python's datetime.isoformat() to send some datetime info to my js frontend and adding 'Z' everything sorted out. Checking isoformat source, they do not have an option to add 'Z'. I manually added 'Z' to the end of isoformat output. stackoverflow.com/questions/19654578/…

Question 17

This is an universal solution:

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

Usage:

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

Display the date based on the client local setting:

date.toLocaleString();

Question 18

Does not work with all timezones. There is a good reason why getTimeZoneOffset is in minutes ! geographylists.com/list20d.html

Question 19

@siukurnin. so to manage weird timezone, use newDate.setTime(date.getTime()+date.getTimezoneOffset()*60*1000)

Question 20

newDate.setMinutes(date.getMinutes() - date.getTimezoneOffset()) would be enough. In corrects hours as well

Question 21

Sorry, but this answer is flawed on a few points. 1. Shifting the time by the amount of the offset will not change the time zone of the Date object. Data errors will appear where the value is near DST transitions of the local time zone. 2. A Date object is internally already in UTC. It's only when you use the non-UTC functions on it that it converts to the local time zone. So there's no such thing as a UTC Date object vs a Local Date object.

Question 22

This also doesn't seem to set the date properly when the timezone shift crosses midnight; possibly because it it's only using setHours which doesn't affect the date?

Question 23

For me above solutions didn't work.

With IE the UTC date-time conversion to local is little tricky. For me, the date-time from web API is '2018-02-15T05:37:26.007' and I wanted to convert as per local timezone so I used below code in JavaScript.

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

Question 24

@Kumaresan, yes it is the best solution, even if low rated, works with Firefox and Chromium too

Question 25

what is the best way to store DateTime using java in PostgreSQL? To overcome this problem. please tell me..

Question 26

Can someone explain, please, how this works ?..

Question 27

This works for me:

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

Question 28

Works, and is simpler than other solutions.

Question 29

You should get the (UTC) offset (in minutes) of the client:

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

And then do the correspondent adding or substraction to the time you get from the server.

Hope this helps.

Question 30

What about DST?

Question 31

This is incorrect, since the timezone offset will be different depending on the date used due to daylight saving time.

Question 32

Put this function in your head:

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

Then generate the following for each date in the body of your page:

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

To remove the GMT and time zone, change the following line:

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

Question 33

This is a simplified solution based on Adorjan Princ ́s answer:

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

or simpler (though it mutates the original date):

function convertUTCDateToLocalDate(date) {
 date.setMinutes(date.getMinutes() - date.getTimezoneOffset());
 return date;
}

Usage:

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

Question 34

Why was this downvoted on Oct 9 2017? Please write a comment to help me understand your opinion.

Question 35

Why do you have to convert the date to new Date twice? Once when you call the function and a second time in the function?

Question 36

@Sofia You are right. It's not really needed. I played around on wschools now and a simpified version also works. Maybe the duplicate new Date(...) came from debugging.

Question 37

I thought it was a necessary hack, thanks for clearing that up : )

Question 38

The "simpler" solution is not the better solution. It mutates the original date. The first option provided is the one you should use.

Question 39

if you have

"2021年12月28日T18:00:45.959Z" format

you can use this in js :

// myDateTime is 2021年12月28日T18:00:45.959Z
myDate = new Date(myDateTime).toLocaleDateString('en-US');
// myDate is 12/28/2021
myTime = new Date(myDateTime).toLocaleTimeString('en-US');
// myTime is 9:30:45 PM

you just have to put your area string instead of "en-US" (e.g. "fa-IR").

also you can use options for toLocaleTimeString like { hour: '2-digit', minute: '2-digit' }

myTime = new Date(myDateTime).toLocaleTimeString('en-US',{ hour: '2-digit', minute: '2-digit' });
// myTime is 09:30 PM

more information for toLocaleTimeString and toLocaleDateString

Question 40

After trying a few others posted here without good results, this seemed to work for me:

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

And this works to go the opposite way, from Local Date to UTC:

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

Question 41

Less code to use new Date(+date + date.getTimezoneOffset() * 6e4). ;-)

Question 42

it wont work , my time in utc is "2020年04月02日T11:09:00" , so tried this from Singapore , new Date(+new Date("2020年04月02日T11:09:00") + new Date("2020年04月02日T11:09:00").getTimezoneOffset() * 6e4) , giving wrong time

Question 43

this worked , new Date("2020年04月02日T11:09:00" + 'Z');

Question 44

Add the time zone at the end, in this case 'UTC':

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

after that, use toLocale()* function families to display the date in the correct locale

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

Question 45

Use this for UTC and Local time convert and vice versa.

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

Question 46

what happened at time of daylight saving. CET time zone

Question 47

see my answer @ stackoverflow.com/questions/6525538/…

Question 48

Matt's answer is missing the fact that the daylight savings time could be different between Date() and the date time it needs to convert - here is my solution:

 function ConvertUTCTimeToLocalTime(UTCDateString)
 {
 var convertdLocalTime = new Date(UTCDateString);
 var hourOffset = convertdLocalTime.getTimezoneOffset() / 60;
 convertdLocalTime.setHours( convertdLocalTime.getHours() + hourOffset ); 
 return convertdLocalTime;
 }

And the results in the debugger:

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

Question 49

this is converting to local timeZone , how can we convert to specific timezone without plus or minus in date value ?

Question 50

In case you don't mind usingmoment.js and your time is in UTC just use the following:

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

if your time is not in utc but any other locale known to you, then use following:

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

if your time is already in local, then use following:

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

Question 51

This is what I'm doing to convert UTC to my Local Time:

const dataDate = '2020-09-15 07:08:08'
const utcDate = new Date(dataDate);
const myLocalDate = new Date(Date.UTC(
 utcDate.getFullYear(),
 utcDate.getMonth(),
 utcDate.getDate(),
 utcDate.getHours(),
 utcDate.getMinutes()
));
document.getElementById("dataDate").innerHTML = dataDate; 
document.getElementById("myLocalDate").innerHTML = myLocalDate;

<p>UTC<p>
<p id="dataDate"></p>
<p>Local(GMT +7)<p>
<p id="myLocalDate"></p>

Result: Tue Sep 15 2020 14:08:00 GMT+0700 (Indochina Time).

Question 52

You have errors in your variable names... And maybe better to convert your code to Code snippet, so we can run and test?

Question 53

@Anton thank you for remind me. I've added Code snippet and fixed my code.

Question 54

To me the simplest seemed using

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

(i thought the first line could be enough but there are timezones which are off in fractions of hours)

Question 55

Does anyone have any issues with this? This seems like the best option for me. I took a UTC string which had "(UTC)" at the end of it, set it up as a Date object using new Date('date string'), and then added these two lines and it seems to be coming back with a time based completely off the server's UTC timestamp with adjustments made to make it match the user's local time. I do have to worry about the weird fractions-of-an-hour timezones too... Not sure if it holds up perfectly all the time...

Question 56

tried many other options, none of them worked, But this is working

Question 57

Using YYYY-MM-DD hh:mm:ss format :

var date = new Date('2011-06-29T16:52:48+00:00');
date.toString() // "Wed Jun 29 2011 09:52:48 GMT-0700 (PDT)"

For converting from the YYYY-MM-DD hh:mm:ss format, make sure your date follow the ISO 8601 format.

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月16日T19:20+01:00) 
Complete date plus hours, minutes and seconds:
 YYYY-MM-DDThh:mm:ssTZD (eg 1997年07月16日T19: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月16日T19: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)

Important things to note

You must separate the date and the time by a T, a space will not work in some browsers
You must set the timezone using this format +hh:mm, using a string for a timezone (ex. : 'UTC') will not work in many browsers. +hh:mm represent the offset from the UTC timezone.

Question 58

A JSON date string (serialized in C#) looks like "2015-10-13T18:58:17".

In angular, (following Hulvej) make a localdate filter:

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

Then, display local time like:

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

Question 59

For me, this works well

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

Question 60

I Answering This If Any one want function that display converted time to specific id element and apply date format string yyyy-mm-dd here date1 is string and ids is id of element that time going to display.

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

i know that answer has been already accepted but i get here cause of google and i did solve with getting inspiration from accepted answer so i did want to just share it if someone need.

Question 61

Do yourself a favour and use proper date /calendar functions.

Question 62

@Adorojan's answer is almost correct. But addition of offset is not correct since offset value will be negative if browser date is ahead of GMT and vice versa. Below is the solution which I came with and is working perfectly fine for me:

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

Question 63

This works on my side

Option 1: If date format is something like "yyyy-mm-dd" or "yyyy-mm-dd H:n:s", ex: "2021年12月16日 06:07:40"

With this format It doesnt really know if its a local format or a UTC time. So since we know that the date is a UTC we have to make sure that JS will know that its a UTC. So we have to set the date as UTC.

 function setDateAsUTC(d) {
 let date = new Date(d);
 return new Date(
 Date.UTC(
 date.getFullYear(),
 date.getMonth(),
 date.getDate(),
 date.getHours(),
 date.getMinutes(),
 date.getSeconds()
 )
 );
 }

and then use it


let d = "2021年12月16日 06:07:40";
setDateAsUTC(d).toLocaleString();
// output: 12/16/2021, 6:07:40 AM

Options 2: If UTC date format is ISO-8601. Mostly servers timestampz format are in ISO-8601 ex: '2011-06-29T16:52:48.000Z'. With this we can just pass it to the date function and toLocaleString() function.

let newDate = "2011年06月29日T16:52:48.000Z"
new Date(newDate).toLocaleString();
//output: 6/29/2011, 4:52:48 PM

Question 64

tl;dr (new Date('6/29/2011 4:52:48 PM UTC')).toString()

The source string must specify a time zone or UTC.

One-liner:

(new Date('6/29/2011 4:52:48 PM UTC')).toString()

Result in one of my web browsers:

"Wed Jun 29 2011 09:52:48 GMT-0700 (Pacific Daylight Time)"

This approach even selects standard/daylight time appropriately.

(new Date('1/29/2011 4:52:48 PM UTC')).toString()

Result in my browser:

"Sat Jan 29 2011 08:52:48 GMT-0800 (Pacific Standard Time)"

digitalbath digitalbath 7,3842 gold badges19 silver badges15 bronze badges · Accepted Answer · 2011-06-29 18:42:22Z

587

Append 'UTC' to the string before converting it to a date in 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)"

Share

Improve this answer

answered Jun 29, 2011 at 18:42

digitalbath's user avatar

digitalbath digitalbath

7,3842 gold badges19 silver badges15 bronze badges

17

6

function localizeDateStr (date_to_convert_str) { var date_to_convert = new Date(date_to_convert_str); var local_date = new Date(); date_to_convert.setHours(date_to_convert.getHours()+local_date.getTimezoneOffset()); return date_to_convert.toString(); }

mr_z_ro
– mr_z_ro

2012年10月09日 17:08:44 +00:00
Commented Oct 9, 2012 at 17:08
6

@matt offSet returns minutes, not hours, you need to divide by 60

bladefist
– bladefist

2013年05月18日 16:13:42 +00:00
Commented May 18, 2013 at 16:13
95

This assumes that the date part of the string is following the US standard, mm/dd/YYYY, which is not obviously the case in Europe and in other parts of the world.

AsGoodAsItGets
– AsGoodAsItGets

2015年01月14日 16:49:10 +00:00
Commented Jan 14, 2015 at 16:49
11

@digitalbath Works on Chrome but doesn't work on Firefox.

Ganesh Satpute
– Ganesh Satpute

2017年09月05日 13:30:50 +00:00
Commented Sep 5, 2017 at 13:30
14

! Beware ! _...parsing of date strings with the Date constructor (and Date.parse, they are equivalent) is strongly discouraged due to browser differences and inconsistencies... (which probably was even more true in 2011)

Stphane
– Stphane

2018年02月16日 08:08:26 +00:00
Commented Feb 16, 2018 at 8:08

| Show 12 more comments

CollectivesTM on Stack Overflow

Convert UTC date time to local date time

39 Answers 39

"2021年12月28日T18:00:45.959Z" format

This works on my side

Option 1: If date format is something like "yyyy-mm-dd" or "yyyy-mm-dd H:n:s", ex: "2021年12月16日 06:07:40"

Options 2: If UTC date format is ISO-8601. Mostly servers timestampz format are in ISO-8601 ex: '2011-06-29T16:52:48.000Z'. With this we can just pass it to the date function and toLocaleString() function.

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Linked

Hot Network Questions

CollectivesTM on Stack Overflow

39 Answers 39

"2021年12月28日T18:00:45.959Z" format

This works on my side

Option 1: If date format is something like "yyyy-mm-dd" or "yyyy-mm-dd H:n:s", ex: "2021年12月16日 06:07:40"

Options 2: If UTC date format is ISO-8601. Mostly servers timestampz format are in ISO-8601 ex: '2011-06-29T16:52:48.000Z'. With this we can just pass it to the date function and toLocaleString() function.

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Linked

Related