on AEMaaCS how do I flush icons from the resources folder? | Community
Skip to main content
S
SupportMember
Level 6
June 10, 2024

on AEMaaCS how do I flush icons from the resources folder?

  • June 10, 2024
  • 5 replies
  • 1546 views

On AEMaaCS we have released updated png logo under /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.png. This file is cached at the dispatcher level how would we flush the AEMaaCS cache for this particular file?

Other files includes

  1. /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.png
  2. /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.svg
  3. /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/hammer.png
  4. /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/spinner.gif

etc...
Thank you.

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

5 replies

gkalyan
Community Advisor and Adobe Champion
gkalyanCommunity Advisor and Adobe Champion
Community Advisor and Adobe Champion
June 11, 2024

@supportmember 

Check out this documentation about  caching and invalidation. This might be a useful link.

https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/implementing/content-delivery/caching#explicit-invalidation

    HrishikeshKagne
    Community Advisor
    HrishikeshKagneCommunity Advisor
    Community Advisor
    June 11, 2024

    Hi @supportmember ,

    To flush the cache for specific files like images (PNG, SVG, GIF) under /etc.clientlibs/ in AEM as a Cloud Service (AEMaaCS), you need to perform a few steps. This involves using the AEMaaCS API and dispatcher tools to invalidate the cache. Here's a step-by-step guide on how to achieve this:

    Step-by-Step Guide to Flush Cache for Specific Files

    1. Identify the Files to Invalidate

    Identify the paths of the files that need to be invalidated in the dispatcher cache. In your case, the files are:

    • /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.png
    • /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.svg
    • /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/hammer.png
    • /etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/spinner.gif

    2. Use the AEM Dispatcher Tools

    AEM as a Cloud Service provides tools to manage the dispatcher cache. One of the key tools is the invalidate.cache API. You can use this API to invalidate specific paths.

    3. Invalidating Cache Using the AEM API

    You can use a POST request to invalidate the cache for the specific files. Here’s how to do it:

    Using cURL

     

    curl -X POST -u '<username>:<password>' \ -H "Content-Type: application/json" \ https://<aem-host>/dispatcher/invalidate.cache \ -d '{ "paths": [ "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.png", "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.svg", "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/hammer.png", "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/spinner.gif" ] }'

     

    Replace <aem-host> with your AEMaaCS hostname and <username>:<password> with your credentials.

    Using Postman
    1. Open Postman.
    2. Create a new POST request.
    3. Set the URL to https://<aem-host>/dispatcher/invalidate.cache.
    4. Set the Authorization to Basic Auth and enter your username and password.
    5. Set the Content-Type header to application/json.
    6. In the body, use the raw JSON format:

     

    { "paths": [ "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.png", "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.svg", "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/hammer.png", "/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/icons/spinner.gif" ] } ​

     

    1. Send the request.

    4. Verify the Cache Invalidation

    After invalidating the cache, ensure that the changes are reflected:

    • Check the Dispatcher Logs: Review the dispatcher logs to confirm that the invalidation requests were processed.
    • Access the Files: Access the files via the browser or use tools like curl to ensure they are served as expected.

     

    curl -I https://<aem-host>/etc.clientlibs/my-site/clientlibs/clientlib-site/resources/assets/logo.png ​

     

    Additional Considerations

    • Automation: You can automate this process using CI/CD tools or scripts if cache invalidation is needed regularly.
    • Dispatcher Flush Agents: Ensure that your AEM publish instances are correctly configured to communicate with the dispatcher for cache invalidation.

    By following these steps, you can flush the cache for specific files in AEM as a Cloud Service, ensuring that updates to your resources are immediately reflected.




    Hrishikesh Kagane
      S
      SupportMemberAuthor
      Level 6
      June 11, 2024

      Thanks ChatGPT, I've been following you, and this is considered spamming, I am reporting you. 

      You should have a word with the administrators, this is getting out of hand. It's just very disrespectful to the community... You should really stop.. Spamming is not good, and also shows us that you are not a professional because anyone can use chat GPT to post questions on the query.

        S
        SupportMemberAuthor
        Level 6
        June 13, 2024

        @kautuk_sahni @joerghoh , please be informed that spamming is on this Community at the moment.

          S
          SupportMemberAuthor
          Level 6
          June 17, 2024

          @joerghoh @arunpatidar @aanchal-sikka @rohan_garg @raja_reddy , please if you can shed some experiences here, it would be extremely helpful, thank you.!

            Rohan_Garg
            Community Advisor
            Rohan_GargCommunity Advisor
            Community Advisor
            June 18, 2024

            AEM Publish service has two primary caching layers, the AEMaaCS CDN and AEM Dispatcher. Assuming you don't have a custom CDN in front of the Cloud CDN, try the below steps-

            1. CDN - The AEM Publish CDN is TTL (time-to-live) based, meaning that the cache life is determined by the Cache-Control, Surrogate-Control, or Expires HTTP response headers. Refer CDN Cache Life
              Furthermore, Fastly also provides an API to purge cache (Refer Fastly - Purging)
              You can configure a corresponding TTL parameter for the resources as shown below - 

              <LocationMatch "^/etc\.clientlibs/.*\.(?i:json|png|gif|webp|jpe?g|svg)$">
   Header set Cache-Control "max-age=43200,stale-while-revalidate=43200,stale-if-error=43200,public" "expr=%{REQUEST_STATUS} < 400"
   Header set Age 0
</LocationMatch>​

               

            2. Dispatcher - Refer How to clear Dispatcher cache?
              Note - The Adobe CDN is not flushed when Dispatcher is invalidated. The Adobe-managed CDN respects TTLs and thus there is no need for it to be flushed.

            If however, you don't want to change/modify the TTLs in your dispatcher configuration then you can look at creating a custom servlet which purges cache from both Dispatcher and CDN. Please refer the blog Invalidate Dispatcher and Purge Fastly CDN Cache using API


            Hope this helps!
              joerghoh
              Adobe Employee
              joerghohAdobe Employee
              Adobe Employee
              June 20, 2024

              How do you deploy this file? Via fullstack pipeline or frontend pipeline?
              In case of the fullstack pipeline: Not a problem, as new instances will be started with an empty dispatcher cache. So you don't need to invalidate them.

              Frontend pipeline: Good question, I am not an expert in that ... would need to learn to first how it is implemented internally 🙂

                BrianKasingli
                Community Advisor and Adobe Champion
                BrianKasingliCommunity Advisor and Adobe Champion
                Community Advisor and Adobe Champion
                August 13, 2024

                From my experience, you can do this in 2 ways.
                1. New AEMaaCS Code Deployment, https://sourcedcode.com/blog/aem/how-to-clear-flush-aemaacs-cache-after-code-deployment?swcfpc=1

                2. Adding dispatcher cache rules. I'd like to watch how the Adobe WKND project setup rules, and so we can see a rule here

                 

                <LocationMatch "^/etc\.clientlibs/.*\.(?i:json|png|gif|webp|jpe?g|svg)$"> Header set Cache-Control "max-age=43200,stale-while-revalidate=43200,stale-if-error=43200,public" "expr=%{REQUEST_STATUS} < 400" Header set Age 0 </LocationMatch>

                 

                • max-age=43200: etc.clientlibs(json|png|gif|webp|jpe?g|svg) are cached for 24hrs. During this time, the CDN serves the cached content without checking with the origin server.
                • stale-while-revalidate=43200: After 24hrs, if a request is made, the CDN serves the stale content and fetches a new version from the server in the background. This background fetch happens within 24 hours, ensuring minimal disruption.

                For #2, there a blog article written here about it, Serving New Client Library CSS and JS After Release on AEM as a Cloud Service (AEMaaCS), 

                  Terms & ConditionsAccessibility statement

                  Loading footer...