如何使用API解析数据

算给自己最近做的项目的总结——API站点

    • 基本整个站点都是使用的第三方API,通过提交数据—接收数据—解析数据—显示到页面中 这么个流程。
    • 说一下我用了哪些数据,知乎头条、网盘搜索、豆瓣电影、一席、各类视频解析数据,以及之后上线的旅游中用到的12306、天气等数据。
    • 其实功能都挺好实现的,我原本的想法是先把功能做好然后在做 UI,后来发现其实最难的是界面的设计,让我这个本来就审美差的人设计页面,简直了,看到别人的界面,在瞅一瞅我的界面,想死的心都有了。
    • 整体用到了AJAX功能,以及最普通的js脚本。

代码部分

    1. AJAX的代码—用AJAX与PHP交互(用喜欢你的豆瓣评分做例子)。

      $(function() { 
      $("#send").click(function() { 
      //当send标签的按钮按下时执行下面的程序 
      var cont = $("input").serialize(); 
      //获取input中输入的内容 
      $.ajax({ 
      url: 'php文件所在位置',
      type: 'post', //提交数据方式,支持POST或者GET 
      dataType: 'json', 
      data: cont, //提交的数据,就是上面var cont获取得内容 
      success: function(data) { 
      $("#aver").html(data.aver); $("#na").html(data.na); 
      } 
      }); 
      }); 
      });

    2. PHP代码

      <?php
      $url ="https://api.douban.com/v2/movie/search?q={$_POST["movie"]}"; 
      //获取movie标签的内容,movie的内容就在cont中提交过来 
       $content = ""; $content = file_get_contents($url); 
       $data = json_decode($content,true); 
       $average = $data['subjects'][0]['rating']['average']; 
      //按照json格式来提取你想要的数据 
      $name = $data['subjects'][0]['title']; 
      $json_arr = array("aver"=>$average,"na"=>$name); 
      $json_obj = json_encode($json_arr); 
      echo $json_obj;
      ?>

    3. 提交数据后返回json数据
    4. 通过php处理后的数据,获取评分和名字
    5. 普通JS脚本取数据,通过<script src=”*.php”></script>,再在*.php中加输出js脚本的代码,这能将php获取得数据,不刷新显示在页面中。

      <?php
      $url ="https://news-at.zhihu.com/api/4/news/latest"; $content = ""; $content = file_get_contents($url); 
      $content = str_replace("\\r\\n",'',$content);
      //有时候标题中有\\r\\n(双斜杠代表一个斜杠),这样输出到页面的时候就会导致出错显示不出来。 
      $data = json_decode($content,true); 
      $title = array(); 
      $id = array();
      for($i = 0;$i < 6;$i++){ 
      $title[$i] = $data['stories'][$i]['title'];
      $id[$i] = $data['stories'][$i]['id'];
      }
      echo "function gonews(){";
      //当按钮中onclick中是gonews()的时候就执行下面的js脚本 
      for($i = 0;$i < 6;$i++){
      echo " document.getElementById('zhihu$i').innerHTML = '$title[$i]';
      document.getElementById('zhihu$i').href = 'http://daily.zhihu.com/story/$id[$i]'; document.getElementById('more').innerHTML = 'more'; document.getElementById('more').href = 'http://daily.zhihu.com/story'; "; 
      } 
      echo "}";
      ?>

    6. 相当于这个js脚本

      function gonews() {"
      for($i = 0;$i < 6;$i++){ 
      document.getElementById('zhihu$i').innerHTML = '$title[$i]';  document.getElementById('zhihu$i').href ='http://daily.zhihu.com/story/$id[$i]'; document.getElementById('more').innerHTML = 'more'; document.getElementById('more').href = 'http://daily.zhihu.com/story';"
      }
      

总结

首先知道了如何使用ajax无刷新交互数据,然后知道POST和GET的区别,POST不会返回缓存的数据而GET可能会返回缓存数据,而且当你直接用POST提交可能看不到结果,但是数据是有的,而GET是可以看到数据。

知道了document.getElementById(“..”).src/href这种用法。

学习了UIKIT和BOOTSTRAP框架的使用方法,UIKIT相对于BOOTSTRAP更为简洁,但是功能也少一些,稳定性也差一些。BOOTSTRAP稳定但是东西多,各有各优势。

现在提供数据的平台越来越少,以至于做这点功能都需要找很久这些数据。

—未完待续

One thought on “如何使用API解析数据

发表评论

电子邮件地址不会被公开。 必填项已用*标注