Yelp Fusion API JSON审核解析

时间:2019-06-23 15:19:00

标签: html json api get yelp

我想在网页上显示评论,但是在JSON解析和格式化方面遇到麻烦。任何帮助是极大的赞赏。我可以处理HTML和CSS标记,我只需要遍历每个新审阅并获得审阅者,reviewtext,pictureurl等。

到目前为止,它只能获得评论数量。我是JSON的新手,无法解析评论并正确设置格式。

<!doctype html>
<html lang="en">
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
      <title>Ilan's Test</title>
   </head>
   <body>

   <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div id="results">

                </div>
            </div>
         </div>
   </div>

      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
      <script>
         var myurl = "https://cors-anywhere.herokuapp.com/https://api.yelp.com/v3/businesses/financial-sanity-now-los-angeles-2/reviews";

         $.ajax({
            url: myurl,
            headers: {
             'Authorization':'Bearer API-KEY-GOES-HERE',
         },
            method: 'GET',
            dataType: 'json',
            success: function(data){
                // Grab the results from the API JSON return
                var totalresults = data.total;
                // If our results are greater than 0, continue
                if (totalresults > 0){
                    // Display a header on the page with the number of results
                    $('#results').append('<h5>We discovered ' + totalresults + ' reviews!</h5>');
                    // Itirate through the JSON array of 'reviews' which was returned by the API
                    $.each(data.reviews[id], function(id, review) {
                        // Store each review object in a variable
                        var id = review.id;
                        var reviewtext = reviews[id].text;
                        var reviewrating = reviews[id].rating;
                        // Append our result into our page
                        $('$results').append(reviewtext + reviewrating + reviews);
                  });
                } else {
                    // If our results are 0; no reviews were returned by the JSON so we display on the page no results were found
                    $('#results').append('<h5>We discovered no results!</h5>');
                }
            }
         });     

      </script>
   </body>
</html>

1 个答案:

答案 0 :(得分:0)

轻微的代码错误,但是很好;您的每个函数都有些混乱,并且您不小心将$ results用作了应该是#results的参考;但是得到它对您来说都是一件好事!

检查以下代码(请注意,Yelp仅允许提取3条评论;因此,当您看到8条评论时,它不会获得3条以上的评论);

<!doctype html>
<html lang="en">
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
      <title>Ilan's Test</title>
   </head>
   <body>

   <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div id="results">

                </div>
            </div>
         </div>
   </div>

      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
      <script>
         var myurl = "https://cors-anywhere.herokuapp.com/https://api.yelp.com/v3/businesses/financial-sanity-now-los-angeles-2/reviews";

         $.ajax({
            url: myurl,
            headers: {
             'Authorization':'Bearer API-KEY-GOES-HERE',
         },
            method: 'GET',
            dataType: 'json',
            success: function(data){
                // Grab the results from the API JSON return
                var totalresults = data.total;
                // If our results are greater than 0, continue
                if (totalresults > 0){ console.log(data);
                    // Display a header on the page with the number of results
                    $('#results').append('<h5>We discovered ' + totalresults + ' reviews!</h5>');
                    // Itirate through the JSON array of 'reviews' which was returned by the API
                    $.each(data.reviews, function(i, item) {
                        // Store each review object in a variable
                        var author = item.user.name;
                        var reviewtext = item.text;
                        var reviewrating = item.rating;
                        // Append our result into our page
                        $('#results').append('Author: <b>' + author + '</b><br> Review: ' + reviewtext + '<br>Rating: ' + reviewrating + ' <hr>');
                  });
                } else {
                    // If our results are 0; no reviews were returned by the JSON so we display on the page no results were found
                    $('#results').append('<h5>We discovered no results!</h5>');
                }
            }
         });     

      </script>
   </body>
</html>