Skip to content
Advertisement

Adobe CQ/AEM cq:listeners does not consider URL params in the afteredit event for the “REFRESH_PAGE” action

Rrz

I’ve created a header component using AEM 6.5, part of that component only renders when and specific URL param is present, for example:

https://localhost:8443/sites.html/content/my-site/us-en/testheader.html?show_login

I’ve set my cq:listeners to make a page refresh after editing with

 <cq:listeners
    jcr:primaryType="cq:EditListenersConfig"
    afterdelete="REFRESH_PAGE"
    afteredit="REFRESH_PAGE"
    afterinsert="REFRESH_PAGE"
    afterMove="REFRESH_PAGE"/>

That works as expected but I’ve noticed that the URL param is not being taken as part of the URL when the refresh happens so the ?show_login is dropped. The part of the component waiting for the URL param to “appear” is missed until I manually refresh the page or the reload icon in the browser.

I’ve tried adding a custom listener using JS:
(window.location.href = window.location.href)

That actually refreshes the page taking the URL param into the equation. But for some reason, it makes a loop of reloading even when I only added that script to the afteredit listener.

Do you have some idea about how to “force” the “REFRESH_PAGE” listener to take URL params into account? What can I do to prevent that reload loop to get that part of the component relying on the URL param actually render?

Advertisement

Answer

I’m assuming you have a “secret” rendering-mode implemented. So editors can change the browser-URL and can do some “special”-editing.

To answer your question

I can confirm, that the query string gets lost. But the selector-string and the suffix survive. So the simplest solution for you, would be to use these. (I personally would recommend the selector, which is easily usable in HTL and the also the script-resolution, e.g. use a file .html in you component)

See https://experienceleague.adobe.com/docs/experience-manager-65/developing/platform/sling-cheatsheet.html and https://sling.apache.org/documentation/the-sling-engine/url-decomposition.html for more information.

I tested it with a little component:

<div>
<h2>Request Info</h2>
<dl>
    <dt>suffix</dt>
    <dd>${request.requestPathInfo.suffix}</dd>

    <dt>selectorString</dt>
    <dd>${request.requestPathInfo.selectorString}</dd>

    <dt>queryString</dt>
    <dd>${request.queryString}</dd>
</dl>
<div>

In the example request http://localhost:4502/editor.html/content/myproject/testpage.myselector.html/gime/more?topic=helloworld

The output is:

suffix           /gime/more
selectorString   myselector
queryString      topic=helloworld

The query string gets lost after an edit, and via “view as published” as well. But suffix and selector survive.

Additional Remarks

  • A REFRESH_PAGE is always bad, you should avoid it
  • Is the secret render-mode really necessary? AEM provides personalization features also for the editor. So there is a UI for logged-in/non-logged-in user and you can also switch between several sample users
  • Also consider custom cq:actions for you component

It is probably good for now. But a more experience developer would probably come with a better solution.

Advertisement