What is the Lightning Component equivalent for Site.BaseUrl?
It seems that for now there is no equivalent to Site.BaseUrl. So I'm going to share what I've used to circumvent this:
On the component.cmp:
<aura:attribute name="baseUrl" type="String" default=""></aura:attribute>
<aura:attribute name="theme_ui" type="String" default=""></aura:attribute>
On helper.js:
getBaseUrl : function (component) {
var action = component.get('c.getBaseUrl')
action.setCallback(this, function (response) {
var state = response.getState()
if (component.isValid() && state === 'SUCCESS') {
var result = response.getReturnValue()
component.set('v.baseUrl', result)
}
})
$A.enqueueAction(action)
},
getUIDisplayed : function (component) {
var action = component.get('c.getUIThemeDescription')
action.setCallback(this, function (response) {
var state = response.getState()
if (component.isValid() && state === 'SUCCESS') {
var result = response.getReturnValue()
component.set('v.theme_ui', result)
}
})
$A.enqueueAction(action)
},
On the server-side:
@AuraEnabled
public static String getBaseUrl () {
if (Network.getNetworkId() != null) {
return [SELECT Id, UrlPathPrefix FROM Network WHERE Id = :Network.getNetworkId()].UrlPathPrefix;
}
return '';
}
@AuraEnabled
public static String getUIThemeDescription() {
return UserInfo.getUiThemeDisplayed();
}
And where I need to make the redirect, I've used this:
if (component.get('v.theme_ui') === 'Theme3') {
// salesforce classic
window.location.href = component.get('v.baseUrl') + '/' + result
} else {
// lightning experience
sforce.one.navigateToSObject(result)
}
Our use case is like this: we have multiple communities with shared footer- means we can use same footer component in all communities. But problem arises with relative URLs- how to make it working for each community... For example- 'News and Alert' link redirects to https://communityOne/newsandlaert wherease same link for another community is https://communityTwo/newsandlaert
The above solution works as expected for me. But I don't want to make a server side call (just for good page performance). So, I came up with solution by using custom labels.
Approach:
- For each community, there is custom label to hold the base URL of each community.
- There is a design attribute in this Footer component to pass the name of current community's related custom label.
- Get the custom label's value in controller.js dynamically.
- When drag and drop the component, enter custom label for current community/org in design attribute.
CommunityFooter.cmp
<aura:component implements="forceCommunity:availableForAllPageTypes" access="global" >
<aura:attribute name="currentCommunityBaseURLFROMLabel" type="String" default="My_Community_Base_URL_Label"/>
<!-- custom label name is "My_Community_Base_URL_Label" -->
<aura:attribute name="currentCommunityBaseURL" type="String"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<a href="{!v.currentCommunityBaseURL+'/news-alert'}"
</aura:component>
CommunityFooter.design
<design:component >
<design:attribute name="currentCommunityBaseURL" label="Current Community Base URL's Label Name" description="" />
</design:component >
CommunityFooter.js
doInit : function(component, event, helper) {
var keysite ="$Label.c."+component.get("v.currentCommunityBaseURLFROMLabel"); //= component.get("v.currentCommunityBaseURL");
var sitePrefix = $A.get(keysite);
component.set("v.currentCommunityBaseURL", sitePrefix);
console.log($A.get("$Label.c.currentCommunityBaseURLFROMLabel")+ 'Key...'+sitePrefix);
}
If anyone comes here to find the JS only solution to this, then the following snippet of code could be a good addition in your already made component.
Just create an attribute to hold the base URL value.
<aura:attribute name="cbaseURL" type="String"/>
And these lines of code into your JS controller.
var urlString = window.location.href;
var baseURL = urlString.substring(0, urlString.indexOf("/s"));
component.set("v.cbaseURL", baseURL);
I used "/s" as the breaking point for my url you can provide any string according to your requirement.