Как программист на обучении, Google может ответить на все вопросы. Но что делать, если в гугле нет ответов 😰? Недавно при создании проекта с группой других программистов, проходящих обучение, мы хотели использовать API текстов песен, когда исследовали, что одним из популярных API для использования был API Genius, но гений использует аутентификацию OAuth2. поэтому мы перешли к использованию Lyrics.ovh — более простого API для извлечения текстов песен. Но информации об API в гугле было не так много, из-за чего захотелось написать собственный блог со всеми возможностями с API Lyric.ovh.
Чтобы углубиться в API, Lyrics.ovh — это простой API для получения текстов песен. Он имеет только два параметра, с которыми вы можете работать (исполнитель и название песни). Он использует формат ответа JSON. И, согласно сайту Lyrics.ovh, у него есть два кода состояния: 200 и 404. Если кратко объяснить, код ошибки 200 означает, что запрос выполнен успешно (текст песни найден), а код ошибки 404 означает (текст песни не найден). просто правильно! но не совсем, когда мы приступаем к кодированию.
Для начала вот как выглядит URL:
Вы можете легко проверить это, просто добавив имя исполнителя и название. Ответ, который вы получите, выглядит примерно так:
Хотя это может выглядеть просто, мне было трудно закодировать желаемый вид. Мне пришлось немного поиграть с Javascript. Сначала создайте внешний интерфейс с помощью HTML и CSS, чтобы он выглядел так, как вы хотите, а затем перейдите к Javascript. Мое желание состояло в том, чтобы пользователь использовал панель поиска для поиска исполнителя, и отображался список песен, а если они искали название песни, отображался список песен со словом. Когда список появится, пользователь может щелкнуть песню, чтобы развернуть текст.
Интересно, как бы вы закодировали это? В javascript используйте метод прослушивания событий на кнопке поиска, затем создайте функцию для вызова API, самого URL-адреса без параметров и используйте формат JSON для получения данных. с этим мы название песни и имя исполнителя. Затем вы можете отформатировать его по своему вкусу, используя inner.HTML, я создал кнопку, при нажатии на которую она расширяет текст. Создайте прослушиватель событий для кнопки текста песни, а затем снова получите URL-адрес API, на этот раз используя исполнителя и название, снова используйте формат .JSON и отобразите текст песни.
Это не единственный способ использования этого API, поэтому не бойтесь экспериментировать с API, делать с ним ошибки и узнавать о нем больше. И не стесняйтесь оставлять комментарии, если вам нужна помощь в использовании API!
