JSON/API help for Random Quote Project

I need some help with my Random Quote Machine project. I am looking to do something different. What I am doing is having the user click the button, pulling up a random music video from youtube with its lyrics from genius.com

The youtube portion is working fine and does sync up with the genius URL I provided. The problem is the Genius lyrics page won’t show up. I need to go through the API, but I don’t know how incorporate it into the javascript array. Looking at the Genius API it looks like it is based upon JSON.

Could someone help me out? Here is the Codepen and Here is the genius API documentation

It seems like Genius has specifically disabled the loading of their content inside of frames requested from other domains:

Refused to display 'https://genius.com/Glass-animals-gooey-lyrics' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
1 Like

Ahh perfect! Thank you for the insight, how were you able to find that information?

I really like Freecodecamp, but I feel like the API/JSON section could be a little more explicit. It might just be me, but I am completely confused about how API works. Are there any other resources you would recommend on the subject?

I opened up the browser console! Check it out, it will be your bestest friend.

It is definitely not just you. I’ve seen a bunch of videos suggested on the topic, but I haven’t reviewed them all myself. Here’s one that came up not too long ago: Coding Train.

1 Like