Is it possible to enable CORS using NancyFX?

Question

I have an API service made with NancyFX, and a couple of front-end developers creating an SPA JS client against this API.

We would like to test the client side code against the published server without having to publish the client code with too much frequency.

But, the client runs at localhost, and the server is at Windows Azure.

Is it possible and easy to enable CORS on the NancyFX server? How can I do that?

Thanks.

Answer 1

If you're using IIS to host Nancy, in this case on Windows Azure then you can just update the web.config to add the header to every request.

This can be done by adding the following:

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="Access-Control-Allow-Origin" value="*" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

Alternatively you can do what Sunny suggested, and if you don't like writing that every time you can add your own extension method:

public static class NancyExtensions
{
    public static void EnableCors(this NancyModule module)
    {
        module.After.AddItemToEndOfPipeline(x =>
        {
            x.Response.WithHeader("Access-Control-Allow-Origin", "*");
        });
    }
}

Then you can just call this.EnableCors() in your route.

Answer 2

Its possible to do this in the bootstraper of Nancy

protected override void RequestStartup(TinyIoCContainer container, IPipelines pipelines, NancyContext context)
    {

       //CORS Enable
        pipelines.AfterRequest.AddItemToEndOfPipeline((ctx) =>
        {
            ctx.Response.WithHeader("Access-Control-Allow-Origin", "*")
                            .WithHeader("Access-Control-Allow-Methods", "POST,GET")
                            .WithHeader("Access-Control-Allow-Headers", "Accept, Origin, Content-type");

        });

Answer 3

If your HTTP request is simple then Phill's answer will suffice, but if the request is not so simple, the browser will send a preflight check. The preflight check is an OPTIONS HTTP request and this has to be handled too.

Here is an extension method to configure CORS:

public static class MyNancyExtension
{
    public static void EnableCORS(this Nancy.Bootstrapper.IPipelines pipelines)
    {
        pipelines.AfterRequest.AddItemToEndOfPipeline(ctx =>
        {
            if (ctx.Request.Headers.Keys.Contains("Origin"))
            {
                var origins = "" + string.Join(" ", ctx.Request.Headers["Origin"]);
                ctx.Response.Headers["Access-Control-Allow-Origin"] = origins;

                if (ctx.Request.Method == "OPTIONS")
                {
                    // handle CORS preflight request

                    ctx.Response.Headers["Access-Control-Allow-Methods"] =
                        "GET, POST, PUT, DELETE, OPTIONS";

                    if (ctx.Request.Headers.Keys.Contains("Access-Control-Request-Headers"))
                    {
                        var allowedHeaders = "" + string.Join(
                            ", ", ctx.Request.Headers["Access-Control-Request-Headers"]);
                        ctx.Response.Headers["Access-Control-Allow-Headers"] = allowedHeaders;
                    }
                }
            }
        });
    }
}

To enable CORS call this extension method in the bootstrapper:

protected override void ApplicationStartup(Nancy.TinyIoc.TinyIoCContainer container, Nancy.Bootstrapper.IPipelines pipelines)
{
    base.ApplicationStartup(container, pipelines);

    pipelines.EnableCORS();
}

Please note it is not extending NancyModule because OPTIONS is handled outside of module (also here).