", { headers: new " /> ", { headers: new " /> ", { headers: new "/>

I'm facing problem with newsapi.org (API), I can't display the news articles on get news button, console shows no errors now

969 Views Asked by At
function getNews() {
  fetch(
    "https://cors-anywhere.herokuapp.com/http://newsapi.org/v2/top-headlines?country=india&apiKey=<MyApiKey>",
    { headers: new Headers({ "X-Requested-With": "abcd" }) }
  )
    .then((a) => a.json())
    .then((response) => {
      for (var i = 0; i < response.articles.length; i++) {
        document.getElementById("output").innerHTML +=
          "<div class='article' style='padding-top:20px;'> <img class='image' style='float:left; width:150px;' src='" +
          response.articles[i].urlToImage +
          "' > <h1>" +
          response.articles[i].title +
          "</h1>" +
          response.articles[i].source.name +
          "<br>" +
          response.articles[i].description +
          " <a href='" +
          response.articles[i].url +
          "'target='_blank'>" +
          response.articles[i].url +
          "</a></div>";
      }
    });
}

My console doesn't show any errors now, but onclick getNews() does not display anything!!

<body>
    <button class="btn" onclick="getNews()">Get News Here.</button>
    <div id="output"></div>
    <script src="index.js"></script>
  </body>

I was hoping to display the news by this api, (I tried to use 'in' as my country code but didn't work). https://www.youtube.com/watch?v=yY0ciWj8oco&t=24s - I was trying to implement it by this video since yesterday, fixed some errors I got but right now I have no errors in console nor on my window after I click on 'get news here' button, it does nothing!! Please help!!

0

There are 0 best solutions below