JSON Stringify changes time of date because of UTC

Question

My date objects in JavaScript are always represented by UTC  2 because of where I am located  Hence like this  Mon Sep 28 10 00 00 UTC 0200 2009   Problem is doing a JSON stringify converts the above date to   2009-09-28T08 00 00Z   notice 2 hours missing i e  8 instead of 10    What I need is for the date and time to be honoured but it s not  hence it should be  2009-09-28T10 00 00Z   this is how it should be    Basically I use this   var jsonData   JSON stringify jsonObject     I tried passing a replacer parameter  second parameter on stringify  but the problem is that the value has already been processed   I also tried using toString   and toUTCString   on the date object  but these don t give me what I want either    Can anyone help me

User · Answer

JavaScript normally convert local timezone to UTC     date   new Date    date setMinutes date getMinutes  -date getTimezoneOffset    JSON stringify date

User · Answer

Here is another answer  and personally I think it s more appropriate   var currentDate   new Date     currentDate   JSON stringify currentDate       Now currentDate is in a different format    oh gosh what do we do     currentDate   new Date JSON parse currentDate        Now currentDate is back to its original form

User · Answer

Usually you want dates to be presented to each user in his own local time-  that is why we use GMT  UTC    Use Date parse jsondatestring  to get the local time string   unless you want your local time shown to each visitor    In that case  use Anatoly s method

User · Answer

All boils down to if your server backend is timezone-agnostic or not  If it is not  then you need to assume that timezone of server is the same as client  or transfer information about client s timezone and include that also into calculations   a PostgreSQL backend based example   select  2009-09-28T08 00 00Z   timestamp - gt   2009-09-28 08 00 00   wrong for 10am  select  2009-09-28T08 00 00Z   timestamptz - gt   2009-09-28 10 00 00 02  select  2009-09-28T08 00 00Z   timestamptz  timestamp - gt   2009-09-28 10 00 00    The last one is probably what you want to use in database  if you are not willing properly implement timezone logic

User · Answer

Out-of-the-box solution to force JSON stringify ignore timezones   Pure javascript  based on Anatoliy answer     x000D   x000D     Before  JSON stringify apply timezone offset const date    new Date    let string   JSON stringify date   console log string       After  JSON stringify keeps date as-is  Date prototype toJSON   function        const hoursDiff   this getHours   - this getTimezoneOffset     60      this setHours hoursDiff       return this toISOString       string   JSON stringify date   console log string   x000D   x000D   x000D   Using moment   moment-timezone libraries   x000D   x000D  const date    new Date    let string   JSON stringify date   console log string    Date prototype toJSON   function        return moment this  format  YYYY-MM-DDTHH mm ss ms        string   JSON stringify date   console log string   x000D   lt html gt     lt header gt       lt script src  https   momentjs com downloads moment min js  gt  lt  script gt       lt script src  https   momentjs com downloads moment-timezone-with-data-10-year-range min js  gt  lt  script gt   lt  header gt   lt  html gt  x000D   x000D   x000D

User · Answer

JSON uses the Date prototype toISOString function which does not represent local time -- it represents time in unmodified UTC -- if you look at your date output you can see you re at UTC 2 hours  which is why the JSON string changes by two hours  but if this allows the same time to be represented correctly across multiple time zones

User · Answer

Recently I have run into the same issue  And it was resolved using the following code   x   new Date    let hoursDiff   x getHours   - x getTimezoneOffset     60  let minutesDiff    x getHours   - x getTimezoneOffset      60  x setHours hoursDiff   x setMinutes minutesDiff

User · Answer

I m a little late but you can always overwrite the toJson function in case of a Date using Prototype like so   Date prototype toJSON   function        return Util getDateTimeString this        In my case  Util getDateTimeString this  return a string like this   2017-01-19T00 00 00Z

User · Answer

I tried this in angular 8     create Model     export class Model   YourDate  string   Date     in your component  model   Model  model YourDate   new Date     send Date to your API for saving  When loading your data from API you will make this    model YourDate   new Date model YourDate  Z      you will get your date correctly with your time zone

User · Answer

In this case I think you need transform the date to UNIX timestamp timestamp   testDate getTime    strJson   JSON stringify timestamp    After that you can re use it to create a date object and format it  Example with javascript and toLocaleDateString   https   developer mozilla org fr docs Web JavaScript Reference Objets globaux Date toLocaleDateString   newDateObject   new Date JSON parse strJson    newDateObject   newDateObject toLocalDateStrin      quot fr-FR quot        If you use stringify to use AJAX  now it s not useful  You just need to send timestamp and get it in your script   newDateObject   new  DateTime     newDateObject- gt setTimestamp round  timestamp 1000     Be aware that getTime   will return a time in milliseconds and the PHP function setTimestamp take time in seconds  It s why you need to divide by 1000 and round

User · Answer

Here is something really neat and simple  atleast I believe so     and requires no manipulation of date to be cloned or overloading any of browser s native functions like toJSON  reference  How to JSON stringify a javascript Date and preserve timezone  courtsy Shawson   Pass a replacer function to JSON stringify that stringifies stuff to your heart s content    This way you don t have to do hour and minute diffs or any other manipulations   I have put in console logs to see intermediate results so it is clear what is going on and how recursion is working  That reveals something worthy of notice  value param to replacer is already converted to ISO date format     Use this key  to work with original data   var replacer   function key  value        var returnVal   value      if this key  instanceof Date                console log  replacer called with key -    key    value -    value  this key              returnVal   this key  toString                Above line does not strictly speaking clone the date as in the cloned object             it is a string in same format as the original but not a Date object  I tried             multiple things but was unable to cause a Date object being created in the             clone              Please Heeeeelp someone here           returnVal   new Date JSON parse JSON stringify this key          OR         returnVal   new Date this key        OR         returnVal   this key       careful  returning original obj so may have potential side effect               console log  returning value     returnVal           if undefined is returned  the key is not at all added to the new object i e  clone           so return null  null     undefined but both are falsy and can be used as such       return this key      undefined   null   returnVal      ab    prop1   p1   prop2   1   str2    p1   p1inner   p2  undefined  p3  null  p4date  new Date       var abstr   JSON stringify ab  replacer   var abcloned   JSON parse abstr   console log  ab is     ab   console log  abcloned is     abcloned       abcloned is          prop1    p1      prop2         1       str2                p1    p1inner          p2   null         p3   null         p4date    Tue Jun 11 2019 18 47 50 GMT 0530  India Standard Time               Note p4date is string not Date object but format and timezone are completely preserved

User · Answer

Got around this issue by using the moment js library  the non-timezone version    var newMinDate   moment datePicker selectedDates 0    var newMaxDate   moment datePicker selectedDates 1        Define the data to ask the server for var dataToGet     ArduinoDeviceIdentifier   Temperatures                    StartDate  newMinDate format  YYYY-MM-DD HH mm                     EndDate  newMaxDate format  YYYY-MM-DD HH mm       alert JSON stringify dataToGet      I was using the flatpickr min js library  The time of the resulting JSON object created matches the local time provided but the date picker

User · Answer

I run into this a bit working with legacy stuff where they only work on east coast US and don t store dates in UTC  it s all EST  I have to filter on the dates based on user input in the browser so must pass the date in local time in JSON format   Just to elaborate on this solution already posted - this is what I use      Could be picked by user in date picker - local JS date date   new Date        Create new Date from milliseconds of user input date  date getTime   returns milliseconds     Subtract milliseconds that will be offset by toJSON before calling it new Date date getTime   -  date getTimezoneOffset     60000   toJSON      So my understanding is this will go ahead and subtract time  in milliseconds  hence 60000  from the starting date based on the timezone offset  returns minutes  - in anticipation for the addition of time toJSON   is going to add

User · Answer

you can use moment js to format with local time   Date prototype toISOString   function          return moment this  format  YYYY-MM-DDTHH mm ss

User · Answer

date toJSON   prints the UTC-Date into a String formatted  So adds the offset with it when converts it to JSON format    date   new Date    new Date date getTime   -  date getTimezoneOffset     60000   toJSON

User · Answer

Instead of toJSON  you can use format function which always gives the correct date and time   GMT     This is the most robust display option  It takes a string of tokens   and replaces them with their corresponding values

User · Answer

Just for the record  remember that the last  Z  in  2009-09-28T08 00 00Z  means that the time is indeed in UTC   See http   en wikipedia org wiki ISO 8601 for details

[javascript] JSON Stringify changes time of date because of UTC

Examples related to javascript

Examples related to json

Examples related to datetime

Examples related to utc