title: Axios blocked by CORS policy with Django REST Framework: 'Access-Control-Allow-Origin' header in the response must not be wildcard
body: <p>Using vuejs3 and axios, I'm trying to make a API call out to a django project deployed to AWS API Gateway, and getting a CORS error on the chrome side.  Not sure what setting I'm missing here...</p>
  <p><a href="https://i.stack.imgur.com/iibtL.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/iibtL.png" alt="enter image description here" /></a></p>
  <p>The preflight OPTIONS response returned is ok, but chrome is upset that the <code>'Access-Control-Allow-Origin'</code> header is &quot;*&quot;.</p>
  <p>I'm using django-rest-framework with <code>django-cors-headers</code>.</p>
  <p>django.settings:</p>
  <pre><code>ALLOWED_HOSTS = [&quot;*&quot;]
  
  # CORS
  CORS_ALLOW_ALL_ORIGINS = False  # was initially True
  CORS_ALLOW_HEADERS = &quot;*&quot;
  
  CORS_ALLOW_CREDENTIALS = True
  CORS_ALLOWED_ORIGINS = [&quot;https://mydomain&quot;, &quot;http://localhost:8080&quot;, &quot;http://127.0.0.1:8080&quot;]
  
  # Application definition
  INSTALLED_APPS = [
      &quot;django.contrib.auth&quot;,
      &quot;django.contrib.contenttypes&quot;,
      &quot;django.contrib.sessions&quot;,
      &quot;django.contrib.messages&quot;,
      &quot;django.contrib.staticfiles&quot;,
      &quot;corsheaders&quot;,
      ...
  ]
  
  MIDDLEWARE = [
      &quot;django.middleware.security.SecurityMiddleware&quot;,
      &quot;django.contrib.sessions.middleware.SessionMiddleware&quot;,
      &quot;django.middleware.locale.LocaleMiddleware&quot;,
      &quot;corsheaders.middleware.CorsMiddleware&quot;,
      &quot;django.middleware.common.CommonMiddleware&quot;,
      &quot;django.middleware.csrf.CsrfViewMiddleware&quot;,
      ...
  ]
  </code></pre>
  <p>vuejs/axios side:</p>
  <pre><code>axios.defaults.xsrfHeaderName = 'X-CSRFToken';
  axios.defaults.xsrfCookieName = 'csrftoken';
  axios.defaults.withCredentials = true;
  const url = `https://mydomin/my/endpoint/`;
  response = axios.get(url);
  </code></pre>
  <p>I thought setting <code>CORS_ALLOW_ALL_ORIGINS</code> to <code>False</code> and defining <code>CORS_ALLOWED_ORIGINS</code> values would resolve the issue, but the <code>Access-Control-Allow-Origin</code> header is still showing as &quot;*&quot;.</p>
  <p>Am I missing a setting?</p>
  <p>Here's the Options header result:
  <a href="https://i.stack.imgur.com/eEYoE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/eEYoE.png" alt="enter image description here" /></a></p>