title: How to enable CORS? Sever? Javascript? where?
body: <p>right now I am testing my reactjs site on locahost:3333 and my asp.net web api 2 on localhost:54690.</p>
  
  <p>I am using <a href="https://github.com/mzabriskie/axios" rel="nofollow">axios</a> for my ajax but when I make a request I get an error.</p>
  
  <blockquote>
    <p>XMLHttpRequest cannot load <a href="http://localhost:54690/api/Storage/Get" rel="nofollow">http://localhost:54690/api/Storage/Get</a>.
    Response to preflight request doesn't pass access control check: No
    'Access-Control-Allow-Origin' header is present on the requested
    resource. Origin '<a href="http://localhost:3333" rel="nofollow">http://localhost:3333</a>' is therefore not allowed
    access. The response had HTTP status code 500.</p>
  </blockquote>
  
  <p>I tried to add Cors but guess I am not doing it right. I tried server side and client side.</p>
  
  <pre><code>   var instance = axios.create({
              baseURL: 'http://localhost:54690/api',
              timeout: 1000,
              headers: { 'Access-Control-Allow-Origin': '*' }
          });
  
          instance.get('/Storage/Get')
              .then(function (response) {
                  console.log(response);
              })
              .catch(function (error) {
                  console.log(error);
              });
  </code></pre>
  
  <p>server side</p>
  
  <pre><code>[EnableCors(origins: "http://localhost:3333/", headers: "*", methods: "*")]
  public class StorageController : ApiController
  </code></pre>
  
  <p>WebapiConfig.</p>
  
  <pre><code>  public static class WebApiConfig
      {
          public static void Register(HttpConfiguration config)
          {
              config.Filters.Add(new EnableQueryAttribute());
  
              // Web API configuration and services
  
              // Web API routes
              config.MapHttpAttributeRoutes();
  
              config.Routes.MapHttpRoute(
                  name: "DefaultApi",
                  routeTemplate: "api/{controller}/{id}",
                  defaults: new { id = RouteParameter.Optional }
              );
  
              config.EnableCors();
          }
      }
  </code></pre>
  
  <p>Edit</p>
  
  <p>Seems like when I do this</p>
  
  <p>[EnableCors(origins: "<em>", headers: "</em>", methods: "*")]</p>
  
  <p>it works. I dont' even need to put anything in my header for my ajax. Though this not really a soultion as I don't want this to happen in production I am guessing?</p>
  
  <p>Also is there a global function I can setup cors at? Kinda sucks to put it on every controller.</p>
  
  <p>Edit 2</p>
  
  <p>looking more into the link from @kormali_2 I see that the problem might be because I have "<a href="http://locahost:3333/" rel="nofollow">http://locahost:3333/</a>" where it should be "<a href="http://locahost:3333" rel="nofollow">http://locahost:3333</a>" also there is a global option I can use.</p>