AEM组件对话框从资产拖拽文件时sizeLimit不生效问题咨询

默认的sizeLimit属性只对直接上传本地文件的场景生效，从资产库拖拽文件本质是选择已有资产并创建引用，组件不会自动校验已有资产的文件大小，所以这个属性在拖拽场景下不起作用。要实现拖拽时的大小限制，需要额外做前端或后端的校验，以下是具体方案：

前端校验（提升作者操作体验） #

通过监听拖拽事件，获取选中资产的大小并与限制值对比，超出则阻止操作并提示：

1. 给你的文件上传组件添加data-sizelimit属性，方便JS读取配置的限制值：

<file
    jcr:primaryType="nt:unstructured"
    sling:resourceType="cq/gui/components/authoring/dialog/fileupload"
    sizeLimit="100"
    data-sizelimit="100" <!-- 新增这个属性 -->
    autoStart="{Boolean}false"
    class="cq-droptarget"
    fileNameParameter="./fileName"
    fileReferenceParameter="./fileReference"
    mimeTypes="[image/gif,image/jpeg,image/png,image/webp,image/tiff,image/svg+xml]"
    multiple="{Boolean}false"
    name="./file"
    title="Upload Image Asset"
    uploadUrl="${suffix.path}"
    useHTML5="{Boolean}true"/>

2. 创建自定义ClientLibrary（类型为cq.authoring.dialog），添加以下JS代码：

$(document).on('drop', '.cq-droptarget', function(e) {
    const dropTarget = $(this);
    // 获取拖拽的资产路径
    const assetPaths = e.originalEvent.dataTransfer.getData('text/plain').split(',');
    if (!assetPaths.length) return;

    const sizeLimitKB = parseInt(dropTarget.closest('.cq-fileupload').attr('data-sizelimit'));
    if (!sizeLimitKB) return;

    // 请求资产数据获取文件大小
    $.getJSON(`${assetPaths[0]}.json`, (assetData) => {
        const fileSizeKB = assetData.size / 1024;
        if (fileSizeKB > sizeLimitKB) {
            e.preventDefault();
            e.stopPropagation();
            alert(`文件大小超过限制，最大允许${sizeLimitKB}KB`);
        }
    }).fail(() => {
        console.error('无法获取资产信息');
    });
});

后端校验（确保数据安全，防止绕过前端） #

通过Sling Model或Servlet拦截组件保存请求，校验选中资产的大小，超出则抛出错误：

用Sling Model实现： #

@Model(adaptables = Resource.class, adapters = YourComponentModel.class, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
public class YourComponentModel {

    @ValueMapValue(name = "fileReference")
    private String assetPath;

    @Inject
    private ResourceResolver resourceResolver;

    @PostConstruct
    protected void validateAssetSize() {
        if (StringUtils.isBlank(assetPath)) return;

        Resource assetResource = resourceResolver.getResource(assetPath);
        if (assetResource == null) return;

        ValueMap assetProps = assetResource.getValueMap();
        // 获取资产文件大小（字节）
        long fileSizeBytes = assetProps.get("jcr:content/jcr:data", 0L);
        // 对应配置的100KB限制
        long maxSizeBytes = 100 * 1024;

        if (fileSizeBytes > maxSizeBytes) {
            throw new IllegalStateException("选中的资产大小超过100KB限制");
        }
    }
}

补充说明 #

• 前端校验能在作者操作时即时反馈，提升体验，但存在被绕过的可能；
• 后端校验是最终的安全屏障，确保不符合大小限制的资产不会被保存；
• 建议同时实现前端和后端校验，兼顾体验与安全。

内容的提问来源于stack exchange，提问作者rosudel