Profi-Knowhow: Mit einer Axure/Python-Bridge Grenzen überwinden

infofeld GmbH

Praktiker kennen diese Situation: Um einen möglichst realisitischen Software-Prototypen zu entwickeln müssen oft diverse Geschäftslogiken umgesetzt werden. Dem steht jedoch oft die Axure-Produktphilosophie entgegen, gemäß der Nutzer keine Programmierkenntnisse besitzen müssen. Viele Logiken lassen sich deshalb nur schwer oder gar nicht umsetzen.

Eine Schnittstelle zu Python schafft Abhilfe

Für diejenigen, die Basiskenntnisse in der Programmiersprache Python besitzen, naht nun Hilfe. In diesem Artikel lernen Sie, wie Sie eine Brücke zwischen Axure und Python schlagen können. Während die eigentliche Benutzeroberfläche intuitiv in Axure erstellt wird, können komplexere fachliche Logiken in Python umgesetzt werden. In diesem Beitrag wird exemplarisch ein Beispiel aus der Finanzindustrie umgesetzt: Der Nutzer des Axure-Prototyps gibt ein beliebiges Datum ein. Der eingegebene Wert wird dann an einen in Python geschriebenen Webserver gesendet. Innerhalb des Webservers wird dann geprüft, ob das Datum auf einen deutschen Bankfeiertag fällt, also auf einen Tag, an dem Banken geschlossen haben. Die nachfolgende Abbildung zeigt das Funktionsprinzip.

Der ganze Ablauf unterteilt sich in vier Schritte:

  1. Der Benutzer gibt in einem Eingabefeld ein beliebiges Datum ein.
  2. Der Nutzer klickt auf eine Schaltfläche, um zu prüfen, ob es sich bei dem eingegebenen Datum um einen Bankfeiertag handelt.
  3. Bei Klick sendet der Axure-Prototyp einen HTTP-Request an einen in Python implementierten Web-Server. Der Request enthält das Datum, welches zu prüfen ist.
  4. Der Webserver prüft, ob es sich um einen Bankfeiertag handelt. Falls ja, wird als Response true zurückgesendet, ansonsten false. Dieser Antwortwert wird in der Axure-Variablen OnLoadVariable abgespeichert. Den so gespeicherten Wert können Sie nun verwenden, um Ihren Prototypen zu steuern.

Klingt das kompliziert? Keine Panik. Im Folgenden erkläre ich Ihnen scheibchenweise, wie Sie Axure und Python miteinander verheiraten. Hier können Sie sich schon mal die fertigen Demodateien als ZIP herunterladen: Demodateien.zip

 

Schritt 1: Die Benutzeroberfläche erstellen

Erstellen Sie in Axure ein Eingabefeld und einen Button und benennen Sie diese beiden Widgets so, wie hier abgebildet:

 

Schritt 2: Den Webserver aus Axure aufrufen

Erstellen Sie für den Button, den Sie im vorhergehenden Schritt angelegt haben ein OnClick-Ereignis:

Bitte achten Sie darauf, keine Zeilumbrüche einzufügen. Ansonst wird es nicht funktionieren.  Was macht dieser Text nun? Es handelt sich um Java-Script-Code:
  • Zunächst teilen wir Axure mit, dass es sich um ein Stück Javascript-Code handelt und dass wir einen Webserver über HTTP aufrufen wollen.
  •  Sobald der Webserver geantwortet hat, soll die Antwort in der globalen Variable OnLoadVariable gespeichert werden.
  • Der Webserver läuft lokal (localhost) und wird über Port 3000 auf Anfragen warten. Hier spezifizieren wir, dass ein GET-Aufruf erfolgen soll und dabei das zu prüfende Datum übergeben wird.
  • Der Befehl xhr.send schickt den Request an den Server.

Im ZIP-Anhang (Datei demo.rp) ist Javascript-Code bereits enthalten. Sie müssen den Text also nicht abtippen.

Schritt 3: Den Webserver implementieren

Nun machen wir uns daran, den Webserver zu implementieren. Der Server wir über zwei Python-Files umgesetzt. Das erste File Webserver.py ist der eigentliche Webserver:

#!/usr/bin/env python

from LogicBankfeiertag import LogicBankfeiertag
from http.server import HTTPServer, SimpleHTTPRequestHandler, test as test_orig
from urllib.parse import urlparse


def test (*args):
    test_orig(*args, port=3000)


class CORSRequestHandler (SimpleHTTPRequestHandler):
    def end_headers (self):
        self.send_header('Access-Control-Allow-Origin', '*')
        SimpleHTTPRequestHandler.end_headers(self)


    def do_GET(self):
        print(self.path)
        parsed_path = urlparse(self.path)
        datum = parsed_path[4]

        lb = LogicBankfeiertag()
        result = lb.isDeutscherBankfeiertag( datum )

        f = open('index.html','w')
        f.write(str(result))
        f.close()
        return SimpleHTTPRequestHandler.do_GET(self)


if __name__ == '__main__':
    test(CORSRequestHandler, HTTPServer)

 

Des Pudels Kern ist der Aufruf der Python-Funktion LogicBankfeiertag.isDeutscherBankfeiertag. Das zu prüfende Datum wird der Funktion als Parameter übergeben.

Die eigentliche Geschäftslogik ist in der Datei LogicBankfeiertag.py umgesetzt. Auf den Inhalt dieser Datei gehe ich nicht näher ein, da sie für das Verständins der Axure-Python-Bridge nicht relevant ist. Auch diese Datei finden Sie im Anhang.

Schritt 4: Prüfen, ob alles funktioniert

Starten Sie den Python-Webserver, indem Sie die Datei Webserver.py ausführen. Sofern alles in Ordnung ist, erscheint auf der Konsole folgende Meldung:

Serving HTTP on 0.0.0.0 port 3000 (http://0.0.0.0:3000/) ...

Unser Webserver läuft nun also. Starten Sie nun Ihren Axure-Prototypen und führen Sie im Browserfenster folgende Schritte durch:

  • Öffnen Sie die Konsolenansicht (A).
  • Geben Sie ein beliebiges Datum ein (B).
  • Klicken Sie auf den Button (C).
  • Im Konsolenfenster sehen Sie nun, ob das eingegebene Datum ein Bankfeiertag ist (OnLoadVariabe steht auf True) oder nicht (OnLoadVariabe steht auf False) (D).

 

Geschafft!

Damit sind wir am Ende der Demonstration angelangt. Dieses Mini-Beispiel können Sie nach belieben abändern, um andere Arten von Geschäftslogiken umzusetzen. Natürlich benötigen Sie dafür gewisse Python-Grundkenntnisse. Falls Sie noch Fragen haben, können Sie das Kontakt-Formular auf dieser Website verwenden.