Passing cookie value to data-sly-use without using Use-API | Community
Skip to main content
V
v1101
Level 5
September 4, 2020
Solved

Passing cookie value to data-sly-use without using Use-API

  • September 4, 2020
  • 2 replies
  • 2198 views

Hello Community - I wanted to use the cookie or sessionstorage value in clientside using Javascript or Jquery (Not USE-API as this will be executed in serverside) and pass the value as one of the parameter(Instead of 'xyz') in data-sly-use & data-sly-test as well. Please let me know how to achieve this in HTL without using Use-API.

<div data-sly-use.testobj="${'com.aem.test.core.models.productInfo' @ cookieVal=xyz" data-sly-unwrap>

</div>

Any help in this is highly appreciated.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Surabhi_Katiyar

The cookie value cannot be sent through Javascript to the WCMPojo, because the javascript section loads after the HTML/JSP has been loaded. So, even if you fetch the cookie value using Javascript it will never reach the WCMPojo class until you reload via some dynamic template binding.

 

The other options are:-

1. Directly fetch the cookie in WCMPojo class using the request object

 

Cookie[] cookies = request.getCookies();
for (Cookie cookie: cookies) {
    String value = cookie.getValue();
}
 
2. Use the  USE-API
 

-------- script.js -------------

// Server-side JavaScript to get Coookie

use(function () {

var cookie = request.getCookie("wcmmode");

var cookieFound=false;

if(cookie!=null && cookie.value=="edit"){

cookieFound = true;

}

return {

cookieVal: cookie.value,

cookieFound:cookieFound

};

});

-------- Sightly code --------------

<sly data-sly-use.cObj="script.js" data-sly-test="${cObj.cookieFound }">

${cObj.cookieVal}

</sly>

2 replies

Nupur_Jain
Adobe Employee
Nupur_JainAdobe Employee
Adobe Employee
September 4, 2020

Hi @v1101 

 

If you want to pass value from clientside to serverside, session storage can never be an option as it is clientside and can not be accessed serverside.

 

You can use cookie as the cookie values are passed to serverside via "cookie" request header. In order to get the value of cookie.  You can use use api to get cookie value and then pass it to your sling model like this

 

cookie.js 

 

use(function () {

    var cookieValue = request.getCookie("cookiename");

    return {

       cvalue : cookieValue

    };

});

 

HTL

 

<div data-sly-use.cookie="cookie.js" data-sly-use.testobj="${'com.aem.test.core.models.productInfo' @ cookieVal=cookie.cvalue" data-sly-unwrap>

</div>

 

 

Hope it helps!

Thanks

Nupur

    V
    v1101Author
    Level 5
    September 4, 2020
    @Nupur - I am already using the above mentioned approach but there are some issues with the cookie value. It is not able to fetch the latest cookie value. for some reason it retains the old cookie value and it is not retrieving the new value
    Surabhi_Katiyar
    Adobe Employee
    Surabhi_KatiyarAdobe EmployeeAccepted solution
    Adobe Employee
    September 6, 2020

    The cookie value cannot be sent through Javascript to the WCMPojo, because the javascript section loads after the HTML/JSP has been loaded. So, even if you fetch the cookie value using Javascript it will never reach the WCMPojo class until you reload via some dynamic template binding.

     

    The other options are:-

    1. Directly fetch the cookie in WCMPojo class using the request object

     

    Cookie[] cookies = request.getCookies();
    for (Cookie cookie: cookies) {
        String value = cookie.getValue();
    }
     
    2. Use the  USE-API
     

    -------- script.js -------------

    // Server-side JavaScript to get Coookie

    use(function () {

    var cookie = request.getCookie("wcmmode");

    var cookieFound=false;

    if(cookie!=null && cookie.value=="edit"){

    cookieFound = true;

    }

    return {

    cookieVal: cookie.value,

    cookieFound:cookieFound

    };

    });

    -------- Sightly code --------------

    <sly data-sly-use.cObj="script.js" data-sly-test="${cObj.cookieFound }">

    ${cObj.cookieVal}

    </sly>

      Terms & ConditionsAccessibility statement

      Loading footer...