Retrieve most recent YouTube and Twitch video IDs using JavaScript/jQuery

Other Questions Twitch
1

I need help figuring out how to fetch the newest video ID from a YouTube channel and store it in a variable. I want to use this ID to open videos in a popup window when users click a button.

Here’s what I’m trying to achieve:

// Get the most recent video ID and store it
let latestVideoId;

// Button to open the newest YouTube video
function openLatestVideo() {
    window.open('https://www.youtube.com/embed/' + latestVideoId, 'videoWindow', 'width=854, height=481');
}

<button onclick="openLatestVideo()">Watch My Newest Video</button>

I’m looking for a JavaScript or jQuery solution to automatically get this video ID. Also, is there a similar approach for getting the latest Twitch broadcast ID? I’d like to implement something like this for Twitch as well:

function openLatestStream() {
    window.open('http://www.twitch.tv/Username/popout?videoId=' + broadcastId, 'streamWindow', 'width=854, height=481');
}

Any suggestions on how to accomplish this would be really helpful!

2

Had the exact same problem building a media portal for our gaming community. Both platforms need server-side proxying because of auth requirements and CORS restrictions. For YouTube, hit the search endpoint with the channel ID parameter, order by date, then pull the video ID from the response. Twitch needs OAuth app credentials even for public data, so that’s gotta be backend. What worked for me was a simple PHP script that fetches both APIs every few minutes and dumps the latest IDs into a JSON file. Your JavaScript just reads from that cached file instead of hitting the APIs directly. Keeps quota usage low and kills the auth headaches on the frontend.

3

you can use the YouTube Data API v3 to get the video IDs easily. just get an api key from google’s dev console. for twitch, check out their helix api for broadcasts. handling cors on the server side will help avoid issues.

4

You’ll hit CORS issues right away - both YouTube and Twitch APIs won’t work from the client side. I dealt with this exact problem on my site. Browsers block direct API calls, so you need a backend to fetch the data and pass it to your frontend. YouTube’s channels endpoint works great with the uploads playlist, but watch out for the daily quota limits. Twitch is trickier since their OAuth tokens need server-side handling. Cache your results to avoid rate limits, especially if you’ve got multiple users hitting this feature regularly.

5

Been there with content aggregation projects. Everyone’s talking about backend solutions but honestly, managing server endpoints for this is overkill.

I automated this exact workflow using Latenode and it’s way cleaner. Set up a scenario that hits both YouTube Data API and Twitch Helix API on schedule. The automation handles CORS headaches, stores your latest video IDs, and exposes them through a simple webhook your frontend can call.

No need to spin up PHP scripts or worry about OAuth token refresh logic. Latenode manages API credentials securely and you can add filtering logic to skip certain video types or streams.

For your use case, create two workflows - one for YouTube uploads playlist, another for Twitch videos endpoint. Both dump results to JSON your button can fetch. Takes 10 minutes to set up versus hours of backend coding.

Check it out at https://latenode.com

6

just grab the rss feeds - way easier than messing with the api. every youtube channel has one that shows the latest videos without needing auth or dealing with quotas and cors headaches.