OneSpan Sign How To: Erstellen einer einfachen Java-Webanwendung

Haris Haidary, 27. April 2016

Die JavaServer Pages (JSP) -Technologie ist eine Skriptsprache für Webseiten, mit der dynamische Webinhalte erstellt werden. Servlets hingegen sind bereits kompilierte Java-Programme, die auch dynamische Webinhalte erstellen. Einfacher ausgedrückt ist JSP die Aufnahme von Java-Code in HTML-Tags, während Servlets das Gegenteil sind. In diesem Blog werde ich Ihnen zeigen, wie Sie mit JSP eine einfache Java-Webanwendung erstellen, in der Ihr Benutzer ein Formular ausfüllen und anschließend mit OneSpan Sign einen Beispielvertrag unterzeichnen muss.

Bedarf

Sie müssen Ihre Umgebung einrichten, um Ihre Java-Webanwendung zu erstellen. Für diesen Blog benötigen Sie Folgendes: Java SDK von OneSpan Sign, Eclipse IDE für Java EE-Entwickler und Apache Tomcat 7.

Herunterladen des Java SDK

Über den folgenden Link gelangen Sie zu einer Seite, auf der Sie das Java SDK herunterladen können. Außerdem finden Sie einen Link zu einigen Beispielen für die Verwendung des Java SDK auf GitHub. Entpacken Sie das SDK an den Speicherort Ihrer Wahl.

Laden Sie das Java SDK herunter

Herunterladen von Eclipse IDE für Java EE-Entwickler

Für diesen Blog werde ich die Eclipse-IDE für Java EE-Entwickler verwenden. Wenn Sie es noch nicht haben, können Sie die Community-Version kostenlos unter dem folgenden Link herunterladen. Sie können jede andere IDE verwenden, aber alles, was in diesem Blog behandelt wird, verwendet die Eclipse-IDE für Java EE-Entwickler.

Laden Sie die Eclipse IDE herunter

Laden Sie Apache Tomcat 7 herunter Zuletzt müssen Sie Apache Tomcat 7 herunterladen. Apache Tomcat ist ein Open-Source-Anwendungsserver, der Java-Servlets ausführt und Webseiten mit JSP-Codierung rendert. Sie müssen die Zip-Datei herunterladen und ihren Inhalt an einen Ort Ihrer Wahl extrahieren.

 

Kater

Laden Sie Apache Tomcat 7 herunter

OneSpan Sign-Entwickler-Community

OneSpan Sign-Entwickler-Community

Treten Sie der OneSpan Sign Developer Community bei! Foren, Blogs, Dokumentationen, SDK-Downloads und mehr.

Tritt heute bei

Installieren Sie Apache Tomcat in der Eclipse-Entwicklungsumgebung

Bevor wir in den Code eintauchen, müssen wir Apache Tomcat erfolgreich in Eclipse konfigurieren. Öffnen Sie Eclipse. Klicken Sie in Ihrem Ansichtsfenster auf "Es sind keine Server verfügbar. Klicken Sie auf diesen Link, um einen neuen Server zu erstellen ... ".

Server

Wenn Sie die Registerkarte Server nicht sehen können, wählen Sie im Menü Fenster> Ansicht anzeigen und klicken Sie auf "Andere ...". Wählen Sie im Fenster "Ansicht anzeigen" unter "Server" die Option "Server" und klicken Sie auf "OK".

Wählen Sie im Fenster "Neuer Server" die Option "Tomcat v7.0 Server" und klicken Sie auf "Weiter". Wählen Sie dann "Durchsuchen ..." und navigieren Sie zu dem Verzeichnis, in das Sie Apache Tomcat entpackt haben, und klicken Sie auf "Fertig stellen".

new_server

new_server2

Auf der Registerkarte Server sollte Folgendes angezeigt werden: 

Server2

Erstellen Ihrer Java-Webanwendung

Wir können jetzt mit der Erstellung unserer einfachen Java-Webanwendung beginnen. Wählen Sie im Menü Datei> Neu und klicken Sie auf "Projekt ...". Wählen Sie "Dynamisches Webprojekt" im Ordner "Web" und klicken Sie auf "Weiter".

Projekt

Geben Sie Ihrem Projekt einen Namen. Zum Beispiel "JSPTutorial". Stellen Sie außerdem sicher, dass die "Ziellaufzeit" tatsächlich Apache Tomcat 7.0 ist. Klicken Sie zweimal auf "Weiter" und wählen Sie im Fenster "Webmodul" die Option "Web.xml-Bereitstellungsdeskriptor generieren" und klicken Sie auf "Fertig stellen".

project2

Java-Webanwendungen verwenden eine Deployment-Deskriptordatei, um zu bestimmen, wie URLs Servlets zugeordnet werden. Sie finden die Datei web.xml im Ordner "WEB-INF". Wenn Sie Ihre Datei web.xml öffnen, wird eine "Welcome-File-Liste" angezeigt. Eine Begrüßungsdatei ist die Datei, die vom Server automatisch aufgerufen wird, wenn Sie keinen Dateinamen angeben. Standardmäßig sucht der Server in der folgenden Reihenfolge nach der Begrüßungsdatei:

  1. Begrüßungsdatei-Liste in web.xml
  2. index.html
  3. index.htm
  4. index.jsp

Wenn keine dieser Dateien gefunden wird, gibt der Server einen 404-Fehler aus.

webxml

Nachdem unser Projekt erstellt wurde, erstellen wir unsere erste JSP-Datei. Klicken Sie im "Projektexplorer" mit der rechten Maustaste auf den Ordner "WebContent" und wählen Sie "Neu"> "JSP-Datei". Nennen Sie Ihre JSP-Datei "index.jsp" und klicken Sie auf "Fertig stellen".

jsp

Kopieren Sie den folgenden Code in Ihre index.jsp-Datei.

<% @ page language = "java" contentType = "text / html; Zeichensatz = ISO-8859-1"
  pageEncoding = "ISO-8859-1"%>
< !DOCTYPE html>

 

 

 


 

 

 

Bitte füllen Sie das folgende Formular aus:

 

 

   

Mit dem obigen HTML-Code wird Ihr Formular erstellt, in dem der Benutzer seine Informationen ausfüllen muss. Wenn Sie auf die Schaltfläche "Senden" klicken, wird der Benutzer zur Seite "ESLCreation.jsp" weitergeleitet. 

Da Sie diese Seite noch nicht in Ihrem Projekt haben, erstellen Sie eine neue Datei "ESLCreation.jsp" in Ihrem Ordner "WebContent" und kopieren Sie den folgenden Code.

 

 

"Inhaltstyp" Inhalt = "text / html; Zeichensatz = ISO-8859-1" >

 

 

  

Danke zum Füllen Sie das Formular aus! Bitte unterschreiben Sie das folgende Dokument:

 

  <%

     Zeichenfolge firstName = request.getParameter ( "Vorname" );

     Zeichenfolge lastName = request.getParameter ( "Familienname, Nachname" );

     Zeichenfolge emailAddress = request.getParameter ( "E-Mail-Addresse" );

     String company = request.getParameter ( "Unternehmen" );

     String address = request.getParameter ( "Adresse" );

     Zeichenfolge city = request.getParameter ( "Stadt" );

     String state = request.getParameter ( "Zustand" );

     String zip = request.getParameter ( "Postleitzahl" );

     Zeichenfolge country = request.getParameter ( "Land" );

     Zeichenfolge phoneNumber = request.getParameter ( "Telefonnummer" );

     String policyNumber = request.getParameter ( "Versicherungsnummer" );

     

    Zeichenfolge packageId = ESLPackageCreation.createPackage (Vorname, Nachname, E-Mail-Adresse, Firma, Adresse, Stadt, Bundesland, Postleitzahl, Land, Telefonnummer, Richtliniennummer);

    

    String sessionToken = ESLPackageCreation.createSessionToken (packageId);

  %>

   

      

 

 

<% @ Seite importieren = "com.esl.example.ESLPackageCreation" %>

 

Die erste Zeile gibt eine Liste von Paketen oder Klassen an, die in der JSP verwendet werden sollen, wie dies die Java-Importanweisung für Java-Klassen tut. Es wird normalerweise nicht empfohlen, Ihre gesamte Logik in Ihre JSP-Seite einzufügen. Dazu später mehr.

<%><%=sessiontoken%> importieren = "com.esl.example.ESLPackageCreation" %>

Die Methoden request.getParameter () extrahieren die durch das Posten gesendeten Daten aus einem HTML-Formular. Diese Methode gibt immer einen String-Wert zurück.

Zeichenfolge firstName = request.getParameter ( "Vorname" );

Die Methoden createPackage () und createSessionToken () stammen aus der Klasse "ESLPackageCreation", die wir später erstellen werden. Die erste Methode erstellt Ihr Paket anhand der Informationen aus dem HTML-Formular und die zweite Methode erstellt das Sitzungstoken, das zum Erstellen der URL für die Signaturzeremonie zum Einbetten in einen Iframe erforderlich ist. Beachten Sie, dass sich der gesamte Java-Code auf einer JSP-Seite zwischen "<%" -tags="" befindet.=""><%><%=sessiontoken%>

Zeichenfolge packageId = ESLPackageCreation.createPackage (Vorname, Nachname, E-Mail-Adresse, Firma, Adresse, Stadt, Bundesland, Postleitzahl, Land, Telefonnummer, Richtliniennummer);

    

String sessionToken = ESLPackageCreation.createSessionToken (packageId);

Als Nächstes müssen Sie auf das OneSpan Sign Java SDK verweisen. Navigieren Sie zu dem Speicherort, an dem Sie das Java SDK entpackt haben, und kopieren Sie die JAR-Dateien. Klicken Sie dann in Ihrem „Projektexplorer“ mit der rechten Maustaste auf Ihren Ordner „lib“ unter WebContent> WEB-INF und wählen Sie „Einfügen“.

Jetzt erstellen wir unsere Klasse "ESLPackageCreation". Klicken Sie in Ihrem „Projektexplorer“ mit der rechten Maustaste unter „Java-Ressourcen“ auf „src“ und wählen Sie „Neu“> „Paket“. Nennen Sie Ihr Paket "com.esl.example" und klicken Sie auf "Fertig stellen".

jsp

Erstellen Sie in Ihrem Paket eine neue Java-Klasse mit dem Namen "ESLPackageCreation". Kopieren Sie den folgenden Code:

Öffentlichkeit Klasse ESLPackageCreation {

     

     Privat statisch Zeichenfolge CUSTOM_ID = "Unterzeichner" ;;

     Privat statisch String API_KEY = "your_api key_here" ;;

         Privat statisch String BASE_URL = "" https://sandbox.e-signlive.com/api "" ;;

 

     Öffentlichkeit statisch String createPackage (String firstName, String lastName, String emailAddress, String company, String address, String city, String state, String zip, String country, String phoneNumber, String policyNumber) wirft FileNotFoundException {

 

         EslClient client = Neu EslClient (API_KEY, BASE_URL);

 

         InputStream fs = Neu FileInputStream ( "DOC_FILE_PATH" );

 

        // Das DocumentPackage-Objekt erstellen

         DocumentPackage documentPackage = PackageBuilder.newPackageNamed ( "Java Form Package" + DateTime.now ())

 

                // Paketeinstellungen anpassen

                .withSettings (DocumentPackageSettingsBuilder.newDocumentPackageSettings (). withDecline (). withOptOut ()

                        .withDocumentToolbarDownloadButton ()

 

                        // Passen Sie die Einstellungen für die Unterzeichnungszeremonie an

                        .withCeremonyLayoutSettings (CeremonyLayoutSettingsBuilder.newCeremonyLayoutSettings ()

                                .withoutGlobalNavigation (). withoutBreadCrumbs (). withoutSessionBar (). withTitle ()))

 

                // Definieren Sie den versicherten Vor- und Nachnamen

                .withSigner (SignerBuilder.newSignerWithEmail (emailAddress) .withCustomId (CUSTOM_ID)

                        .withFirstName (Vorname) .withLastName (Nachname) .withCompany (Firma))

 

                // Absender definieren

                 .withSigner (SignerBuilder.newSignerWithEmail ( "signer.1 @example .com " ) .withCustomId ( "Absender" )

                         .withFirstName ( "Haris" ) .withLastName ( "Haidary" ) .withTitle ( "Technischer Evangelist" )

                         .mit Unternehmen( "eSignLive" ))

 

                // Dokument definieren

                 .withDocument (DocumentBuilder.newDocumentWithName ( "Bilden" ) .fromStream (fs, DocumentType.PDF)

                        .enableExtraction ()

                         .withInjectedField (FieldBuilder.textField (). withName ( "Vorname" ) .withValue (Vorname))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Familienname, Nachname" ) .withValue (lastName))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Adresse" ) .withValue (Adresse))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Stadt" ) .mitWert (Stadt))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Zustand" ) .withValue (state))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Postleitzahl" ) .mitWert (Reißverschluss))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Land" ) .mitWert (Land))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Telefonnummer" ) .withValue (phoneNumber))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Unternehmen" ) .mit Wert (Firma))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Email" ) .withValue (emailAddress))

                         .withInjectedField (FieldBuilder.textField (). withName ( "Versicherungsnummer" ) .withValue (policyNumber))

 

                ).bauen();

 

        // Die Anforderung an den e-SignLive-Server senden, um die zu erstellen

        // DocumentPackage

        PackageId packageId = client.createPackage (documentPackage);

        client.sendPackage (packageId);

 

         Rückkehr packageId.toString ();

    }

 

     Öffentlichkeit statisch String createSessionToken (String packageId) {

         EslClient client = Neu EslClient (API_KEY, BASE_URL);

 

        SessionToken sessionToken = client.getSessionService (). CreateSessionToken (packageId, CUSTOM_ID);

        //System.out.println("Sessionstoken: "+ sessionToken.getSessionToken ());

 

         Rückkehr sessionToken.getSessionToken ();

    }

}

Stellen Sie sicher, dass Sie die Platzhalter für API-Schlüssel und Dokumentdateipfad durch Ihre eigenen Werte ersetzen.

Ausführen Ihres Projekts

Sie können jetzt Ihre Java-Webanwendung ausführen. Klicken Sie im "Projektexplorer" mit der rechten Maustaste auf Ihr Projekt und wählen Sie Ausführen als> Auf Server ausführen. Klicken Sie dann auf "Fertig stellen".

runonserver

Als Nächstes sollten Sie Ihr Formular in Eclipse sehen können. Füllen Sie einige Beispielinformationen aus und klicken Sie auf "Senden".

Formular

Schließlich sollten Sie auf die folgende Seite weitergeleitet werden, auf der die Unterzeichnungszeremonie in einen Iframe eingebettet ist und das Dokument zur Unterzeichnung bereit ist.

Zeichen

Das vollständige Projekt finden Sie im Abschnitt "Entwickler-Community-Code-Freigabe". Hier .

Wenn Sie Fragen zu diesem Blog oder zu anderen Themen bezüglich der Integration von OneSpan Sign in Ihre Anwendung haben, besuchen Sie die Entwickler-Community-Foren: https://community.onespan.com . Das war's von mir. Danke fürs Lesen! Wenn Sie diesen Beitrag hilfreich fanden, teilen Sie ihn bitte auf Facebook, Twitter oder LinkedIn. Sie finden alle meine vorherigen Blogs unter Autorenseite .

Haris Haidary
Junior Technical Evangelist
LinkedIn | Twitter