下面我们来具体看看
一、uni.request封装成Promise
uni.request(OBJECT)
OBJECT对象描述:
1、根目录下新建 commons/http.js 文件
2、封装uni.request()
有人肯定会问,人家uni.request()已经挺好的了,为什么非的在封装一次了?
其实上图代码已经给你答案了:可以全局处理所有的请求。
比如: 1、所有请求都添加了 uni.showLoading(), 请求都会有loading,请求完成关闭。当然你可以通过options参数来控制某个请求不需要loadin;
2、可以给所有请求添加请求头,比如需要验证权限的接口;
3、错误集中处理,判断错误码,处理所有请求错误,如token过期,都会去登录页面等。
二、获取当前位置 获取当前的地理位置、速度。 在微信小程序中,当用户离开应用后,此接口无法调用;当用户点击“显示在聊天顶部”时,此接口可继续调用。
uni.getLocation(OBJECT)
OBJECT对象描述:
uni.getLocation({
// 默认为 wgs84 返回 gps 坐标,
// gcj02 返回国测局坐标,可用于 uni.openLocation 的坐标
type: 'wgs84',
geocode: true,
success: (data) => {
if (data.address){
this.location = data;
}
},
fail: (err) => {
console.log(err)
// this.$api.msg('获取定位失败');
}
})
页面使用location渲染:
<view class="fs-32">{{location.address.city}}</view>
<view class="fs-16">{{location.address.district}}</view>
如果你用HBuilderX自动浏览器是可以获取到经纬度的,但是也是没有城市等数据的,只有APP才有。
小程序如果获取经纬度还需要添加配置,修改根目录下的manifest.json文件
注意 1、H5:在较新的手机浏览器上,H5 端获取定位信息,要求部署在 https 服务上,本地预览(localhost)仍然可以使用 http 协议。
2、H5:无 GPS 模块的 PC 设备使用 Chrome 浏览器的时候,位置信息是连接谷歌服务器获取的,国内用户可能获取位置信息失败。
3、H5:微信公众号可使用微信js sdk,详见
4、App:Android由于谷歌服务被墙,想在国产手机上正常定位,需要向高德等三方服务商申请SDK资质,获取AppKey。云打包时需要在manifest的SDK配置中填写Appkey。在manifest可视化界面有详细申请指南。离线打包自行在原生工程中配置。
5、App:<map>
组件默认为国测局坐标gcj02,调用 uni.getLocation 返回结果传递给 <map>
组件时,需指定 type 为 gcj02。
6、App:持续定位方案:iOS端可以申请持续定位权限,参考。Android如果进程被杀,代码无法执行。可以使用unipush,通过服务器激活App,执行透传消息,让App启动然后采集位置。Android上,即使自己写原生插件做后台进程,也很容易被杀,unipush是更合适的方案 7、小程序:api默认不返回详细地址中文描述。需要中文地址有2种方式:1、使用高德地图小程序sdk,在app和微信上都可以获得中文地址,参考。2、只考虑app,使用plus.geolocation也可以获取中文地址
有小伙伴肯定会问,为什么选择高德天气查询API?我想说每个人都有自己的选择,根据自己的喜好,第一印象就可以了。没有那么多为什么!
如何才能使用高德天气查询API呢?
第一步,申请”web服务 API”密钥(Key);
第二步,拼接HTTP请求URL,第一步申请的Key需作为必填参数一同发送;
第三步,接收HTTP请求返回的数据(JSON或XML格式),解析数据。
假设我们已经获取到了Key,我们就可以使用我们封装好的http.js,来调用天气查询接口。
http({
methods: 'get',
url: '//restapi.amap.com/v3/weather/weatherInfo',
data: {
// 申请web服务API类型KEY
key: 'd99xxxe00xxb69xxxec61xx96xxf5',
// 城市的adcode
// (高德提供一份非常完整的城市列表)
city: '440300',
// 可选值:base/all
// base:返回实况天气
// all:返回预报天气
extensions: 'base',
// 可选值:JSON,XML
output: 'json'
}
}).then((data) =>{
console.log(data)
}, (err) => {
console.log(err)
})
实况天气响应结果: