Spotify API - Promise 卡在待定状态

Question

我是 Javascript 的新用户，请耐心等待。 我正在尝试拼凑一个网站，我可以通过 go 来查看我当前在 Spotify 上播放的歌曲。 它应该每 1000 毫秒通过 fetch 方法向 Spotify API 发出 GET 请求，并更新屏幕上的 SongNameElement，而无需用户刷新。

我使用我在网上找到的这段代码通过可公开访问的 JSON 文件完成自我更新 div。

我还使用此代码提供请求标头（令牌等）。

示例 JSON 数据可在此处找到。 我需要这个的价值

Spotify API 返回一个 JSON 文件。 到目前为止，我已经在Python中实施了它，因此对API的身份验证并不是问题。 promise 被标记为待处理，但我不确定为什么它没有完成。 下面是我的代码：

import spotipy.util as util
from bs4 import BeautifulSoup
from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/')
def index():
    return """
    <div id="SongName">Song Name</div>
    <div id="ArtistName">Artist Name</div>
    <script>
      function updateDataOnScreen() {
        const SongNameElement = document.getElementById("SongName")
        FetchResponse = fetch("https://api.spotify.com/v1/me/player/currently-playing", {
          method: 'GET', // *GET, POST, PUT, DELETE, etc.
          mode: 'cors', // no-cors, *cors, same-origin
          cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
          headers: {
            'Content-Type': 'application/json',
            'Authorization': 'Bearer (my token goes here, but has been redacted)'
          },
          redirect: 'follow', // manual, *follow, error
          referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
        })
        .then(response => response.json())
        .then(json => SongNameElement.innerHTML = FetchResponse)
        .catch(error => console.error(error));
        console.log(FetchResponse)
      }
      document.addEventListener("DOMContentLoaded", function(event) {
        setInterval(updateDataOnScreen, 1000) // interval value in milliseconds
      })
    </script>
    """

if __name__ == '__main__':
    app.run(debug=True)

开发人员工具不断显示这一点。

注意我已经从标题中编辑了我的令牌，所以如果你自己运行它，你需要用你的 Sptify 令牌替换它，你可以在这里获得。

Answer 1

不确定我做了什么，但它有效。 为昆汀干杯，让我动起来！

import requests
from bs4 import BeautifulSoup
from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/')
def index():
    return """
    <div id="SongName">Song Name</div>
    <script>
      function updateDataOnScreen() {
        const SongNameElement = document.getElementById("SongName")
        FetchResponse = fetch("https://api.spotify.com/v1/me/player/currently-playing", {
          method: 'GET', // *GET, POST, PUT, DELETE, etc.
          mode: 'cors', // no-cors, *cors, same-origin
          cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
          headers: {
            'Content-Type': 'application/json',
            'Authorization': 'Bearer (AUTHKEY)'
          },
          redirect: 'follow', // manual, *follow, error
          referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
        })
        .then(response => response.json())
        .then(response => SongNameElement.innerHTML = (response.item.name))
        .catch(error => console.error(error));
      }
      document.addEventListener("DOMContentLoaded", function(event) {
        setInterval(updateDataOnScreen, 1000) // interval value in milliseconds
      })
    </script>
    """

if __name__ == '__main__':
    app.run(debug=True)