Mit der von blau direkt neu entwickelten JS-API möchte ich heute allen technikaffinen und interessierten Maklerpartnern mit Vorkenntnissen eine weitere Möglichkeit der Vergleichsrechner-Einbindung sowie deren Vorteile vorstellen. Aber immer langsam: Was genau macht diese JS-API eigentlich?
Um diese Frage beantworten zu können, sollten wir mit dem Problem – oder viel mehr der Herausforderung – beginnen. Traditionell werden in der Web-Entwicklung Inhalte Dritter per iFrame in die eigene Website eingebunden. Die einfache iFrame-Einbindung hat allerdings einige Einschränkungen technischer Natur, welche durch die Arbeitsweisen der Browser oder auch einfach nur durch die grundliegende Architektur der Internet-Protokolle vorgegeben werden. Hierzu zählt auch, dass die Größe von iFrames nicht mit der Größe der eingebundenen Website „mitwachsen“ kann. Warum das so ist, erklärt der leitende Entwickler der JS-API, Philip Wassermann, wie folgt:
Die Größe eines iFrames lässt sich nur über die „Mutterseite“ ändern, indem mittels JavaScript die Größe des iFrame-Inhaltes berechnet wird und anschliessend das JavaScript im iFrame entsprechende DOM-Manipulationen an der „Mutterseite“ vornimmt oder auch JavaScript direkt auf der „Mutterseite“ ausführt.
Ein Browser führt JavaScript immer in einer sogenannten „Sandbox“ aus, in welcher einerseits nur für Web-Applikationen relevante Befehle zugelassen werden (so ist z.B. das Löschen und Erstellen von Dateien verboten) und andererseits die „same origin policy“ geprüft wird.
Die „same origin policy“ ist dafür zuständig, dass JavaScript nur JavaScript der eigenen Seite ausführen darf (entsprechend für DOM-Manipulationen).
Geprüft wird hierbei ob:
- die Protokolle identisch sind (http://www.blaudirekt.de darf nicht auf https://www.blaudirekt.de zugreifen) und
- ob die FQDN’s (FQDN: der gesamte Domainname inkl. Subdomain(s)) identisch sind (https://blaudirekt.de darf nicht auf https://www.blaudirekt.de zugreifen)
Philip Wassermann
Sofern Sie der technischen Ausführung nicht bis ins Detail folgen konnten, ist dies nicht weiter dramatisch. Merken Sie sich einfach die Kernaussage: iFrames können bei der „normalen“ Einbindung aus Sicherheitsgründen nicht „mitwachsen“.
Dies stellt besonders die Maklerpartner vor eine Herausforderung, die unsere Vergleichsrechner per iFrame auf Ihrer Website einbinden möchten aber natürlich die Höhe der Vergleichsrechner nicht kennen. Diese setzen die Höhe dann oftmals auf 1.000 Pixel, was aber folgende Nachteile hat:
- Der Besucher der Website sieht stets einen scheinbar riesigen, weißen Bereich zwischen Vergleichsrechner und Footer.
- Die Websites werden unnötig hoch.
- Der Content unter den Vergleichsrechnern wird nicht mehr wahrgenommen.
- Die „Spring-Funktion“ der Vergleichsrechner wird gestört.
- Visuelle Dialoge werden in der Mitte des iFrames angezeigt und sind daher oft im aktuell nicht sichtbarem Bereich.
Unser AJAX-Tunnel bietet zwar für alle oben genannten Herausforderungen eine Lösung, bringt aber auch einige Nachteile mit sich. So ist die Implementation des Tunnels bspw. vergleichsweise schwierig und für Laien ohne fremde Hilfe oft nicht zu bewältigen. Zudem läuft die gesamte Kommunikation zwischen Client und unserem Server über den Server des Maklers. Da Anfrage als auch Antwort einen zusätzlichen „Hop“ machen müssen, wird der Vergleichsrechner natürlich (minimal) langsamer. Aber der Makler bekommt noch ein anderes Problem: Die SSL-Verschlüsselung. Diese können wir nur zwischen dem Server des Maklers und unserem Server sicherstellen, nicht aber zwischen dem Client und dem Server des Maklers. Daher kommt der Makler um ein eigenes SSL-Zertifikat für seine Domain nicht herum, welches natürlich mit weiteren Kosten verbunden ist.
Genau in diese Kerbe schlägt die JS-API. Diese bindet unsere Vergleichsrechner technisch per iFrame ein (wodurch wir wieder die durchgängige SSL-Verschlüsselung sicherstellen können), setzt für die Implementation lediglich HTML-Kenntnisse voraus und kann – neben ein paar anderen, sehr interessanten Features – die Höhe des iFrames „mitwachsen“ lassen. Aber Moment! Warum geht das auf einmal?
Für die JS-API nutzen wir eine relativ neue Technik, welche mittlerweile von alle gängigen Browsern (Internet Explorer ab Version 8) unterstützt wird. Diese erlaubt es uns, Textnachrichten zwischen den iFrames auszutauschen, da hierbei weder Script ausgeführt noch DOM-Manipulationen vorgenommen werden. Daher ist diese Vorgehensweise Sicherheitstechnisch nicht relevant.
Auch muss jede Nachricht definiert sein: Das Empfangende JavaScript auf der „Mutterseite“ muss mit dem JavaScript des iFrames „zusammenspielen“, damit klar ist, dass bspw. die soeben empfangene Nachtricht die neue Größe des iFrames beinhaltet.Philip Wassermann
Übrigens: Sowohl Google als auch Facebook arbeiten mit einer ähnlichen JS-API zur Einbindung des Google+1-Buttons, des Like-Buttons oder auch der Facebook-Kommentare.
Pricing
Die Konditionen der JS-API sind trotz verbesserter Engine mit denen des AJAX-Tunnels identisch. Unsere AGB & Verträge (sowie der Softwarebestellschein der JS-API) können auf Pooltektor unter AGB & Verträge eingesehen werden.
Weiterführende Blog-Artikel:
- JS-API – Technische Implementation
- JS-API – Tricks für Fortgeschrittene
- JS-API – Catcher
- JS-API – Kunden-Login
Moin Moin, habt Ihr Euch mittlerweile Gedanken um die finale Preisstruktur gemacht ?
Gibt es Vorteile für X-P oder/und Premiumhomepagenutzer ?
Ist sichergestellt dass der API Code nicht geändert werden muss, wenn Ihr Weiterentwicklungen plant ?
Hallo Hannes ; Hallo Philip,
bin schon auf die Technische Implementation und Tricks für Fortgeschrittene gespannt.
gerne auch vor ab per Email 🙂
Mal schauen ob ich zu den „technikaffinen und interessierten Maklerpartnern mit Vorkenntnissen“ gehöre.
VG Lutz
https://www.facebook.com/onlinemakler
Hallo Jürgen,
danke für den Hinweis. Das Pricing hatte ich vergessen, habe aber soeben einen entsprechenden Absatz ergänzt 🙂
Preisliche Vorteile für Kunden des Website-Managements sind nicht geplant, da wir uns in diesem Fall ja um die technische Implementation der Vergleichsrechner kümmern und der Makler daher keine eigene JS-API mehr benötigen wird. Preisliche Vorteile für X-Partner sind ebenso nicht geplant – gab es beim AJAX-Tunnel ja auch nicht.
Eine Technik wie die JS-API kann nicht stetig weiterentwickelt werden und trotzdem noch voll abwärtskompatibel funktionieren. Daher streben wir eine ähnliche Versionierung an wie diese auch BiPRO fährt. Grob zusammengefasst: Wer nicht updated, kann die neueren Features nicht nutzen und wird mit inzwischen behobenen Bugs leben müssen. Bei Versionssprüngen werden die alten Versionen aber trotzdem noch eine gewisse Zeit supported – allerdings nicht unbefristet. Details hierfür gibts im Artikel bzgl. der technischen Implementation. Im Grunde werden wir aber die Versionierung so anlegen, wie dies die Mehrheit aller Software-Häuser tut. 🙂
gruss hannes
Kann es sein, daß der oben genannte Austausch mit dem IFRAME per Text-Nachrichten nicht mehr funktioniert? Seit neuesten werden die Vergleichsrechenr jedenfalls mti der Framehöhe 0 dargestellt und sind somit nicht mehr sichtbar.