fetch window URL and verify using data-sly-test

Avatar

Avatar

Shaheena_Sheikh

Avatar

Shaheena_Sheikh

Shaheena_Sheikh

02-03-2021

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>

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar

Umesh_Thakur

MVP

Avatar

Umesh_Thakur

MVP

Umesh_Thakur
MVP

03-03-2021

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

Answers (5)

Answers (5)

Avatar

Avatar

Subbu_WCM

Avatar

Subbu_WCM

Subbu_WCM

03-03-2021

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

Avatar

Anudeep_Garnepudi

MVP

Avatar

Anudeep_Garnepudi

MVP

Anudeep_Garnepudi
MVP

03-03-2021

@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

Avatar

davidjgonzalezzzz

Avatar

davidjgonzalezzzz

davidjgonzalezzzz

03-03-2021

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.

Avatar

Avatar

bkhatr

Avatar

bkhatr

bkhatr

03-03-2021

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

Avatar

BrianKasingli

MVP

Avatar

BrianKasingli

MVP

BrianKasingli
MVP

03-03-2021

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>