The Freak Parade

You may find, as you begin to combine the incredible power of jQuery, OpenLayers, and other JavaScript libraries capable of asynchronous (AJAX) behavior, that you want to serve some data to your client side code that doesn’t originate from your ASP.NET MVC application. Most commonly, I imagine, this need arises due to the fact that for security reasons browsers don’t allow AJAX calls to be made to domains external to the web app that served the original web page. The well known solution to this problem is to have your client side code make a request to your web application which will then make the request to the external resource and pass the result back to the client side AJAX request. There are other reasons, besides permitting cross domain AJAX calls, that you may want to use such a proxy. In our case we are hosting a GeoServer instance that serves web maps displaying proprietary, strategic customer spatial data. GeoServer has a relatively limited security model, at least in terms of remote administration, so we wanted to hide the GeoServer instance behind our firewall and layer our own, more sophisticated, role based security.

Whatever your motivations, this is a trivial feature to implement in almost any environment, and ASP.NET MVC is no exception. ASP.NET MVC’s flexible design also makes it possible to implement this kind of proxy in a very reusable, application-developer friendly way, reducing the code required on your controller to a single line. Of course, you could put your proxy in an HTTP (.axd) module and reduce the line count to zero lines of code if you wanted, but you may not want to open up a generic, free for all proxy mechanism to the client, for the same reasons that the cross domain restriction was created in the first place. I stole part of this solution from here. Here’s the code:

    public class ProxyResult : ViewResult
    {
        public ProxyResult(Uri targetUri)
        {
            TargetUri = targetUri;
        }

        public ProxyResult(string baseUrl,string queryString)
        {
            TargetUri = new Uri(baseUrl + "?" + queryString);
        }

        public Uri TargetUri
        {
            get; set;
        }

        public override void ExecuteResult(ControllerContext context)
        {
            WebRequest proxy = WebRequest.Create(TargetUri);
            using (WebResponse proxyResponse = proxy.GetResponse())
            {
                context.HttpContext.Response.ContentType = proxyResponse.ContentType;
                using (Stream proxyResponseStream = proxyResponse.GetResponseStream())
                {
                    StreamHelper.CopyStream(proxyResponseStream, context.HttpContext.Response.OutputStream);
                }
            }
        }
    }

    public static class StreamHelper
    {
        public static void CopyStream(Stream input, Stream output)
        {
            var buffer = new byte[32768];
            while (true)
            {
                int read = input.Read(buffer, 0, buffer.Length);
                if (read < = 0)
                    return;
                output.Write(buffer, 0, read);
            }

        }

    }

To provide proxied access to a specific, known url to your client side code via your controller:

    public class MapController : SecuredController
    {
        private readonly string _wmsServerUrl = ConfigurationManager.AppSettings["GeoServerUrl"] + "/wms";
        private readonly string _wfsServerUrl = ConfigurationManager.AppSettings["GeoServerUrl"] + "/wfs";

        public ActionResult Show()
        {
            return View("Map");
        }

        public ProxyResult WmsProxy()
        {
            return new ProxyResult(_wmsServerUrl, Request.QueryString.ToString());
        }

        public ProxyResult WfsProxy()
        {
            return new ProxyResult(_wfsServerUrl, Request.QueryString.ToString());
        }
    }

And in your client side javascipt code, you simply reference your local web app, and whatever query string would normally be required:

points = new OpenLayers.Layer.WMS(
            "Units",
            "/Map/WmsProxy",
            {
                layers: 'hsi:someprivatelayer',
                styles: '',
                srs: 'EPSG:4326',
                format: 'image/png',
                tiled: 'true',
                tilesOrigin: "143.60260815000004,-43.851764249999995",
                transparent: true
            },
            {
                'opacity': 1,
                'isBaseLayer': false,
                'wrapDateLine': true
            }
        );