On Visualforce pages we were able to use {!$Site.BaseUrl} ([A global merge field type to use when referencing information about the current Force.com site][1]) to get the base url, so it was easier to build links to other parts of the system.

This is particularly useful when working with communities, since sometimes you want your community to have a specific name on the url, like company.my.salesforce.com/communityname/000000000000000.

I'm yet to find an equivalent for the Lightning Framework. Maybe it doesn't exist because page urls are different on LEX, but when using LCs on visualforce pages while on Salesforce Classic, this could save some time.

Is there an equivalent for use on Lightning Components?

  • I think there is nothing like that to refer to Lightning Components. Store the OrgURL+CommunityPrefix(/s) in the custom label and use that in LC's {!Label.c.OrgURL} May 17, 2017 at 19:22
  • But what if the component is being used on more than one community, or no community at all? Your solution wouldn't work. May 17, 2017 at 19:33
  • 1
    I presume at the moment you have to "do it yourself" by writing an @AuraEnabled Apex method that returns data from the Site class. But worth checking early though that the Site class works in that context.
    – Keith C
    May 17, 2017 at 20:20
  • I've shared the code I'm using as workaround to this limitation. May 22, 2017 at 18:57

3 Answers 3


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)
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)

On the server-side:

public static String getBaseUrl () {
    if (Network.getNetworkId() != null) {
        return [SELECT Id, UrlPathPrefix FROM Network WHERE Id = :Network.getNetworkId()].UrlPathPrefix;
    return '';

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
  • This is good workaround, but I just came with another which don't require a call to server side by using custom label....lemme add as answer ...may be helpful for someone..
    – Ayub
    Apr 3, 2018 at 7:34

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.


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.


  1. For each community, there is custom label to hold the base URL of each community.
  2. There is a design attribute in this Footer component to pass the name of current community's related custom label.
  3. Get the custom label's value in controller.js dynamically.
  4. When drag and drop the component, enter custom label for current community/org in design attribute.


<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'}"


<design:component >
     <design:attribute name="currentCommunityBaseURL" label="Current Community Base URL's Label Name" description="" />
</design:component >


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);

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .