Créer un profil personnalisé

Dans cette partie, nous allons créer une profil personnalisé. Un profil est responsable du rendu du XDP en tant que HTML. Un profil par défaut est fourni prêt à l’emploi pour le rendu des XDP en tant que HTML. Il représente une version personnalisée du service de rendu Forms Mobile. Vous pouvez utiliser le service de rendu de formulaire Mobile pour personnaliser l’apparence, le comportement et les interactions de Mobile Forms. Dans notre profil personnalisé, nous allons capturer les données renseignées dans le formulaire mobile à l’aide de l’API guidebridge. Ces données sont ensuite envoyées au servlet personnalisé qui génère ensuite un PDF interactif et le diffuse à nouveau vers l’application appelante.

Obtention des données de formulaire à l’aide du formBridge API JavaScript. Nous utilisons les getDataXML() method :

window.formBridge.getDataXML({success:suc,error:err});

Dans la méthode du gestionnaire de succès, nous effectuons un appel au servlet personnalisé qui s’exécute dans AEM. Ce servlet affiche et renvoie un pdf interactif avec les données du formulaire mobile.

var suc = function(obj) {
    let xhr = new XMLHttpRequest();
    var data = obj.data;
    console.log("The data: " + data);
    xhr.open('POST','/bin/generateinteractivepdf');
    xhr.responseType = 'blob';
    let formData = new FormData();
    formData.append("formData", data);
    formData.append("xdpPath", window.location.pathname);
    xhr.send(formData);
    xhr.onload = function(e) {

        console.log("The data is ready");
        if (this.status == 200) {
            var blob = new Blob([this.response],{type:'image/pdf'});
                let a = document.createElement("a");
                a.style = "display:none";
                document.body.appendChild(a);
                let url = window.URL.createObjectURL(blob);
                a.href = url;
                a.download = "schengenvisaform.pdf";
                a.click();
                window.URL.revokeObjectURL(url);
        }
    }
}

Générer un PDF interactif

Voici le code de servlet responsable du rendu du pdf interactif et du renvoi du pdf à l’application appelante. Le servlet appelle mobileFormToInteractivePdf du service OSGi Document Services personnalisé.

import java.io.File;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.io.PrintWriter;

import javax.servlet.Servlet;

import org.apache.sling.api.SlingHttpServletRequest;
import org.apache.sling.api.SlingHttpServletResponse;
import org.apache.sling.api.servlets.SlingAllMethodsServlet;

import org.osgi.service.component.annotations.Component;
import org.osgi.service.component.annotations.Reference;

import com.adobe.aemfd.docmanager.Document;
import com.aemformssamples.documentservices.core.DocumentServices;

@Component(
  service = { Servlet.class },
  property = {
    "sling.servlet.methods=post",
    "sling.servlet.paths=/bin/generateinteractivepdf"
  }
)
public class GenerateInteractivePDF extends SlingAllMethodsServlet {
    @Reference
    DocumentServices documentServices;

    protected void doGet(SlingHttpServletRequest request, SlingHttpServletResponse response) {
       doPost(request, response);
    }

    protected void doPost(SlingHttpServletRequest request, SlingHttpServletResponse response) {
      String dataXml = request.getParameter("formData");
      org.w3c.dom.Document xmlDataDoc = documentServices.w3cDocumentFromStrng(dataXml);
      Document xmlDocument = documentServices.orgw3cDocumentToAEMFDDocument(xmlDataDoc);
      Document generatedPDF = documentServices.mobileFormToInteractivePdf(xmlDocument,request.getParameter("xdpPath"));
      try {
          InputStream fileInputStream = generatedPDF.getInputStream();
          response.setContentType("application/pdf");
          response.addHeader("Content-Disposition", "attachment; filename=AemFormsRocks.pdf");
          response.setContentLength((int) fileInputStream.available());
          OutputStream responseOutputStream = response.getOutputStream();
          int bytes;
          while ((bytes = fileInputStream.read()) != -1) {
              responseOutputStream.write(bytes);
          }
          responseOutputStream.flush();
          responseOutputStream.close();
      } catch (IOException e) {
        // TODO Add proper error logging
      }
    }
}

Render Interactive PDF

Le code suivant utilise la variable API Forms Service pour rendre le PDF interactif avec les données du formulaire mobile.

public Document mobileFormToInteractivePdf(Document xmlData,String path) {
    // In mobile form to interactive pdf

    String uri = "crx:///content/dam/formsanddocuments";
    String xdpName = path.substring(31,path.lastIndexOf("/jcr:content"));
    PDFFormRenderOptions renderOptions = new PDFFormRenderOptions();
    renderOptions.setAcrobatVersion(AcrobatVersion.Acrobat_11);
    renderOptions.setContentRoot(uri);
    Document interactivePDF = null;

    try {
        interactivePDF = formsService.renderPDFForm(xdpName, xmlData, renderOptions);
    } catch (FormsServiceException e) {
        // TODO Add proper error logging
    }

    return interactivePDF;
}

Pour afficher la possibilité de télécharger un PDF interactif à partir d’un formulaire mobile partiellement rempli, cliquez ici.
Une fois le PDF téléchargé, l’étape suivante consiste à envoyer le PDF pour déclencher un workflow d’AEM. Ce workflow fusionnera les données du PDF envoyé et génèrera un PDF non interactif à des fins de révision.

Le profil personnalisé créé pour ce cas d’utilisation est disponible dans le cadre de ces ressources de tutoriel.

Sur cette page