How can I habilitate Web-Optimized Image Delivery on my custom component? | Community
Skip to main content
A
Aaron_Dempwolff
Level 4
August 9, 2023
Solved

How can I habilitate Web-Optimized Image Delivery on my custom component?

  • August 9, 2023
  • 1 reply
  • 1477 views

Hello, I want to habilitate the option Web-Optimized Image Delivery on my custom component, the idea is that the user can upload an asset on the authoring configuration of the component (cq:dialog) and then convert the file on Webp Format, I was following the documentation of:

https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/web-optimized-image-delivery.html?lang=en

 

And


https://experienceleague.adobe.com/docs/experience-manager-learn/cloud-service/developing/advanced/web-optimized-image-delivery-java-apis.html

 

But it doesn't work, I don't know if I need to make a step with other settings or if I made wrong a step, this is my Java Model of the component that I want to implement Web-Optimized Image Delivery, the property that have the asset is "fileReference":

package com.tfs.core.models;

import javax.annotation.PostConstruct;

import org.apache.commons.lang3.StringUtils;
import org.apache.sling.api.SlingHttpServletRequest;
import org.apache.sling.api.resource.Resource;
import org.apache.sling.models.annotations.Default;
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.models.annotations.injectorspecific.ValueMapValue;

import com.adobe.cq.export.json.ExporterConstants;
 
@Model(adaptables = { Resource.class,
        SlingHttpServletRequest.class }, adapters = MosaicModel.class, resourceType = MosaicModel.RESOURCE_TYPE_MOSAIC, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
@Exporter(name = ExporterConstants.SLING_MODEL_EXPORTER_NAME, extensions = ExporterConstants.SLING_MODEL_EXTENSION)
public class MosaicModel {
 
    public static final String RESOURCE_TYPE_MOSAIC = "tfs/components/mosaic";

    @ValueMapValue(name = "title")
    @Default(values = StringUtils.EMPTY)
    private String title;

    @ValueMapValue(name = "subTitle")
    @Default(values = StringUtils.EMPTY)
    private String subTitle;

    @ValueMapValue(name = "fileReference")
    @Default(values = StringUtils.EMPTY)
    private String fileReference;

    @PostConstruct
    protected void init() {

    }

    public String getTitle() {
        return title;
    }

    public String getSubTitle() {
        return subTitle;
    }

    public String getFileReference() {
        return fileReference;
    }

}
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 Mahedi_Sabuj

HI @aaron_dempwolff,

You need to implement AssetDelivery.getDeliveryURL in your Sling Model. Check ExampleWebOptimizedImagesImpl from here: Web-optimized image delivery Java™ APIs.

The AssetDelivery OSGi Service is only satisfied when running in AEM as a Cloud Service. On AEM SDK, references to the AssetDelivery OSGi service return null.

Here is the Sample Code:

public class MosaicModel { @Reference(cardinality = ReferenceCardinality.OPTIONAL) private volatile AssetDelivery assetDelivery; @Self @Required private SlingHttpServletRequest request; private String getWebOptimizedUrl( ResourceResolver resourceResolver, String path, Map<String, Object> options) { Resource resource = resourceResolver.getResource(path); Asset asset = DamUtil.resolveToAsset(resource); // These 3 options are required for the AssetDelivery API to work // Else it will return null options.put("path", asset.getPath()); options.put("format", options.get("format")); options.put("seoname", options.get("seoname")); return assetDelivery.getDeliveryURL(resource, options); } public String getFileReference() { // Set the AssetDelivery options to request a web-optimized rendition. // These options can be set as required by the implementation // (Dialog, pass in from HTL via @RequestAttribute) final Map<String, Object> options = new HashMap<>(); options.put("format", "webp"); options.put("preferwebp", "true"); options.put("width", "350"); options.put("height", "350"); return getWebOptimizedUrl( request.getResourceResolver(), fileReference, options); } }

 

1 reply

Mahedi_Sabuj
Community Advisor
Mahedi_SabujCommunity AdvisorAccepted solution
Community Advisor
August 10, 2023

HI @aaron_dempwolff,

You need to implement AssetDelivery.getDeliveryURL in your Sling Model. Check ExampleWebOptimizedImagesImpl from here: Web-optimized image delivery Java™ APIs.

The AssetDelivery OSGi Service is only satisfied when running in AEM as a Cloud Service. On AEM SDK, references to the AssetDelivery OSGi service return null.

Here is the Sample Code:

public class MosaicModel { @Reference(cardinality = ReferenceCardinality.OPTIONAL) private volatile AssetDelivery assetDelivery; @Self @Required private SlingHttpServletRequest request; private String getWebOptimizedUrl( ResourceResolver resourceResolver, String path, Map<String, Object> options) { Resource resource = resourceResolver.getResource(path); Asset asset = DamUtil.resolveToAsset(resource); // These 3 options are required for the AssetDelivery API to work // Else it will return null options.put("path", asset.getPath()); options.put("format", options.get("format")); options.put("seoname", options.get("seoname")); return assetDelivery.getDeliveryURL(resource, options); } public String getFileReference() { // Set the AssetDelivery options to request a web-optimized rendition. // These options can be set as required by the implementation // (Dialog, pass in from HTL via @RequestAttribute) final Map<String, Object> options = new HashMap<>(); options.put("format", "webp"); options.put("preferwebp", "true"); options.put("width", "350"); options.put("height", "350"); return getWebOptimizedUrl( request.getResourceResolver(), fileReference, options); } }

 

Mahedi Sabuj
A
Aaron_DempwolffAuthor
Level 4
August 10, 2023

Thank you very much, I will try to integrate the API to my Java class, I have only one question, one of the errors I had is with the library:

com.adobe.cq.wcm.spi.AssetDelivery

I couldn't find it, all the other libraries if it finds them but this one in specific not, I am using the version of AEM 6.5.

What can cause that it doesn't find the library, does it have to do with that I have to modify the path of the library in another way or do I have to install something else?

 

Mahedi_Sabuj
Community Advisor
Mahedi_SabujCommunity Advisor
Community Advisor
August 10, 2023

Import is functioning correctly when using Uber-Jar version 6.5.15. However, when employing Uber-Jar version 6.5.0, there is an issue with the "cannot be resolved" error. You may want to consider resolving this by updating your Uber-Jar version.

While the AssetDelivery import works in AEM 6.5.15, it's important to note that this functionality is available exclusively for AEM as a Cloud Service (AEMaaCS).

Mahedi Sabuj
Terms & ConditionsAccessibility statement

Loading footer...