Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

fetch window URL and verify using data-sly-test

Avatar

Level 6

The below lines of scripts loads for both author and publish instances. But I want to restrict it based on author and publish environment. Our author environment URL has "author-" keyword in it, while publish environment URL doesn't. So I was thinking can the URL help in this case? I wanted to fetch the URL and verify before loading the script. Can the URL be verified using a data-sly-test? And how can i fetch the URL?

<sly data-sly-test= <need to verify here>>
<script type="text/javascript" src="//<path here>"></script>
<script type="text/javascript" src="//<path here>"></script>
</sly>

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @Shaheena_Sheikh,

There might be so many issues with your approach to know the environment from the url instead you can take help of run-mode or wcm mode because its value will not be changed but url can be changed.

And another problem will be like if you access your instance with IP or hostname then your logic will fail.

Your remedy is take help from SlingSettingService thru javascript or java then get the runmodes in sightly or use wcm mode as in below articles:

Sling Setting Service:

https://gist.github.com/gabrielwalt/278f8cee870aac7ec619

 

Wcm mode:

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-now-publish-mode-ed...

 

Hope this will help.

Umesh Thakur

View solution in original post

15 Replies

Avatar

Correct answer by
Community Advisor

Hi @Shaheena_Sheikh,

There might be so many issues with your approach to know the environment from the url instead you can take help of run-mode or wcm mode because its value will not be changed but url can be changed.

And another problem will be like if you access your instance with IP or hostname then your logic will fail.

Your remedy is take help from SlingSettingService thru javascript or java then get the runmodes in sightly or use wcm mode as in below articles:

Sling Setting Service:

https://gist.github.com/gabrielwalt/278f8cee870aac7ec619

 

Wcm mode:

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-now-publish-mode-ed...

 

Hope this will help.

Umesh Thakur

Avatar

Level 6
my only concern with wcmmode.disabled is : when i open a page directly in publish instance, the URL will not have the "wcmmode=disabled" part in it, will my code work properly then?

Avatar

Community Advisor
On publisher wcmmode is disabled by default so there should not be any problem with that.

Avatar

Level 6

Even when my pages go Live via some domain, the code using wcm modes will work fine, right? in this case also it will load the part of code that is related to the publish instance?

Avatar

Community Advisor

With sling models, you can do something like this: (sightly example will be the next block of code. The key is to detect the runmode that contains author, 

slingSettingsService.getRunModes().contains("author")

Sling Model:

 

package com.mysite.core.models;

import com.adobe.cq.export.json.ExporterConstants;
import org.apache.sling.api.SlingHttpServletRequest;
import org.apache.sling.api.resource.Resource;
import org.apache.sling.models.annotations.DefaultInjectionStrategy;
import org.apache.sling.models.annotations.Exporter;
import org.apache.sling.models.annotations.Model;
import org.apache.sling.settings.SlingSettingsService;

import javax.annotation.PostConstruct;
import javax.inject.Inject;
import java.io.Serializable;

@Model(adaptables = {SlingHttpServletRequest.class, Resource.class},
        resourceType = Hero.RESOURCE_TYPE,
        defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
@Exporter(name = ExporterConstants.SLING_MODEL_EXPORTER_NAME, extensions = ExporterConstants.SLING_MODEL_EXTENSION)
public class Hero implements Serializable {
    
    public static final long serialVersionUID = -2080153731798462971L;

    static final String RESOURCE_TYPE = "/apps/my-site/components/content/hero";

    @OSGIService
    private SlingSettingsService slingSettingsService;

    @PostConstruct
    private void init() {
        String endpoint = "https://api.publish.my-site.com/contacts";
        if (slingSettingsService.getRunModes().contains("author")) {
            endpoint += "https://api.author.my-site.com/contacts";
        }
    }
}

 

 

 

Sightly

 

<sly data-sly-use.hero="com.mysite.core.models.Hero"/>
<script data-sly-test="${hero.endpoint}" src="${hero.endpoint}"></script>

 

 

 

 

Avatar

Level 1

Hi,

 

It will not be appropriate to rely on URL to differentiate between Author and Publish environment. You can use run modes to differentiate between Author and Publish environment. Now we need to locate current run modes in our Sightly/HTL . To achieve this, we can use Sightly/HTL JavaScript Use-API. Below is the sample code to find out current run modes :

 

1. Creating JavaScript file containing use-class under same path where our Sightly/HTL resides :

 

runmodes.js

var SlingSettingsService = Packages.org.apache.sling.settings.SlingSettingsService;
 
use(function () {
    // Get runmodes and transform them into an object that is easier to read for Sightly
    var runmodesObj = {};
    var runmodesSet = sling.getService(SlingSettingsService).getRunModes();
    var iterator = runmodesSet.iterator();
    
    while (iterator.hasNext()) {
        runmodesObj[iterator.next()] = true;
    }
    
    return {
        runmodes: runmodesObj
    }
});

This will give us all the run modes.

 

2. Using above run modes information in Sightly/HTL to load required scripts on Author and Publisher :

 

<sly data-sly-use.runmodes="runmodes.js">
  <sly data-sly-test="${logic.runmodes.author}">
     <script type="text/javascript" src="//author script"></script>
  </sly>
  <sly data-sly-test="${logic.runmodes.publish}">
     <script type="text/javascript" src="//publisher script"></script>
  </sly>
</sly>

 

Avatar

Employee

As noted in the other threads..

 

Toggling based on wccmode is indeed preferred over the other solutions, as AEM Author's preview view should mimic Publish as closely as possible.

 

The wcmmode is actually extracted via Sling Filter (which looked for in a variety of places; query param, cookie, or default/forced values per environment type). AEM Publish has a default, forced wcmmode of disabled, so you can always rely on Publish resolving wcmmode to disabled.

Thanks! This is what I needed to confirm. Because when we directly open a page which is live, I dont see "wcmmode disable" part in the URL. My concern was if we dont see wcmmode disabled in the URL, then will my code work (If i use wcmmode based code)
My other concern is, when my page goes live on a domain, will this wcm mode code still work? In case of going live also, i would need the publish part of code to get rendered. Can you please confirm this?
Yes - the wcmmode code will work when you deploy it to your live site on whatever domain. The wcmmode on AEM Publish is always "disabled". Think of it this way, AEM uses "wcmmode = disabled" when the page should be rendered without all the WCM (Web Content Management) bells and whistles that are used by authors to author the content.

Avatar

Community Advisor

@Shaheena_Sheikh 

You want load scripts based on runmodes like author/publish or edit/non-edit mode?

My suggestion is to have a edit mode check.

 

<sly data-sly-test="${wcmmode.disabled}">
    <script ...></script>
    <script ...></script>
</sly>
(OR)
<sly data-sly-test="${slyWcmHelper.mode.disabled}">
    <script ...></script>
    <script ...></script>
</sly>

If you want runmode specific, there are so many beautiful examples down below in replies.

 

Avatar

Level 1

you can use wcmmode to determine the whether the page is loading in publish or not . can you try with below code snippet? 

<sly data-sly-test=${wcmmode.disabled}>
     // include scripts to load on publish
    <script type="text/javascript" src="//<path here>"></script>
    <script type="text/javascript" src="//<path here>"></script>
</sly>

<sly data-sly-test=${!wcmmode.disabled}>
     // include scripts to load on other than publish
    <script type="text/javascript" src="//<path here>"></script>
    <script type="text/javascript" src="//<path here>"></script>
</sly>

 

Avatar

Level 6
Hi, I tried this, works nice for author, but in Publish instance i see the code for author is also loading along with the publish code. So i changed !wcm.mode to edit mode