Dynamically Updating Links in KB Articles for Multiple Instance URLs

Managing multiple vanity URLs in ServiceNow can sometimes lead to user experience issues, especially when users are redirected between domains and prompted to log in again. To address this challenge, I developed a custom widget that dynamically adjusts URLs in knowledge base articles, ensuring users remain within the same domain and avoid unnecessary login prompts.

Why This Approach?

Instead of cloning the out-of-the-box widget and doing this server-side, which would require ongoing maintenance of the cloned widget to stay updated with ServiceNow releases, this custom widget provides a flexible and sustainable solution. By adding this widget to the knowledge base article page in the Service Portal, URLs in the displayed article are dynamically changed using Javascript to match the user’s current domain.

I’m sure it could be expanded for other use cases, but the Knowledge Base was our primary concern when creating it.

The Widget

The client controller script executes on the client-side to update the URLs in the knowledge base article. It identifies links that need adjustment and modifies them to keep users within the current domain.

Note: In our organisation, we have a custom URL redirect in place elsewhere in our organisation which redirects URLs such as https://kb.org.ac.uk/KB12345 to https://organisation.service-now.com/portal?id=kb_article_view&sysparm_article=KB12345. The redirect is something specific to us, and isn’t required, but wherever we link from one KB article to another we use this URL format. You may want to do the same, but whatever your preference is you can adjust the regex pattern in the script below to look for URLs in any particular format that you want to be updated.

2 seconds after the page loads, the client controller looks for any links in the https://kb.org.ac.uk/KB12345 format, and parses it to get the KB number. Then, it uses window.location.hostname to get the current hostname the user is on, and then updates the links on the page to be the full service portal URL for that article.

Here’s the client controller:

function($scope, $window, $rootScope, spUtil, $timeout) {
    var c = this;

    // Specify the Service Portal and the KB Article view page
    var serviceportal = "/kb";
    var kbpage = "kb_article_view";

    // Function runs 2 seconds after the page loads
    $timeout(function() {
        var links = document.getElementsByTagName('a');
        for (var i = 0; i < links.length; i++) {
            var link = links[i];
            var regex = /^https:\/\/kb.org.ac.uk\/(KB\d+)$/i; // Regex to look for the short URL
            var match = link.href.match(regex); // Perform the Regex match
            if (match) {
                var currentHostname = window.location.hostname.toLowerCase(); // Get the current hostname
                var articleId = match[1]; // Get the article KB number
                link.href = 'https://' + currentHostname + serviceportal + '?id=' + kbpage + '&sysparm_article=' + articleId; // Build the full URL
            }
        }
    }, 2000); // 2-second delay
}

Conclusion

This custom widget provides a simple yet effective solution for improving the user experience if using multiple vanity URLs in your ServiceNow instance. Feel free to implement this widget in your instance and see the difference it makes!

Related Posts