【问题标题】:How to guess user's timezone using date-fns?如何使用 date-fns 猜测用户的时区?
【发布时间】:2019-06-30 12:23:32
【问题描述】:

我有一个要求,我需要在当地时区显示用户的时间。这需要使用 date-fns 来完成。

以下代码检查当前时间,然后给定一个时区,根据时区将其转换为本地时间。

const { formatToTimeZone } = require('date-fns-timezone')

let date = new Date()
const format = 'D.M.YYYY HH:mm:ss [GMT]Z (z)'
const output = formatToTimeZone(date, format, { timeZone: 'Asia/Calcutta' })

但是,我如何即时猜测用户的时区?

在moment.js,您可以通过moment.tz.guess() 获取。但是如果没有moment.js 和使用date-fns,我该怎么做呢?

https://runkit.com/embed/835tsn9a87so

更新:我将在 VueJS 应用程序中使用它。因此,如果有任何其他相关的解决方案,也欢迎。谢谢。

【问题讨论】:

  • 您无需猜测任何内容。每当您创建新的日期对象时,浏览器都会自动提供时区。
  • 好的。是否可以在我的应用程序中明确读取它?举例来说,如果我想显示一条消息,例如 You are in 'x/y' time zone。
  • @asanas 我建议您更改问题的标题并删除 VueJS 应用程序中的“?”因为您的问题在任何 js 应用程序中都有效。最好也删除 vue 标签。
  • @ImanMahmoudinasab 完成。谢谢!

标签: javascript timezone date-fns


【解决方案1】:

为了获取用户的 IANA 时区标识符,大多数现代浏览器现在都支持以下内容:

Intl.DateTimeFormat().resolvedOptions().timeZone

也就是说,您需要从date-fns-timezone 使用formatToTimeZone 的通常原因是当您需要使用用户本地区域以外的其他时区时。否则,您通常可以只使用来自date-fns 的format 函数。

但是,在您的情况下,您还尝试使用 z 格式说明符来显示用户的时区缩写。这不是由 date-fns 直接提供的,因此如果这很关键,那么您确实需要使用上面显示的 Intl api 获取用户的时区并使用 formatToTimeZone。

请记住,尽管这些缩写是 IANA 数据记录的任何内容,只有英文版本,并且没有针对每个时区的缩写。如果没有,您将看到一个数值,例如-02。

此外,许多缩写词可能不明确(例如 IST 中的 I 可能表示印度、以色列或爱尔兰,以及许多其他...)。因此,在大多数情况下,如果您不需要缩写,通常最好不用它。

【讨论】:

    【解决方案2】:

    刚刚自己解决了一个类似的问题。诀窍是使用来自date-fns-tz 的format 函数,而不是来自date-fns 的函数。

    import { format } from "date-fns";
    console.log(format(new Date(), "yyyy-MM-dd HH:mm z"));
    // 2021-11-29 13:55 GMT-8
    
    import { format } from "date-fns-tz";
    console.log(format(new Date(), "yyyy-MM-dd HH:mm z"));
    // 2021-11-29 13:55 PST
    

    在此处查看文档: https://date-fns.org/v2.27.0/docs/Time-Zones

    【讨论】:

      猜你喜欢
      • 2021-04-01
      • 2020-12-18
      • 2021-09-27
      • 2021-05-07
      • 2019-02-03
      • 2021-08-21
      • 1970-01-01
      • 2021-03-05
      • 2011-03-30
      相关资源
      最近更新 更多