又挖到了一个天气Api接口(附使用示例)

mengkun 16.9K 22

网上的大多数天气接口要么是收费的，要么只支持 iframe 嵌入方式，根本就没法用……

今天“不小心”从 360 那挖到了一个支持 json 的天气接口，支持自动判断地区，获取最近五天的天气，支持天气相关信息展示。非常好用！

接口请求格式如下：

  1. http://cdn.weather.hao.360.cn/sed_api_weather_info.php?app=360chrome&code=【地区编码】&_jsonp=【jsonp回调函数】  

其中的 地区编码 与中国天气网的地区编码是一样的。如果不设置这个参数，则默认显示本地的天气状况。

点击查看演示

简易的调用示例源码如下：（请自行进行界面美化）

  1. <!DOCTYPE html>  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  5. <title>天气接口使用示例</title>  
  6. <style>  
  7. body {  
  8.     font-family: microsoft yahei;  
  9. }  
  10. </style>  
  11. <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>  
  12. </head>  
  13. <body>  
  14.   
  15. <div id="output"></div>  
  16.   
  17. <script type="text/javascript" charset="utf-8">  
  18.       
  19.     $.ajax({  
  20.         type: "GET",   
  21.         url: "http://cdn.weather.hao.360.cn/sed_api_weather_info.php?app=360chrome",  
  22.         dataType : "jsonp",  
  23.         jsonp: "_jsonp",//参数名  
  24.         success: function(jsonData){  
  25.             var html;  
  26.             html = '数据更新时间：' + jsonData.pubdate + ' ' + jsonData.pubtime + '<br>';  
  27.               
  28.             html += '地区：' + jsonData.area[0][0] + ' ' + jsonData.area[1][0] + ' ' + jsonData.area[2][0] + '<br>';  
  29.             html += '天气情况：<br>';  
  30.               
  31.             for(var i =0; i<jsonData.weather.length; i++) {  
  32.                 html += jsonData.weather[i].date + '<br>';  
  33.                   
  34.                 if(jsonData.weather[i].info.dawn !== undefined) {  
  35.                     html += '早晨天气：' + jsonData.weather[i].info.dawn[1] +   
  36.                     ' 气温：' + jsonData.weather[i].info.dawn[0] + '~' + jsonData.weather[i].info.dawn[2] + '℃ ' +  
  37.                     jsonData.weather[i].info.dawn[3] +' '+ jsonData.weather[i].info.dawn[4] + '<br>';  
  38.                 }  
  39.                   
  40.                 if(jsonData.weather[i].info.day !== undefined) {  
  41.                     html += '白天天气：' + jsonData.weather[i].info.day[1] +   
  42.                     ' 气温：' + jsonData.weather[i].info.day[0] + '~' + jsonData.weather[i].info.day[2] + '℃ ' +  
  43.                     jsonData.weather[i].info.day[3] +' '+ jsonData.weather[i].info.day[4] + '<br>';  
  44.                 }  
  45.                   
  46.                 if(jsonData.weather[i].info.night !== undefined) {  
  47.                     html += '夜间天气：' + jsonData.weather[i].info.night[1] +   
  48.                     ' 气温：' + jsonData.weather[i].info.night[0] + '~' + jsonData.weather[i].info.night[2] + '℃ ' +  
  49.                     jsonData.weather[i].info.night[3] +' '+ jsonData.weather[i].info.night[4] + '<br>';  
  50.                 }  
  51.                 html += '<br>';  
  52.             }  
  53.               
  54.             html += '穿衣：<br>';  
  55.             html += '【' + jsonData.life.info.chuanyi[0] + '】 ' + jsonData.life.info.chuanyi[1] + '<br><br>';  
  56.               
  57.             html += '感冒：<br>';  
  58.             html += '【' + jsonData.life.info.ganmao[0] + '】 ' + jsonData.life.info.ganmao[1] + '<br><br>';  
  59.               
  60.             html += '空调：<br>';  
  61.             html += '【' + jsonData.life.info.kongtiao[0] + '】 ' + jsonData.life.info.kongtiao[1] + '<br><br>';  
  62.               
  63.             html += '污染：<br>';  
  64.             html += '【' + jsonData.life.info.wuran[0] + '】 ' + jsonData.life.info.wuran[1] + '<br><br>';  
  65.               
  66.             html += '洗车：<br>';  
  67.             html += '【' + jsonData.life.info.xiche[0] + '】 ' + jsonData.life.info.xiche[1] + '<br><br>';  
  68.               
  69.             html += '运动：<br>';  
  70.             html += '【' + jsonData.life.info.yundong[0] + '】 ' + jsonData.life.info.yundong[1] + '<br><br>';  
  71.               
  72.             html += '紫外线：<br>';  
  73.             html += '【' + jsonData.life.info.ziwaixian[0] + '】 ' + jsonData.life.info.ziwaixian[1] + '<br><br>';  
  74.               
  75.             html += 'PM2.5： ' + jsonData.pm25.pm25[0];  
  76.               
  77.             $("#output").html(html);  
  78.         }  
  79.     });  
  80. </script>  
  81.   
  82. </body>  
  83. </html>  

附：其它天气接口

天气网的接口(只支持iframe方式调用，修改后面的数字可以展示为其它样式)
http://i.tianqi.com/index.php?c=code&id=55

2345天气(只支持iframe方式调用，支持自定义样式)
http://tianqi.2345.com/plugin/

中国天气网(只支持iframe方式调用，支持自定义地区)
http://m.weather.com.cn/m/pn11/weather.htm

本文作者为mengkun，转载请注明。

发表评论 取消回复
表情 图片 链接 代码

  1. 木一
    木一 Lv 4

    现在不传地区编码好像默认是北京了

    #12 2020-08-11 15:17 回复
  2. 邱轲
    邱轲 Lv 1

    接口低温不是不准，而是这个接口的最低温度应该是夜间天气的最高温度。后面使用的人注意

    #11 2020-04-02 11:37 回复
  3. 核核
    核核 Lv 1

    这个接口最低温度不准哦，是什么问题呀？

    #10 2019-09-19 17:01 回复
    • 邱轲
      邱轲 Lv 1

      @核核低温的确不准~~

      2020-04-02 11:07 回复
    • 邱轲
      邱轲 Lv 1

      @核核又看了一下，不是不准，而是这个接口的最低温度应该是夜间天气的最高温度。

      2020-04-02 11:37 回复
  4. 徐徐
    徐徐 Lv 1

    我传了code不管用呀，反而获取不到数据了，譬如济南 code=4510

    #9 2019-05-14 10:02 回复
    • mengkun
      mengkun 站长

      @徐徐济南的 code 是 101120101

      2019-05-15 20:28 回复
  5. 北海
    北海 Lv 3

    emmm 一堆乱码QAQ

    #8 2017-12-31 17:31 回复
  6. 小宇
    小宇 Lv 1

    老哥666 [鼓掌]

    #7 2017-09-24 22:03 回复
  7. 香蕉不娇
    香蕉不娇 Lv 1

    你的http://lab.mkblog.cn/weather/源码能不能分享一下

    #6 2017-04-23 15:24 回复
  8. 瓦特
    瓦特 Lv 1

    我把代码保存了一下htm,竟然全是乱码.改成UTF-8编码后正常了...

    #5 2017-04-17 15:29 回复
  9. 星空游戏
    星空游戏 Lv 2

    很棒啊

    #4 2017-04-10 09:41 回复
  10. 瀚宇
    瀚宇 Lv 3

    找接口不容易，孟坤辛苦了 [呲牙]

    地板 2017-04-10 06:39 回复
    • mengkun
      mengkun 站长

      @瀚宇没有刻意去找，开着 Fiddler 玩的时候无意间发现的 [wb_二哈]

      2017-04-10 08:31 回复
  11. 瀚宇
    瀚宇 Lv 3

    楼上的小伙伴，你说这个神奇不 https://m.toutiao.com/i6406461044947943938/

    板凳 2017-04-10 06:20 回复
  12. 266277
    266277 Lv 4

    http://fakeupdate.net 坤哥神奇不，求“偷” [鼓掌]

    沙发 2017-04-09 20:44 回复
    • mengkun
      mengkun 站长

      @266277这个网站的原理很简单，不过"偷"不得。因为它的源码里面有个"copy cat"，哈哈哈 #(笑眼)

      2017-04-10 08:30 回复
      • 266277
        266277 Lv 4

        @mengkun神马意思

        2017-04-10 17:55 回复
      • 266277
        266277 Lv 4

        @mengkun我确实看到了猫但是看不懂意思

        2017-04-10 17:57 回复
      • mengkun
        mengkun 站长

        @266277你百度一下 copycat 这个词就知道了……

        2017-04-10 17:59 回复
      • 266277
        266277 Lv 4

        @mengkun然后为什么不能模仿 [尴尬]

        2017-04-10 18:01 回复
  13. 天气接口使用示例
    天气接口使用示例 Pingback

    […] 文章地址 […]

    #0 2017-04-08 22:03 回复
分享