Chinaunix首页 | 论坛 | 博客
  • 博客访问: 26103
  • 博文数量: 15
  • 博客积分: 0
  • 博客等级: 民兵
  • 技术积分: 165
  • 用 户 组: 普通用户
  • 注册时间: 2019-11-07 11:02
文章分类
文章存档

2019年(15)

我的朋友

分类: JavaScript

2019-11-08 14:35:33

设置Google时区API

Google的时区API提供了一个简单的界面,可获取地球上任何位置的时区和DST(夏令时)偏移量。要使用它,只需发出以下请求:

json /?parameters

如果希望返回的数据使用XML而不是JSON格式,则可以用字符串“ xml ” 替换 “ json ” ,并且 应包含以下3条信息:parameters

Google时区API调用的预期参数:

location:用逗号分隔的纬度和经度元组(即:)location=37.3711, -122.0375,代表要查找的确切位置。

timestamp:自1970年1月1日午夜以来的所需日期和时间,以秒为单位。API使用 timestamp来确定是否应应用夏时制。1970年之前的时间可以表示为负值。

key:您的应用程序的API密钥。要从您的站点向API发出请求,需要此免费密钥。

在下一部分中,我们将详细介绍如何定义前两个参数,尽管在所有其他操作之前,您首先需要获取Google API密钥才能从您的网站访问时区API。为此,只需按照 本页上的说明进行操作 。如果您已经设置了API密钥并想再次对其进行修改或修改,请直接跳至 Google控制台页面。

这是一个格式完整的时区API调用字符串的示例,该字符串在2016年11月4日前到达 加拿大温哥华

json?location= 49.283436,-123.130429&timestamp = 1478880000&key = YOUR_API_KEY

返回的数据:

例如,通过Ajax进行调用后,返回的数据将采用JSON字符串的形式:

{

   "dstOffset": 3600,

   "rawOffset": -28800,

   "status": "OK",

   "timeZoneId": "America/Vancouver",

   "timeZoneName": "Pacific Daylight Time"

}

在加拿大温哥华,2016年夏令时于3月13日至11月6日生效。由于请求的日期2016年11月4日在该范围内,因此返回的数据反映了这一点。该"dstOffset" (秒)参数告诉我们对于时间和地点,抵消了DST(夏令)是相对于通用时间1小时(3600秒)。在“ rawOffset”属性告诉我们,这相对于通用时间时区的标准偏差(以秒为一次),一边从任何夏令偏移。

简而言之,任何位置的本地时间都是通过将“ timestamp”参数的值与返回的"dstOffset",“ rawOffset”值相加而得出的。但这只是一个太简单的解释,所以让我们继续挖掘。

为地球上特定位置的当前日期/时间准备参数

现在让所有这些理论付诸实践,以实际获得世界上特定位置的当前日期和时间。东京呢?曾经去过那里,喜欢昂贵的交通以外的一切!我们需要东京的纬度和经度坐标,以及从UTC 1970年1月1日午夜起的当前通用日期和时间(以秒为单位)timestamp来构建参数“ ”,以构造相应的时区请求:

varloc = '35.731252, 139.730291'// Tokyo expressed as lat,lng tuple

vartargetDate = newDate() // Current date/time of user computer

vartimestamp = targetDate.getTime()/1000 + targetDate.getTimezoneOffset() * 60 // Current UTC date/time expressed as seconds since midnight, January 1, 1970 UTC

varapikey = 'YOUR_TIMEZONE_API_KEY_HERE'


varapicall = 'json?location='+ loc + '×tamp='+ timestamp + '&key='+ apikey

让我们来看看我们如何得出上述值:

-获取位置的经度和纬度

要使用Google Maps获取位置的纬度和经度,请在Google Maps中输入所需的地址(在本例中为“ Tokyo Japan”),然后按Enter。然后,右键单击地图上的位置名称(“东京”)以弹出上下文菜单。选择并单击菜单项“ 这里是什么 ”以显示该位置的卡片,其纬度和经度显示在底部:


或者,您可以使用latlong.net之类的网站 来获取这些密码。

-获取timestamp任何日期的值

timestampGoogle时区API 的参数期望所需的日期和时间以自世界标准时间1970年1月1日午夜以来的秒数表示。对于当前时间,这是通过首先实例化date对象以获取用户计算机的当前本地时间,然后使用 Date.getTimezoneOffset()将其UTC偏移(以分钟为单位)添加到该对象来计算的 :

vartargetDate = newDate() // Current date/time of user computer

vartimestamp = targetDate.getTime()/1000 + targetDate.getTimezoneOffset() * 60 // Current UTC date/time expressed as seconds since midnight, January 1, 1970 UTC

由于timestamp参数应该以秒为单位,因此我们需要做一些数学运算以将当前日期及其UTC偏移量锤入该单位。在那里,我们得到了一个时间戳,该时间戳代表了自UTC 1970年1月1日午夜以来的当前时间和日期,正如医生所命令的那样。

如果您感兴趣的目标日期不是当前日期/时间,则只需在new Date()实例化时将特定的日期字符串传入其中即可,例如:

1个vartargetDate = newDate('December 25, 2025')

这对于将来或以前的相关应用很有用,例如倒计时2025年圣诞节东京时间。在 此处查看实例化Date对象的 多种方法。

最后,apicall变量现在包含Google时区请求,我们可以获取该请求以获取一些有用的信息:

1个varapicall = 'json?location='+ loc + '×tamp='+ timestamp + '&key='+ apikey

拨打电话即可获取地球上特定位置的时间

现在,我们准备使用Ajax接电话并使用上面刚刚构建的请求字符串调用Time Zone API。返回的数据为我们提供了东京的正确时区和夏令时偏移量,然后我们可以使用它们来确定该城市的正确日期和时间:

varloc = '35.731252, 139.730291'// Tokyo expressed as lat,lng tuple

vartargetDate = newDate() // Current date/time of user computer

vartimestamp = targetDate.getTime()/1000 + targetDate.getTimezoneOffset() * 60 // Current UTC date/time expressed as seconds since midnight, January 1, 1970 UTC

varapikey = 'YOUR_TIMEZONE_API_KEY_HERE'

varapicall = 'json?location='+ loc + '×tamp='+ timestamp + '&key='+ apikey


varxhr = newXMLHttpRequest() // create new XMLHttpRequest2 object

xhr.open('GET', apicall) // open GET request

xhr.onload = function(){

    if(xhr.status === 200){ // if Ajax request successful

        varoutput = JSON.parse(xhr.responseText) // convert returned JSON string to JSON object

        console.log(output.status) // log API return status for debugging purposes

        if(output.status == 'OK'){ // if API reports everything was returned successfully

            varoffsets = output.dstOffset * 1000 + output.rawOffset * 1000 // get DST and time zone offsets in milliseconds

            varlocaldate = newDate(timestamp * 1000 + offsets) // Date object containing current time of Tokyo (timestamp + dstOffset + rawOffset)

            console.log(localdate.toLocaleString()) // Display current Tokyo date and time

        }

    }

    else{

        alert('Request failed.  Returned status of '+ xhr.status)

    }

}

xhr.send() // send request

输出:

现在让我们回顾一下重要的部分:

我们创建XMLHttpRequest()(第2级)的新实例,以向时区API发出Ajax请求。FYI XMLHttpRequest2是原始XMLHttpRequest 对象的改进版本,并且在所有现代浏览器和IE10 +中均受支持。如果您需要更多的浏览器支持,您当然可以恢复为原始版本,但是我喜欢较新版本的简单性。

在内部xhr.onload,我们检查Ajax请求是否成功(status == 200),然后检索返回的数据(JSON字符串格式),然后使用将其转换为实际的JSON对象 。最终结果看起来与此类似,但是以对象的形式。 JSON.parse

在JSON对象内部output,我们检查其 status属性以确保时区API不会在获取请求的时区信息时遇到任何麻烦。值“ OK”表示一切正常,而其他任何值都需要飞行员注意。 

现在我们准备开始工作。我们从JSON对象中检索目标位置中当前时间的DST偏移量和时区偏移量值。我们将这两个值转换为毫秒,然后将它们相加得出总偏移量。

通过将timestamp参数的值与总偏移量相加得出目标位置的日期和时间timestamp + dstOffset + rawOffset。单位为毫秒,因此我们可以将结果直接输入到JavaScript的Date()对象中,以获得作为Date对象的目标日期和时间。

从那里开始,我们想要在当前东京时间做的事情才是极限!在上述情况下,我们只是选择以本地的,对人类友好的格式进行显示。

说到天空,让我们在当地时间的努力下再攀高一点。如何创建地球上任何位置的实时显示?接下来,我们将做。

阅读(5244) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~