Access to image at 'URL' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

Question

I'm Getting this error while fetching Rapid API From Pure JavaScript.

I am using this API For Fetching Instagram Posts, Reels and more: https://rapidapi.com/arraybobo/api/instagram-media-downloader

HTML

<h1>Download Instagram Posts</h1>
    <input type="text" placeholder="Enter URL" /><br />
    <div id="Info"></div>
    <button onclick="HandleReq()">Download</button>

CSS

 * {
        font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
          Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
          sans-serif;
      }
      body {
        padding: 20px 40px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
      }
      input {
        padding: 10px;
        border-radius: 5px;
        border: none;
        background: white;
        color: blue;
        border: 1px solid silver;
        width: 70%;
      }
      h1 {
        text-align: center;
      }
      button {
        padding: 10px 20px;
        border-radius: 5px;
        margin: 10px 10px;
        background: black;
        color: yellow;
        border: none;
        cursor: pointer;
        transition: all 0.2s;
      }
      button:hover {
        background: yellow;
        color: black;
      }
      div {
        display: flex;
        justify-content: center;
        width: 90%;
        flex-direction: column;
        flex-wrap: wrap;
        text-align: center;
        object-fit: cover;
        overflow: scroll;
      }
      img {
        width: 400px;
        height: 400px;
      }
      @media only screen and (max-width: 768px) {
        body{
            padding: 10px;
        }
        div{
            width: 100%;
        }
        img{
            width: 95%;
            height: auto;
        }
      }

JAVASCRIPT

let content = document.getElementById("Info");
      function HandleReq() {
        const options = {
          method: "GET",
          headers: {
            "X-RapidAPI-Key":
              "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
            "X-RapidAPI-Host": "instagram-media-downloader.p.rapidapi.com",
          },
        };

        fetch(
          "https://instagram-media-downloader.p.rapidapi.com/rapid/post.php?url=https%3A%2F%2Fwww.instagram.com%2Fp%2FBhr1Ca9lcT0%2F",
          options
        )
          .then((response) => response.json())
          .then(
            (response) =>
              (content.innerHTML = `<img src=${response.image} crossorigin="anonymous"><br /><span>${response.caption}</span>`)
          )
          .catch((err) => console.error(err));
      }

ERROR:

Access to image at 'https://scontent-waw1-1.cdninstagram.com/v/t51.2885-15/30602671_1678191385592964_4808612725670281216_n.jpg?stp=dst-jpg_e35&_nc_ht=scontent-waw1-1.cdninstagram.com&_nc_cat=100&_nc_ohc=EgfXllD6SRkAX_J5kmD&edm=AP_V10EBAAAA&ccb=7-5&oh=00_AfBTpmvDIasoQL07BiUPM7NOB-6HiuiJsOCutPsfc2W5bg&oe=63AECFC2&_nc_sid=4f375e' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

INSTAGRAM POST TRYING TO FETCH

https://www.instagram.com/p/Cmgu8B7vAnH/?utm_source=ig_web_copy_link

Please Help, Thank You!

I Tried Adding This In Image But Not Able To Display the CDN Image in My Localhost...

crossorigin="anonymous"

Please Help Me How To Solve This CORS Policy and Where To Add Your answer...

I'm a Beginners and trying to make a Instagram downloader tool.