I am coding a Vue.js application. I created an API using python and hosted it using Heroku. But whenever I try to fetch JSON from this API, there is an error. I tried it on another API (Google Dictionary API: 'https://api.dictionaryapi.dev/api/v2/entries/en/hello'), and it works just fine.

Here is the code:

methods: {
    calculate() {
      // Use this API call:
      // http://gpt3-model.herokuapp.com/api/type=text-ada-001/prompt=<code>/
      const url = 'https://gpt3-model.herokuapp.com/api/type=text-ada-001/prompt=' + this.code;
      axios.get(url, {
        headers: {
          'Content-Type': 'application/json',
          'Accept': 'application/json',
          'Access-Control-Allow-Origin': 'http://localhost:8080/',
        }
      })
        .then(response => {
          console.log(response.data);
          this.complexity = response.data;
        })
        .catch(error => {
          console.log(error);
        });
    }
  }

This is the error that I get: Access to XMLHttpRequest at 'https://gpt3-model.herokuapp.com/api/type=text-ada-001/prompt=hi,%20how%20are%20you?/' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.