Google News API停止工作。不知道为什么

时间:2019-03-30 16:54:39

标签: ajax api

我正在建立一个项目,其中一个页面上有google新闻功能。我的代码以前可以正常工作,但是由于某种原因它已停止,我不确定原因。我不记得对其进行任何更改,但是我可能在不知不觉中这样做了。我真的可以用别人的帮助来浏览它。

我的ajax代码如下(js / ajax_googlenews.js)

(请原谅内联样式。这是临时措施。)

$(document).ready(function () {
    $.ajax(
        {
            type: "GET",
            dataType: "json",
            cache: false,
            url: "https://newsapi.org/v2/everything?q=bitcoin&apiKey=API-KEY-HERE",
            success: function (data) {
                for (var i = 0; i < 40; i++) {
                    var rTitle = data.articles[i].title;
                    var rAuthor = data.articles[i].author;
                    var rDes = data.articles[i].description;
                    var rUrl = data.articles[i].url;
                    var rImg = data.articles[i].urlToImage;
                    var rDate = data.articles[i].publishedAt;

                    $("#articles").append(

                    "<style>"

                  + ".flip-card {background-color: white; width: 300px;height: 350px; perspective: 1000px; float:left; padding: 14px;}"
                  + ".flip-card-inner {position: relative;width: 100%;height: 100%;text-align: center;transition: transform 0.6s;transform-style: preserve-3d;}"
                  + ".flip-card:hover .flip-card-inner {transform: rotateY(180deg);}"
                  + ".flip-card-front, .flip-card-back {position: absolute;width: 100%;height: 100%;backface-visibility: hidden;  border-radius:5px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); text-align: center;}"
                  + ".flip-card-front {background: rgb(217, 155, 53); background: rgba(217, 155, 53, 1); color: black;z-index: 2;}"
                  + ".flip-card-front-header {overflow-x: visible;}"
                  + ".flip-card-front-body {text-align: center;}"
                  + ".flip-card-front-footer {overflow-x: visible; text-align: center;}"
                  + ".flip-card-front-title {overflow-x: visible; text-align: center; padding-top:8px;}"
                  + ".flip-card-front {background: rgb(217, 155, 53); background: rgba(217, 155, 53, 1); color: black;z-index: 2;}"
                  + ".flip-card-author-front {color: black; padding: 8px;}"
                  + ".flip-card-author-back {color: black; padding: 8px;}"
                  + ".flip-card-content-back {color: rgb(217, 155, 53); color: rgba(217, 155, 53, 1); padding: 8px;}"
                  + ".flip-card-content-back-description {color: rgb(217, 155, 53); color: rgba(217, 155, 53, 1); padding: 8px; text-align:center;}"
                  + ".flip-card-back {background: black; color: rgb(217, 155, 53); color: rgba(217, 155, 53, 1); transform: rotateY(180deg);z-index: 1;}"

                  +  "</style>"

              + "<a href='"+ rUrl +"'>"
                  + "<div class='flip-card'>"
                     + "<div class='flip-card-inner'>"
                        + "<div class='flip-card-front'>"
                           +"<div class='flip-card-front-header'>"
                              +"<h2 class='flip-card-author-front'>" + rAuthor + "</h2>"
                           +"</div>"
                           +"<div class='flip-card-front-body'>"
                              + "<img src='"+ rImg +"' alt='Image' style='height:150px; width:270px; max-height:150px; max-width: 270px; overflow: hidden; bottom:0px;'>"
                           +"</div>"
                           +"<div class='flip-card-front-footer'>"
                              +  "<h4 class='flip-card-front-title'>" + rTitle + "</h4>"
                           +"</div>"
                        + "</div>"
                        + "<div class='flip-card-back'>"
                              +  "<h2>" + rAuthor + "</h2>"
                              +  "<p class='flip-card-content-back'><small>Date :" + rDate + "</small></p>"
                              +  "<p class='flip-card-content-back-description'>" + rDes + "</p>"
                              +  "<p class='flip-card-content-back'>(Article Sample)</p>"
                        + "</div>"
                     + "</div>"
                  + "</div> "
              + "</a>"

                    );
                }
                console.log(data);
            }
        })
});

HTML代码如下(index.php)

 <div class="scrollfeed" style="height:455px;">
    <div class="responsive">
       <script src="js/ajax_googlenews.js"></script>
       <div id="articles"></div>
    </div>
 </div>

0 个答案:

没有答案