Доступ к JSON из API last.fm

Я очень новичок в JavaScript и некоторое время безуспешно искал решение. Я пытаюсь использовать API Last.fm для получения воспроизводимой в данный момент дорожки в моей учетной записи. Это то, что у меня есть до сих пор:

<html>
    <body>
        <p>this is an experiment!</p>
        <script type="text/javascript">
            const request = new XMLHttpRequest();

            request.open('GET', 'http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks&user='+[MY_USERNAME]+'&api_key='+[MY_API_KEY]+'&format=json');
            request.send(); 

            request.onload = () => {
                if (request.status === 200) {
                    console.log("Success");

                    var song = JSON.parse(request.response).recenttracks.track[0].name;

                    console.log(song);  
                } 
            };

            request.onerror = () => {
            console.log("error")
            };
        </script>
    </body>
</html> 

и я получаю сообщение об ошибке в консоли, когда я открываю файл в своем браузере. Любая помощь приветствуется :)

Обновление: все сработало, когда я дал ему прямой URL-адрес, например. Я убрал + и вставил ключ API напрямую.


person computersciencesayswhat    schedule 13.12.2019    source источник
comment
Всегда полезно показать ошибку, которую вы получаете, так как это лучшая подсказка о том, что не работает.   -  person Dimitrios Matanis    schedule 13.12.2019


Ответы (2)


Я проверил ваш код с тестовой учетной записью, и он отлично работает. Так что, вероятно, вы получите пустой результат, давайте добавим несколько проверок:

request.onload = () => {
    if (request.status === 200) {

        // look at the response
        console.log(request.response);

        const recenttracks = JSON.parse(request.response).recenttracks;

        if (!recenttracks.track || !recenttracks.track.length) {
          console.log('track is empty');
          return;
        }

        const song = recenttracks.track[0].name;

        console.log(song);  
    } 
};
person vladimir    schedule 13.12.2019

Похоже, вы должны использовать onreadystatechange для получения ответа вместо загрузки.

Пример:

request.onreadystatechange = function() {
  if (this.status == 200) {
    console.log(this.responseText);
  }
};

Подробнее о запросах XMLHttp можно прочитать здесь: https://www.w3schools.com/xml/ajax_xmlhttprequest_send.asp

person Dimitrios Matanis    schedule 13.12.2019
comment
Следует отметить, что API last.fm иногда использует код состояния 200 http для возврата ошибок. Это недостаток их конструкции, но на него нужно обратить внимание. - person Thom; 06.05.2020