Create multiple Server Farms in one IIS ARR (Application Request Routing)

Most people use ARR to increase web applications' scalability and reliability by leveraging rule-based routing, load balancing, shared hosting and disk caching, etc. In my case, I found it a very good solution for medium sized corporations to expose their data via RESTful, OData or SOAP based web services if they already have the infrastructure in place and do not intend to go Cloud at the moment.

In our business scenario, there are a few implicit requirements:

1. We should be able to use existing infrastructure without adding new hardware/servers.
2. We should be able to expose all services using only one endpoint, which is the gateway. Furthermore, we expose the services as standard HTTP port 80 while the actual ports for our internal services are not disclosed.
3. We must have the least number of holes in firewall for all services, ideally the number would be one.
4. We should have a consistent and clean URL pattern for all services. For example: http://greatplace.org/Services/thisService?param1=x and http://greatplace.org/Services/thatService/, etc.
5. We may also use this gateway to expose other resources than web services, e.g. reports.
6. The server farms can support different authentications, e.g. reports farm does not allow anonymous access.
7. The solution must be reliable and easy to maintain though load balancing and redundancy are not big concerns at present.

A simple practical design is like this:

For big enterprises, multiple ARRs can be utilised for routing specific types of requests to different server farms, for example one ARR for reporting server farm and one for general web services, etc. But what I am sharing here is how to use one ARR to dispatch requests to multiple server farms based on rule-based routing.

So first we create two server farms, add servers (and port mappings if any) in each farm:

Then we add the URL Rewrite rules

For the Reports Farm, we would like the original URL http://internal.server.ip:port/Reports/Pages/Report.aspx?ItemPath=SomePath to be routed to the servers in the reports farm with the exposed URL being http://external.server.ip/Reports/Pages/Report.aspx?ItemPath=SomePath, so the rule is like:

For the Services Farm, we would like the original URL, e.g. http://internal.server.ip:port/Services/Service1/Odata.svc/Products(5) to be routed to the servers in the services farm with the exposed URL being http://external.server.ip/Service1/Odata.svc/Products(5), so the rule is like:

And there we go. We can then configure the load balance and caching stuff as usual. It's awesome that ARR provides such great flexibility and capability in IIS.

Ref:

1. ARR
2. Using the URL Rewrite Module

Dynamic Dependency Map using ExtJS 3 and WCF RESTful

Fleetingly time passed. When I was cleaning my archive recently, an interesting project I did last year just reminded me of that. Anyway, that project was aimed to create a dynamic map to maintain and show the dependencies of our applications. Here is a short demo:

Design diagram:

Screenshots if vedio is too slow:

Extend jQuery.highlight to highlight regular expressions

The jquery.highlight is a succinct and easy-to-use jQuery plugin to highlight texts. The current version can only highlight literary words case insensitively, but I extended it to highlight regular expressions so that you can highlight things like "foo*bar" as well. jquery.myhighlight-3.js:

/*

highlight v3 - Modified by Marshal (beatgates@gmail.com) to add regexp highlight, 2011-6-24

Highlights arbitrary terms.

<http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html>

MIT license.

Johann Burkard
<http://johannburkard.de>
<mailto:jb@eaio.com>

*/

jQuery.fn.highlight = function(pattern) {
    var regex = typeof(pattern) === "string" ? new RegExp(pattern, "i") : pattern; // assume very LOOSELY pattern is regexp if not string
    function innerHighlight(node, pattern) {
        var skip = 0;
        if (node.nodeType === 3) { // 3 - Text node
            var pos = node.data.search(regex);
            if (pos >= 0 && node.data.length > 0) { // .* matching "" causes infinite loop
                var match = node.data.match(regex); // get the match(es), but we would only handle the 1st one, hence /g is not recommended
                var spanNode = document.createElement('span');
                spanNode.className = 'highlight'; // set css
                var middleBit = node.splitText(pos); // split to 2 nodes, node contains the pre-pos text, middleBit has the post-pos
                var endBit = middleBit.splitText(match[0].length); // similarly split middleBit to 2 nodes
                var middleClone = middleBit.cloneNode(true);
                spanNode.appendChild(middleClone);
                // parentNode ie. node, now has 3 nodes by 2 splitText()s, replace the middle with the highlighted spanNode:
                middleBit.parentNode.replaceChild(spanNode, middleBit); 
                skip = 1; // skip this middleBit, but still need to check endBit
            }
        } else if (node.nodeType === 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) { // 1 - Element node
            for (var i = 0; i < node.childNodes.length; i++) { // highlight all children
                i += innerHighlight(node.childNodes[i], pattern); // skip highlighted ones
            }
        }
        return skip;
    }
    
    return this.each(function() {
        innerHighlight(this, pattern);
    });
};

jQuery.fn.removeHighlight = function() {
    return this.find("span.highlight").each(function() {
        this.parentNode.firstChild.nodeName;
        with (this.parentNode) {
            replaceChild(this.firstChild, this);
            normalize();
        }
    }).end();
};

Here is a test file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript" src="lib/jquery-1.6.js"></script>
<script type="text/javascript" src="lib/jquery.myhighlight-3.js"></script>
<style>
.highlight {
    background-color: yellow;
}
</style>
</head>
<body>

<div id="row">
    <div>
        <a class="fullname" href="#"><span class="lastname">Goog</span>, <span class="firstname">Billy</span></a>
        <div id="remove">ServIcE: (click me to remove all highlight)</div>
        <div><span class="section">Pig &amp; Sheep Serv</span>, <span class="department">Cow Administration &amp; Management</span></div>
        <div class="org">Trade Administration, Administration Services</div>
        <div id="email">
            <a class="email" href="mailto:a@abc.com">a@abc.com</a>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(function() {
        $("#row").highlight("service");
        $(".lastname").highlight("o");
        $(".section").highlight(/g.*ep/i);
        $(".department").highlight(/.*/i);
        $(".org").highlight(/adm.*(?=, )/i);
        $("#email").highlight(/a.c\./);
        $("#remove").click(function() {$("#row").removeHighlight();});
    });
</script>

</body>
</html>

And the result:

Here are the links for the source code:

1. jquery.myhighlight-3.js
2. jquery.myhighlight-3.min.js

Type-as-you-go Ajax People Search Web Part using SharePoint 2007 Search Services - Part II

After prototyped and compared both solutions, I found that Content Editor Web Part(CEWP) + Javascript seems more suitable for our needs. It's not only more lightweight, interactive and flexible, but also less administration overhead. The product looks like this:

Here is the design diagram:

Pure Javascript and HTML stuff wrapped in a SharePoint CEWP. The core component here is MyXslt transformer, a small Javascript library I released to transform the search service result (XML) into HTML elements. Below is a list of libraries I used:

Javascript libraries

jQuery	1.5+
MyXslt	XSLT transformer that transforms the search service result XML directly into HTML elements
jQuery UI	UI for dialogs
QTip	jQuery plugin for tip style people's details
Highlight	jQuery plugin for keyword highlighting
MyImgScale	jQuery plugin for Image scaling

The solution layout (for commercial reasons, the full source code is not published at this stage):

PeopleSearch
    +---.hg
    +---clientSideSolution
    |   +---cewp
    |   +---release
    |   +---standalone
    |   +---unitTest
    |   \---_layouts
    |       \---1033
    |           +---images
    |           +---js
    |           +---styles
    |           \---xslt
    +---PeopleSearchWebpart
    +---data
    +---script
    +---UnitTest
    +---UserControlTest
    +---WebTest
    +---LoadTest
    \---TestResults

Another thing worth mention is that the load testing results (see above, using Visual Studio 2010's built-in load testing tool) showed the application was very responsive too.

Type-as-you-go Ajax People Search Web Part using SharePoint 2007 Search Services - Part I

In my organization, the SharePoint 2007's built-in People Search web part does not meet our needs:

• Very limited in customizing both the query and the presentation of the results
• No wild card search out of the box
• Not very interactive/attractive: no type-as-you-go, no ajax, slow response, etc.

To overcome those limitations and create a more user-friendly and powerful people search solution, there are generally two options: 1) build your own web part (business logic at server-side) or 2) use the shipped Content Editor Web Part with your customized content (processing at client-side). Here are the pros and cons of the two solutions:

Comparison between Web Part Solutions

	Server-side Processing	Client-side Processing
Pros	Easier server-side code development with C#, eg. SharePoint search API, XML query packet handling, etc Easier testing and debuging with Visual Studio Logging and exception handling ability	Assembly free, easier to deploy and administrate Processing in client, less load/performance impacts Built-in Ajax
Cons	More work in deployment and administration Harder Ajax, have to mix ASP.NET user control and jQuery Processing in server, potential load/performance impacts	Javascripts harder to test, debug and maintain Harder logging and exception handling

The traditional server-side SharePoint 2007 web part development is actually easy, if you are using the WSPBuilder with Visual Studio 2010. There are quite a few good articles about how to do that, eg. Developing SharePoint WebParts using User Controls and Web Applications by ggalipeau. Some of the contents are a little outdated, but the steps are still applicable. The new layout in Visual Studio now looks like this:

Be careful there are a few catches though, especially the WSPBuilder 1.0.6 generated codes contain some defects. Eg. in xxxReceiver.cs, you have to comment out all contents in FeatureActivated() as SPFeatureReceiver doesn't have FeatureActivated() method. The first line of FeatureDeactivating() this.FeatureDeactivating(properties); must also be removed as this recursive calls will bring you a stack overflow.

Other than those small bugs, WSPBuilder really helps you a lot in focusing on your business logic, and takes off the pain of generating .wsp web part, packaging and deployment, etc. However, as indicated in the above comparison table, the ASP.NET user control was not born with Ajax functionality and the prerequisite of a local SharePoint instance for integration with the development tools is too heavy and dulls the web part development and testing. Well, if you were a Java developer, probably this would remind you of those similar/painful EJB 2.1 days :-)

MyXslt v0.2 released

In my previous blog, I provided a temporary fix for jQuery XSLT plugin. However, it is neither complete nor correct due to the plugin's lacking of callback interface during its asynchronous XSLT processing. From David Flanagan's excellent book "JavaScript: The Definitive Guide (5th Edition)", I found a pure Javascript solution and decided to enhance it to suit my needs.

The potential usage of this small Javascript library is calling any web services that return XML then transforming it directly to HTML elements by XSLT. In my case, I created a customized People Search web part in SharePoint 2007 as a replacement for the built-in one, and made complicated search easier, more flexible and interactive. This web part doesn't need any server side programming as it's pure HTML + Javascript contained in SharePoint's provided Content Editor Web Part. For more information about this web part, please stay tuned.

More information here, downloads and source code.

Fix jQuery plugin xslt.js not working in Firefox 3.x

First of all, thanks Johann for his excellent jQuery XSLT plugin here.

Unfortunately, this one doesn't work with jQuery 1.5 in Firefox 3. One of the reasons is the readyState was changed to 0 after $.ajax loaded the xml and xslt files. Below is my fix by replacing line 84-118 in jquery.xslt.js with the following:

var change = function() {
    if (xm.readyState == xs.readyState && !transformed) {
        var processor = new XSLTProcessor();
        if ($.isFunction(processor.transformDocument)) {
            // obsolete Mozilla interface
            resultDoc = document.implementation.createDocument("", "", null);
            processor.transformDocument(xm.responseXML, xs.responseXML, resultDoc, null);
            target.html(new XMLSerializer().serializeToString(resultDoc));
        }
        else {
            processor.importStylesheet(xs.responseXML);
            resultDoc = processor.transformToFragment(xm.responseXML, document);
            target.empty().append(resultDoc);
        }
        transformed = true;
    }
};

if (str.test(xml)) {
    xm.responseXML = new DOMParser().parseFromString(xml, "text/xml");
}
else {
    xm = $.ajax({ dataType: "xml", url: xml});
}

if (str.test(xslt)) {
    xs.responseXML = new DOMParser().parseFromString(xslt, "text/xml");
}
else {
    xs = $.ajax({ dataType: "xml", url: xslt});
}
change();
return this;

Will contact the author and update the post later...
(Update: the author hasn't responded, but I created a better solution here.)

Ref: xslt.js version 3.2