小程序调用百度api天气接口

作者: 前端来入坑 | 来源:发表于2018-09-21 15:21 被阅读10次

demo下载地址 https://github.com/baidumapapi/wxapp-jsapi

  • 配置服务器合法域名 image.png
  • 在demo中修改自己的AK

// 引用百度地图微信小程序JSAPI模块 
var bmap = require('../../libs/bmap-wx.js'); 
Page({ 
    data: { 
        weatherData: '' 
    }, 
    onLoad: function() { 
        var that = this; 
        // 新建百度地图对象 
        var BMap = new bmap.BMapWX({ 
            ak: '修改为自己的ak' 
        }); 
        var fail = function(data) { 
            console.log(data) 
        }; 
        var success = function(data) { 
            var weatherData = data.currentWeather[0]; 
            weatherData = '城市:' + weatherData.currentCity + '\n' + 'PM2.5:' + weatherData.pm25 + '\n' +'日期:' + weatherData.date + '\n' + '温度:' + weatherData.temperature + '\n' +'天气:' + weatherData.weatherDesc + '\n' +'风力:' + weatherData.wind + '\n'; 
            that.setData({ 
                weatherData: weatherData 
            }); 
        } 
        // 发起weather请求 
        BMap.weather({ 
            fail: fail, 
            success: success 
        }); 
    } 
})
image.png

注意:demo中改动var fail = function(data) { console.log(data) };如果调用失败会出现报错信息,按照以上步骤检查一遍,就调用成功了。

另外demo中有weather天气查询之外还有:

  • PIO检索search------例如:检索周边饭店


    image.png
  • PIO检索热词联想suggestion------就是关键词搜索


    image.png
  • 逆地址解析regeocoding------可以理解为定位


    image.png

相关文章

  • 小程序调用百度api天气接口后续

    没看前面文章的朋友可以先看这篇小程序调用百度api天气接口https://www.jianshu.com/p/ef...

  • 小程序调用百度api天气接口

    demo下载地址 https://github.com/baidumapapi/wxapp-jsapi 百度接...

  • 小程序调用图片接口API并居中显示

    写完调用天气接口的demo之后,小程序调用天气接口并且渲染在页面https://www.jianshu.com/p...

  • 小程序api接口调用尝试

    在这里我通过百度地图的api来举例子。 这里的请求是通过wx.request来实现的,我们先来看一下官方文档是怎么...

  • 8.25兄弟会

    js调用百度地图api实现定位 百度地图的API,接口很丰富,实现定位功能 // 百度地图API功能 varmap...

  • 合理的使用Http Cache

    啰嗦一下 正在做一个关于天气的小项目,使用的是百度的公共API接口(接口调用限制6000/次),其实就是和风天气(...

  • 微信小程序如何调用后台接口

    本课程讲解了微信小程序如何调用线上API中心接口,主要使用了wx.request去和API中心交互,API中心提供...

  • Flask 2.2.x 将结果集数据序列化出现TypeError

    前言 最近学习开发小程序,需要个后端提供API,于是选择了小而美的flask。 原想调用API接口,从数据库返回的...

  • 接口测试概述

    一.什么是接口 1.API 2.软件接口、硬件接口 3.很多程序提供API供大众调用 二 接口测试 1.什么是接口...

  • 39

    今天调用了百度地图的小程序api,又看了几个小程序demo,然后看到了mpvue明天打算试一试

网友评论

    本文标题:小程序调用百度api天气接口

    本文链接:https://www.haomeiwen.com/subject/zgsanftx.html