Recently when building an app which (amongst other things) rendered links to other pages (created by others), I found I needed to be able to detect whether these other pages/resources actually existed – because people click on links which they can see and HTTP 404 messages are scary right?

Although I’m talking about Pages here, the principle applies equally to any SharePoint resource Url.

Helpfully there is a handy HTTP method just for this purpose ~ HTTP HEAD is the little brother (or sister) of HTTP GET.

HTTP HEAD

The HEAD method is identical to GET except that the server MUST NOT return a message-body in the response. The metainformation contained in the HTTP headers in response to a HEAD request SHOULD be identical to the information sent in response to a GET request. This method can be used for obtaining metainformation about the entity implied by the request without transferring the entity-body itself. This method is often used for testing hypertext links for validity, accessibility, and recent modification.

And so, here is the code;

checkSPWebResource(...) can be used synchronously or asynchronously and you supply 1 of the following;

• Absolute URL to a resource
• SPWeb relative URL to a resource
• Absolute or SPWeb relative (page) friendly URL

Optionally, the last parameter can be used to control it’s synch/async behaviour.

<label for='url' style='margin:5px;'>Enter URL: </label><br/>
<input type='text' style='margin: 5px;width:300px;' id='url'></input><br/>
<button id='check' style='margin: 5px;'>Check Page</button>
<div id='results' style='margin: 5px 5px 20px 5px;'>
</div>

<script type='text/javascript'>
(function($) {
"use strict";

$(function() {
	$('#check')
		.click(function(e) {
			e.preventDefault();

			var url = $('#url').val();
			checkSPWebResource(url, false)
				.always(function(resource) {
					var msg = resource.url +
									(resource.status ? ' :: Was Found' : ' :: NOT Found!!') +
									' @ ' + (new Date()).format('yyyy-MM-dd : hh:mm:ss.fffff');
					$('<p/>').html(msg).appendTo('#results');
				});

			$('<p/>').html('Done @ ' + (new Date()).format('yyyy-MM-dd : hh:mm:ss.fffff')).appendTo('#results');
		});
});

})(jQuery);
</script>

Checking for resources Asynchronously

Looking at the output we can see that the ‘Done’ message is displayed immediately before the completion message, reflecting the Asynchronous behaviour.

Checking for resources Synchronously

This time, looking at the output we can see that the ‘Done’ message is always displayed after the completion message, reflecting the Synchronous behaviour.