Cors requests and MVC5

Question

So I have a view on a controller ...

[AllowAnonymous]
[Route("MyView")]
public ActionResult MyView()
{
    // first attempt at solving problem
    Response.AddHeader("Access-Control-Allow-Origin", "*");
    Response.AddHeader("Access-Control-Allow-Headers", "*");
    Response.AddHeader("Access-Control-Allow-Methods", "*");

    return PartialView();
}

I tried adding this attribute (2nd attempt) ...

public class AllowCors : ActionFilterAttribute
{
    public override void OnActionExecuting(ActionExecutingContext filterContext)
    {
        filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*");
        filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Headers", "*");
        filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Methods", "*");
        base.OnActionExecuting(filterContext);
    }
}

As im using owin to initialise my app I figured this might work (3rd attempt) ...

app.Use((context, next) =>
{
    if (context.Request.Method == "OPTIONS")
    {
        context.Response.StatusCode = 200;
        context.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });
        context.Response.Headers.Add("Access-Control-Allow-Headers", new[] { "*" });
        context.Response.Headers.Add("Access-Control-Allow-Methods", new[] { "*" });
        return context.Response.WriteAsync("handled");
    }

    return next.Invoke();
}).UseStageMarker(PipelineStage.PreHandlerExecute);

The problem is that if I just straight up ask for it by putting the url in the browser I get the right headers ...

Access-Control-Allow-Headers:*
Access-Control-Allow-Methods:*
Access-Control-Allow-Origin:*

... moving over in to postman to test this, when I issue an OPTIONS call to the same URL I get this in the headers ...

Allow: OPTIONS, TRACE, GET, HEAD, POST

... so how do I get MVC to respond correctly to the OPTIONS http verb so that I can use this view outside the domain of the site?

EDIT

it's worth noting that I have looked around already and found all these and many more ...

The requested resource does not support http method 'OPTIONS'.?

jQuery $.ajax(), $.post sending "OPTIONS" as REQUEST_METHOD in Firefox

AJAX in Chrome sending OPTIONS instead of GET/POST/PUT/DELETE?

Why does this jQuery AJAX PUT work in Chrome but not FF

How to support HTTP OPTIONS verb in ASP.NET MVC/WebAPI application

... i'm also very familiar with using CORS and making CORS requests in to WebAPI, but for some reason I can't seem to make a CORS request in to MVC without getting this seemingly "dummy" response back.

I think what I need is a means to override / replace the MVC default behaviour to this HttpVerb based request to allow me to embed views in a remote site.

Answer 1

Install these two nuget packages:

Microsoft.AspNet.Cors
Microsoft.Owin.Cors

Then in your Startup.cs add this line inside the Configuration function:

public partial class Startup
{
    public void Configuration(IAppBuilder app)
    {
        ConfigureAuth(app);

        app.UseCors(CorsOptions.AllowAll);
    }
}

In my demo setup I'm sending a post request from the domain http://example.local (Apache) to the domain http://localhost:6569/ (IIS Express).

Without app.UseCors(CorsOptions.AllowAll); (notice the warning in the console and no CORS headers):

And after adding the packages and adding the line to the Configuration method:

As you can see in the screenshot, the access-control-allow-origin was added in the response headers as expected/