{"id":77,"date":"2008-02-24T03:40:43","date_gmt":"2008-02-24T10:40:43","guid":{"rendered":"http:\/\/www.milfont.org\/tech\/2008\/02\/13\/datas-e-fuso-horario-no-javascript\/"},"modified":"2020-07-03T14:40:08","modified_gmt":"2020-07-03T17:40:08","slug":"datas-e-fuso-horario-no-javascript","status":"publish","type":"post","link":"https:\/\/www.milfont.org\/tech\/2008\/02\/24\/datas-e-fuso-horario-no-javascript\/","title":{"rendered":"Datas e Fuso hor\u00e1rio no Javascript"},"content":{"rendered":"<p>As opera\u00e7\u00f5es com datas no javascript sofrem da varia\u00e7\u00e3o de fuso hor\u00e1rio no qual a m\u00e1quina cliente est\u00e1 configurada.<\/p>\n<p>Certa oportunidade tive que consertar uma fun\u00e7\u00e3o que apresentava diferen\u00e7a entre datas e ningu\u00e9m sabia o porque. Quando voc\u00ea instancia uma data, o retorno dela aparecer\u00e1 assim:&#8221;Thu Feb 14 2008 08:41:27 <strong>GMT-0300<\/strong> (Hora oficial do Brasil)&#8221;.<\/p>\n<p>Observe que na data consta o GMT (<a href=\"http:\/\/en.wikipedia.org\/wiki\/Greenwich_Mean_Time\">Greenwich Mean Time<\/a>) que indica em que fuso hor\u00e1rio a data est\u00e1 configurada.<\/p>\n<p>Vou demonstrar como evitar a diferen\u00e7a de tempo provocada por isso em opera\u00e7\u00f5es com data. Para isso basta criar uma fun\u00e7\u00e3o que converta a data sempre para o fuso que se espera.<\/p>\n<pre lang=\"javascript\"> var calcularFuso = function(data, offset) {\n\n    var milisegundos_com_utc = data.getTime() + (data.getTimezoneOffset() * 60000);\n    return new Date(milisegundos_com_utc + (3600000 * offset));\n\n }<\/pre>\n<p>Observe que na linha 3, invocamos o m\u00e9todo <em><strong>getTime()<\/strong><\/em> que converte o momento local da data para um n\u00famero representado pelos milisegundos desde 1\u00ba de Janeiro de 1970 (<a href=\"http:\/\/en.wikipedia.org\/wiki\/Unix_time\">Unix Epoch<\/a>). Obtemos o atual fuso hor\u00e1rio que est\u00e1 configurado no browser pelo m\u00e9todo <em><strong>getTimezoneOffset()<\/strong><\/em> da API de data no javascript e multiplicamos pelos milisegundos de tempo de uma hora. Somamos ent\u00e3o os dois valores.<\/p>\n<p>Porque uma hora? Porque esse \u00e9 o tempo que representa cada fuso hor\u00e1rio. Por default esse m\u00e9todo retorna esse fuso hor\u00e1rio em minutos, por isso a convers\u00e3o em hora \u00e9 necess\u00e1ria.<\/p>\n<p>Para chegar nesse n\u00famero 60000 voc\u00ea tem que lembrar que 1 segundo tem 1000 milisegundos e que 1 minuto tem 60 segundos, ent\u00e3o convertendo minutos para milisegundos multiplicamos 60 * 1000 = 60000.<\/p>\n<p>Nesse momento temos o UTC (<a href=\"http:\/\/en.wikipedia.org\/wiki\/Coordinated_Universal_Time\">Coordinated Universal Time<\/a>) representado pela vari\u00e1vel &#8220;utc&#8221; pela soma do momento local mais o fuso hor\u00e1rio local em milisegundos.<\/p>\n<p>Precisamos agora obter uma data a partir desse UTC somado com o fuso hor\u00e1rio de destino, como por exemplo uma data expressa no fuso +5 transformado no fuso do Brasil (hora de Bras\u00edlia) -3.<\/p>\n<p>Observe que na linha 5 que obtemos um offset (representa\u00e7\u00e3o do fuso) em hora e convertemos para milisegundos. Lembre-se aqui que 1 segundo tem 1000 milisegundos e que 1 hora tem 3600 segundos, portanto converter hora em milisegundo deve-se multiplicar 1000 * 3600 = 3600000.<\/p>\n<p>Somamos esse resultado com o valor da vari\u00e1vel &#8220;utc&#8221; e obtemos o momento para o fuso hor\u00e1vel desejado, a partir da\u00ed criamos uma nova data com base no long apropriado e retornamos essa nova data.<\/p>\n<p>Dessa forma conseguimos manter a integridade desejada na aplica\u00e7\u00e3o quando precisamos expressar a data no fuso hor\u00e1rio correto.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>As opera\u00e7\u00f5es com datas no javascript sofrem da varia\u00e7\u00e3o de fuso hor\u00e1rio no qual a m\u00e1quina cliente est\u00e1 configurada. Certa oportunidade tive que consertar uma fun\u00e7\u00e3o que apresentava diferen\u00e7a entre datas e ningu\u00e9m sabia o porque. Quando voc\u00ea instancia uma data, o retorno dela aparecer\u00e1 assim:&#8221;Thu Feb 14 2008 08:41:27 GMT-0300 (Hora oficial do Brasil)&#8221;. [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[23,8],"tags":[115,117,372,116],"_links":{"self":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts\/77"}],"collection":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/comments?post=77"}],"version-history":[{"count":2,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts\/77\/revisions"}],"predecessor-version":[{"id":1903,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts\/77\/revisions\/1903"}],"wp:attachment":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/media?parent=77"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/categories?post=77"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/tags?post=77"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}