javascript 如何使用雅虎财经的XPath在Blogspot中显示比特币的实时数据?

hivapdat  于 2023-04-10  发布在  Java
关注(0)|答案(1)|浏览(112)

bounty将在2天后到期。回答此问题可获得+50声望奖励。user1134456正在寻找可靠来源的答案:我希望编码应该使用HTML,Javascript和CSS;另外,它应该在Blogspot帖子中工作

以下是我在Blogspot中的代码:

<div>
  <h2>Bitcoin Price:</h2>
  <span id="bitcoin-price"></span>
</div>

<script>
  const url = "https://finance.yahoo.com/quote/BTC-USD/";
  fetch(url)
    .then(response => response.text())
    .then(data => {
      const parser = new DOMParser();
      const doc = parser.parseFromString(data, "text/html");
      const xpath = '//*[@id="quote-header-info"]/div[3]/div[1]/div/fin-streamer[1]';
      const element = doc.evaluate(xpath, doc, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
      const price = element.textContent;
      document.getElementById("bitcoin-price").textContent = price;
    });
</script>

我得到的结果是:

我希望我的博客将显示比特币的实时价值

nxagd54h

nxagd54h1#

不建议以这种方式访问数据,您不拥有的网站可能会更改元素的位置/属性,这将破坏您的XPath查询并需要不断维护它。
你应该总是使用API(当它可用时)。由于雅虎只有后端API,你可以使用另一个平台,如RapidAPI,从前端访问数据。我发现你的this文章解释了如何做到这一点。
要进一步解释为什么你的方法不起作用,你可以阅读Cross-Origin Resource Sharing (CORS),它阻止来自外部网站的请求,以防止未经授权的访问。

相关问题