Why can I get access to an audio file but not a text file in a website?

Question

I'm working in the obsidianportal website. Basically, it's an easy way to create a wiki-style page to sort information in tabletop games. Unlike any other competitors I've found, they give the option to, on top of the website's own tools to create web pages and link them together, all hosted in their servers, add custom HTML, CSS and Javascript on top, to customize your wiki's functionality.

There is a section where you can drop files to, to be retrieved when creating the pages. I have added picture files, which I can successfully retrieve with:

<img src="https://[server_id].cloudfront.net/[subfolders]/[fileName].png" ...>

And an audio file that I can play with this code:

var audio = new Audio("https://[server_id].cloudfront.net/[subfolders]/[fileName].mp3");
audio.play();

However, when I try to read from a text file with:

fetch("https://[server_id].cloudfront.net/[subfolders]/[fileName].txt")
  .then((res) => res.text())
  .then((text) => {
    doSomething();
   })
  .catch((e) => console.error(e));

I get the error:

Access to XMLHttpRequest at 'https://[server_id].cloudfront.net/[subfolders]/[fileName].txt' from origin 'https://[name].obsidianportal.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

What am I not understanding correctly? What is different between the way I'm either retrieving or trying to read the file with the text file and the audio and the image ones?

I am a bit limited to what I can and cannot include in my HTML, CSS and JS, since the website doesn't allow some fancier stuff, so I'd like to keep it vanilla.