I'm building a small website display that will show whether or not someone is streaming on their YouTube channel. I've been able to piece together the following:
const channelIdYT = 'XXXXXXXXXXXXXX'; // This is the Channel ID I want to checkconst channelNameYT = 'theNameOfTheChannel';async function isYouTubeChannelLive(channelId, channelName){ const theURL = `https://www.youtube.com/channel/${channelId}`; const theResponse = await fetch(theURL).then(function(response){ return response.text(); }).then(function (html) { if (html.includes("hqdefault_live.jpg")) { console.log(`${channelName} on YOUTUBE is currently live!`); } else { console.log(`${channelName} on YOUTUBE is offline.`); } }).catch(function (err) { console.warn('Something went wrong', err); });}$(document).ready(function(){ isYouTubeChannelLive(channelIdYT, channelNameYT);});When I run this, I get the following error:
Access to fetch at 'https://www.youtube.com/channel/UCnB-Fhp5FQfCZNfdAvm27Qw' from origin 'http://localhost' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.I uploaded this script to my hosting service, thinking it might be that I'm running this through XAMPP, but I get the same error message, only the origin URL has changed.
What do I need to do to get this to work?