Integrate Blackboard and SharePoint: Basic Authenticaton

In our last post we laid out the anatomy of a new InFlight integration. Briefly, each new InFlight target system integration has 6 core components; Basic Authentication, SSO Authentication, Basic Content Retrieval, Addressing JavaScript Errors, Advanced Content Retrieval, Look and Feel. In this post, we’re going to focus on the first component, Basic Authentication.

Basic Authentication

The initial hurdle of integrating InFlight with a new application is ensuring that you can embed the application and successfully login in.  In this case, we’re going to walk through this step in the product development process as it relates to the integration of Blackboard with SharePoint and the first step is to ensure that we can access the application.

The simplest way to verify this is to hit the login page itself.  This will allow us to confirm that Blackboard can be viewed within InFlight, as well as testing out the basic authentication mechanism.  We need to ensure that authentication is persistent among requests and that for no reasons are we asked to authenticate again during our regular workflow.

Our current environment contains SharePoint hosted at claims.contoso.com which has InFlight installed.  Our target will be a Blackboard installation at testedu.inflightintegration.com.

The login page for testedu.inflightintegration.com can be found at /webapps/login.  Let’s create a new SharePoint page which will contain an InFlight Viewer WebPart which target’s the login page.  We will create a new SharePoint page in SitePages called BlackboardLogin.  We will then add an InFlight Viewer Web Part to the page, as shown below in figure 1.

Figure 1.

On Your Mark, Get Set….Authenticate!

Now that we have our page setup, let’s try targeting the Blackboard login page in the InFlight Viewer.  If we’re lucky, it’ll just work correctly right out of the gate.  To check, first we edit the InFlight Viewer WebPart properties.  In the Content URL section, we paste the URL for the Blackboard login page.  i.e. https://testedu.inflightintegration.com/webapps/login.  Also, since we’re just testing out basic authentication, we’ll ensure that the “Enable Single Sign-On” checkbox is not enabled under the Basic Properties section.

Figure 2.

Now we’ll hit OK and finger’s crossed, it works!

Figure 3.

Other than a few JavaScript errors on first launch, it works!  We can access the login page.  We’ll enter our credentials to ensure that we can actually login to Blackboard.  If we hover over the Login button before pressing it, we can see that it is actually targeting InFlight rather than Blackboard directly, which is exactly what we want.  After clicking the Login button, we encounter more JavaScript errors, which we will ignore for now, but we see the following Blackboard Portal page.

Figure 4.

Well it’s good to see that authentication worked and we were redirected to the portal page (figure 4), but sadly it seems we’re no longer in our SharePoint site.  You can tell because the SharePoint navigation is gone. What happened?

JavaScript Strikes Again!

Blackboard is using JavaScript here to prevent one of its web pages from being displayed within a frame, which is what the InFlight Viewer uses.  It does this by checking to see if its web page is the top page, and if it isn’t, it replaces the top page with its own web page.  Now we want Blackboard’s content within our InFlight Viewer and within our SharePoint site.  So to alleviate this issue, we’ll need to create a rule to remove the JavaScript which prevents us from embedding one of Blackboard’s pages in the InFlight Viewer.

If we search through the JavaScript we discover,

<script type=”text/javascript”>

// Make sure we’re the top frame

if ( top != self ) { top.location.replace( self.location.href ); }

</script>

We need to modify this JavaScript so that it doesn’t replace itself as the top.

InFlight ConfigPacks

InFlight has a great feature called ConfigPacks, which allows us to group rules/application settings for a particular set of functionality (be it PeopleSoft, versions of applications, etc.) and compose many ConfigPacks, to create a complete rule set.  What’s nice about this is that since we’re starting new, we don’t need to go modify any existing rules or add to rules.  We can simply create our own new Blackboard ConfigPack and add rules to it as we go along.

So we’ll create a new ConfigPack called InFlight.ConfigPack.Blackboard.Base.config.  In it we have a rules section where we can append a rule to account for Blackboard avoiding being displayed within our InFlightViewer.  We will add the following rule,

<add

 name=”Blackboard-RemoveTopLocationAssignment”

enabled=”true”

specialUse=”false”

appliesToRequestHeadersRegex=””

appliesToResponseHeadersRegex=””

appliesToRequestPostBody=”false”

appliesToRequestUrl=”false”

appliesToResponseContent=”true”

filterByResolvedUrlPathAndQueryRegex=””

filterByHttpStatusCodesCSV=”200″

filterByContentTypeCSV=”html,javascript”

findRegex=”top.location.replace(s*self.location.hrefs*);”

findXpath=””

replacement=”if (1 == 0) var unreachable = 1;”

relatedOption=””

precedence=”5″

isRegexCaseSensitive=”false” />

Let’s look at this rule in more detail.  Since appliesToResponseContent is set to ‘true’, it tells InFlight that the context of the rule applies to the content of the response coming from Blackboard.  It also specifies with findRegex that we would like to find all matches within the response content that matches the regular expression provided.  In particular, we just need to replace,

top.location.replace( self.location.href );

which actually replaces the top with the Blackboard webpage.   The following regex provided in findRegex will do exactly that, “top.location.replace(s*self.location.hrefs*);”.

Now that InFlight has matched what we are looking for, we can simply replace it with JavaScript which will not execute, hence nullifying its purpose.  We provide the replacement JavaScript within the replacement property of the rule, “if (1 == 0) var unreachable = 1;”, and since 1 will never equal 0, the JavaScript code will never be run.

Now that we’ve added the Blackboard ConfigPack containing our new rule, it will be added alongside any rules which already exist.  Let’s try again.  We navigate to claims.contoso.com/SitePages/BlackboardLogin.aspx.  Enter our credentials, hit login, and the result is…

Figure 5.

Great!  We have successfully logged in to Blackboard, accessed the Blackboard Portal and remained within SharePoint! You can tell because in figure 5 you can see the Blackboard functionality contained within the SharePoint page while the SharePoint top and side navigation remains firmly intact.

For a short time, we’ll be evaluating organizations for inclusion in our Blackboard Early Adopter Program. If you are interested, click here. If you like the post, don’t be afraid to post a comment or follow us on Twitter @inflightcorp.