Question

如Adobe页面https://helpx.adobe.com/experience-manager/6-3/assets/using/asset-selector.html所述，AEM提供了OOTB资产选择器，它包含比标准Coral3 pathfield或pathbrowser更大的图像预览。

在上面的页面中还说，您可以使用花岗岩对话框中的选择器：

http://localhost:4502/aem/assetpicker.html?dialog=true-使用这些参数以Granite对话框形式打开资产选择器。仅当您通过“花岗岩路径字段”启动资产选择器并将其配置为pickerSrc URL时，此选项才适用。

我在对话框XML中尝试了以下代码：

<image
    jcr:primaryType="nt:unstructured"
    sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
    name="./image/fileReference"
    pickerSrc="/aem/assetpicker.html?dialog=true"
    predicate="nosystem"
    rootPath="/content/dam/"/>

上面的pathfield似乎没有使用pickerSrc指定的替代选择器，其行为类似于标准的pathfield。

还尝试添加pathfield docs中指定的额外URL参数，但没有任何改变。

是否有任何有关对话框定义错误的指针？

Answer 1

URL /aem/assetpicker.html是一个虚荣路径，您可以使用绝对URL /libs/dam/gui/content/assetselector/jcr:content/body/items/assetselector.html，但这不能正常工作。

您可以尝试将商务/gui/components/common/assetpicker与一些其他clientLib配合使用，如下所述。

<assetpicker
   jcr:primaryType="nt:unstructured"
   jcr:title="Thumbnail"
   sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
   <items jcr:primaryType="nt:unstructured">
      <column
         jcr:primaryType="nt:unstructured"
         sling:resourceType="granite/ui/components/coral/foundation/container">
         <items jcr:primaryType="nt:unstructured">
            <section
               jcr:primaryType="nt:unstructured"
               sling:resourceType="/libs/granite/ui/components/coral/foundation/form/fieldset">
               <items jcr:primaryType="nt:unstructured">
                  <thumbnail
                     jcr:primaryType="nt:unstructured"
                     sling:resourceType="cq/gui/components/coral/common/wcm/pagethumbnail"
                     page="${empty param.item ? requestPathInfo.suffix : param.item}"/>
                  <edit
                     jcr:primaryType="nt:unstructured"
                     sling:resourceType="commerce/gui/components/common/assetpicker"
                     name="./image/fileReference"
                     previewTarget=".foundation-layout-thumbnail-image coral-card-asset img"
                     text="Change"
                     type="image"/>
                  <charset
                     jcr:primaryType="nt:unstructured"
                     sling:resourceType="granite/ui/components/coral/foundation/form/hidden"
                     ignoreData="{Boolean}true"
                     name="_charset_"
                     value="utf-8"/>
               </items>
            </section>
         </items>
      </column>
   </items>
</assetpicker>

以及对话框节点中的extraClientLibs属性（多），如下所示

extraClientlibs="[cq.common.wcm,core.wcm.page.properties,cq.wcm.msm.properties,cq.authoring.editor.plugin.commerce]"

Answer 2

显然，一种选择是使用commerce/gui/components/common/assetpicker，这需要一些额外的 NON 核心clientlib，例如，包含在对话中：

    <extraClientLibs
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/includeclientlibs"
        categories="[commerce.gui.admin,cq.common.wcm,core.wcm.page.properties,cq.wcm.msm.properties]"/>

如何在coral3对话框中使用AEM资产选择器？

2 个答案: