使用前须知
心知天气api直接使用会出现跨域,查阅心知天气api文档后发现它支持jsonp,故可使用该方法。
jsonp是一种跨域通信的手段,只支持get方法,而且需要后端代码的配合
心知天气获取签名
心知天气规定JSONP 方式调用必须使用签名验证方式,我们首先来获取签名,并生成请求参数
注册账号,获取私钥和公钥按如下方法获取签名,并生成请求参数
1. 构造验证参数字符串
将请求参数按照参数名字典升序排列后,把所有参数 param=value 用
&
连接起来,类似 URI 中 QueryString 的构造方式。目前支持的参数有:UNIX 时间戳ts
(单位为秒,转换成字符串长度为 10 位,不要用毫秒值)、签名失效时间ttl
(单位为秒,缺省为 1800,可选)和公钥uid
。例:ts=1443079775&ttl=300&uid=your_public_key
2. 使用 HMAC-SHA1 方式,以 API 密钥中的“私钥”对上一步生成的参数字符串进行加密。
常见程序语言通常会内置加密函数,或通过扩展库提供支持。例如在 NodeJS 中,您可以使用
crypto
模块中的中的createHmac
函数,例:crypto.createHmac("sha1", your_private_key)
。3. 将上一步生成的加密结果用 Base64 编码,并做一个 URLEncode,得到签名 sig。
步骤(1)中的参数例子用 base64 编码后得到的结果为
dTYeoN8WdOfW4PiwgEdLa0gWFzo=
,做完 urlencode 最终得到的签名 sig 为dTYeoN8WdOfW4PiwgEdLa0gWFzo%3d
4. 将上一步得到的签名 sig 附在第一步构造的参数字符串后,作为请求的一个参数发送。
上述例子里,请求参数即为
ts=1443079775&ttl=300&uid=your_public_key&sig=dTYeoN8WdOfW4PiwgEdLa0gWFzo%3d
上面第一步的UNIX时间戳直接百度搜,第一步搞定后直接使用如下代码生成sig
//记得npm i cryptovar crypto = require('crypto');var hmac = crypto.createHmac('sha1', '你的私钥');hmac.update('第一步生成的东西');//生成sigconsole.log('sig='+hmac.digest('base64'));
得到sig后整合一下得到请求参数,例:ts=1443079775&ttl=300&uid=your_public_key&sig=dTYeoN8WdOfW4PiwgEdLa0gWFzo%3d
在vue中使用jsonp
安装vue-jsonp
npm i vue-jsonp -S
在 src/main.js 中
import Vue from 'vue'import {vueJsonp} from 'vue-jsonp'Vue.use(vueJsonp)
使用
this.$jsonp('/v3/weather/daily.json?&location=beijing'+'你得到的请求参数').then((res) => {console.log(res)}).catch((err) => {console.log(err)})