How to enable CORS? Sever? Javascript? where?
<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>