Serving Clientlibs from /content | Community
Skip to main content
SantoshSai
Community Advisor
SantoshSaiCommunity Advisor
Community Advisor
February 14, 2023
Solved

Serving Clientlibs from /content

  • February 14, 2023
  • 3 replies
  • 2950 views

Hi Everyone,

I know "Adobe recommends locating client libraries under /apps and making them available using the proxy servlet. However keep in mind that best practice still requires that public sites never include anything that is served directly over an /apps or /libs path."
However, my question is - is there any way to expose clientlib from /content ? I have my clientlib under page and I want to make it load when page is rendered (having specified categories in page script).


Thanks in advance!

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 BrianKasingli

Hey @santoshsai ,

Pretty much when you make a clientlibrary proxy=true, it will change the /apps/my-site/clientlibs/clientlib-site.js to /etc.clientlibs/apps/my-site/clientlibs/clientlibs-site.js. /etc.clientlibs is by default accessible to the public without any configurations from the publisher, but however, you do need to allow /etc.clientlibs in the dispatcher, and allow cache on this path.

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" jcr:primaryType="cq:ClientLibraryFolder" allowProxy="{Boolean}true" categories="sourcedcode.site"/>

Documentation: Using Client-Side Libraries | Adobe Experience Manager

3 replies

SantoshSai
Community Advisor
SantoshSaiCommunity AdvisorAuthor
Community Advisor
February 14, 2023

Well, tried this way - to update configuration here and allow library paths in Adobe Granite HTML Library Manager 



But NO LUCK!

Santosh Sai
    Manu_Mathew_
    Community Advisor
    Manu_Mathew_Community Advisor
    Community Advisor
    February 15, 2023

    @santoshsai This seems like a similar thread on this topic- https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/html-library-manager-allowed-client-libs-path/td-p/284277

    As per this, we could embed it via the /libs/ clientlibs. As clientlibs gets expose them via /etc.clientlibs

     

      Jagadeesh_Prakash
      Community Advisor
      Jagadeesh_PrakashCommunity Advisor
      Community Advisor
      February 15, 2023

      @santoshsai 

      To serve clientlibs from /content, you will need to perform the following steps:

      1. Configure the clientlibs to be stored under /content. This can be done by updating the clientlibs node under the cq:designer node in the CRX repository. Change the baseFolderPath property to /content/clientlibs.

      2. Update the clientlib categories to point to the new base folder. This can be done by updating the categories property for each clientlib in the CRX repository. For example, change the value from /etc/clientlibs/myproject to /content/clientlibs/myproject.

      3. Create a mapping in the Apache Sling Resource Resolver configuration to map requests for clientlibs from /content to the appropriate location in the repository. This can be done by creating a new mapping rule in the Apache Sling Resource Resolver configuration under /conf/global or /apps.

      With these steps in place, requests for clientlibs from /content will be routed to the appropriate location in the repository, and the clientlibs will be served from there.

      It's important to note that serving clientlibs from /content can have an impact on performance, as clientlibs are typically cached and served from a different location in AEM. Therefore, it's important to test and monitor the performance of your AEM instance after making this change.

        BrianKasingli
        Community Advisor and Adobe Champion
        BrianKasingliCommunity Advisor and Adobe ChampionAccepted solution
        Community Advisor and Adobe Champion
        February 15, 2023

        Hey @santoshsai ,

        Pretty much when you make a clientlibrary proxy=true, it will change the /apps/my-site/clientlibs/clientlib-site.js to /etc.clientlibs/apps/my-site/clientlibs/clientlibs-site.js. /etc.clientlibs is by default accessible to the public without any configurations from the publisher, but however, you do need to allow /etc.clientlibs in the dispatcher, and allow cache on this path.

        <?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" jcr:primaryType="cq:ClientLibraryFolder" allowProxy="{Boolean}true" categories="sourcedcode.site"/>

        Documentation: Using Client-Side Libraries | Adobe Experience Manager

          SantoshSai
          Community Advisor
          SantoshSaiCommunity AdvisorAuthor
          Community Advisor
          February 16, 2023

          @briankasingli Thank you for your response. However, As I mentioned in my query I want to expose clientlib from /content - Basic Idea behind this is -

          1. Place clientlib under page and when user activate the the page clientlib should also be activated and load the library.

           

          I have tried placing clientlib under page but clientlib not loading and if I place it under /apps, /etc, /libs it works.

           

          Hope you get my question now.

          Santosh Sai
            BrianKasingli
            Community Advisor and Adobe Champion
            BrianKasingliCommunity Advisor and Adobe Champion
            Community Advisor and Adobe Champion
            February 16, 2023

            okay, interesting,

            This would be an expensive implementation, given that you might need to produce your own backend code to handle the conversion of aem clientlib category to /etc.clientlibs or /content/*.

            <sly data-sly-use.clientlib="/libs/granite/sightly/templates/clientlib.html">
                <sly data-sly-call="${clientlib.js @ categories='sourcedcode.site'}"/>
            </sly>

            As you can see the code above, this produces /etc.clientlibs/sourcedcode/clientlibs/clientlibs-site.js|css. Not only that AEMaaCS will produce clientlib versioning, when using the Adobe snippet to reference client libs in your AEM environment.

             

            ======================================================================

             

            Hmm, it sounds to me that this is a dispatcher issue. Maybe take a look at it and allow /etc.clientlibs/*

             

             

              Terms & ConditionsAccessibility statement

              Loading footer...