Sharepoint Hosted App- Get HostwebUrl and AppwebUrl on navigation

Question

Can anyone provide a sample code for getting HostWebUrl and AppWebUrl when redirect from Default page to another page. How can we do this ? I am using the following code its work for Default but not for another page-

hostweburl = decodeURIComponent(getQueryStringParameter("SPHostUrl"));
appweburl = decodeURIComponent(getQueryStringParameter("SPAppWebUrl"));

var scriptbase = hostweburl + "/_layouts/15/"; 
var context = new SP.ClientContext(appweburl); 

appContextSite = new SP.AppContextSite(context, hostweburl);
web = appContextSite.get_web();

Answer 1

The issue is that when you navigate to another page you're losing the query strings in the URL.

I get around this by appending the query strings to my hyperlinks in the onclick attribute:

onclick="window.location='time.aspx'+window.location.search;"

So full example:

<a style="cursor:pointer;" onclick="window.location='time.aspx'+window.location.search;">Time Application</a>

Of course you'll need to replace 'time.aspx' with the name of the page you're navigating to.

This might not be ideal for you, but it was an acceptable workaround in my case.

Answer 2

I use a function like this to add the standard tokens to a URL.

Pluralsight.UrlUtils.addStandardTokens = function(url) {
    var tokens = ["SPHostUrl", "SPAppWebUrl", "SPLanguage", "SPClientTag", "SPProductNumber"];

    for (var i = 0; i < tokens.length; i++) {
        var token = tokens[i];
        var value = GetUrlKeyValue(token);
        if (SP.ScriptUtility.isNullOrEmptyString(value) == false) {
            url = SetUrlKeyValue(token, value, true, url);
        }
    }

    return url;
}

// Calling code ******************************************

addLink.click(function () {
      var url = "ProductAdd.aspx";
      url = Pluralsight.UrlUtils.addStandardTokens(url);
      SP.Utilities.HttpUtility.navigateTo(url);
})

Note: GetUrlKeyValue and SetUrlKeyValue are built-in SharePoint functions