Programmatic download of content on another origin (same domain, different subdomain)

I currently have some functionality where I am playing some video from a subdomain, let's call it

https://video.domainname.com/exampleVideo.mp4

This is being loaded as a video in the src attribute of the video element on a website, https://domainname.com

I also have some functionality that allows programmatic access to a screenshot of that video:

Screenshot button:

const width = player.media.videoWidth;
const height = player.media.videoHeight;
const canvas = Object.assign(document.createElement('canvas'), {width, height});
canvas.getContext('2d').drawImage(player.media, 0, 0, width, height);

link.download = `Video screenshot.png`;

console.log('use canvas')
link.href = canvas.toDataURL()

link.click();

This functionality currently errors during the link.href = canvas.toDataURL() part with a Tainted canvases may not be loaded. error.

Download button:

var link = document.createElement('a');
link.download = 'Video title';

link.href = 'https://video.domainname.com/exampleVideo.mp4'

link.href = downloadUrl

link.click();

This functionality currently does not work, and instead redirects to the video URL on the subdomain, however they both work when it is on the same domain.

From what I've read online I am getting a conflicting message: it is even possible theoretically to have this functionality run using CORS if it is on the same domain but a different subdomain? If so, what would I have to do to make this possible? Thanks