Serverlose Funktion von HubSpot: Erste Schritte
CMS Hub
- Enterprise
Mit serverlosen Funktionen können Sie serverseitigen Code schreiben, der über APIs mit HubSpot und Drittanbieterdiensten interagiert. APIs, für die eine Authentifizierung erforderlich ist, können aus Sicherheitsgründen nicht für das Front-End einer Website genutzt werden – Ihre Anmeldedaten wären zugänglich und die Website damit Angriffen ausgesetzt.
Serverlose Funktionen können eine Mittlerfunktion zwischen Ihren Front-End- und Back-End-Diensten übernehmen, die eine Authentifizierung erfordern. Mit serverlosen Funktionen müssen Entwickler keine neuen Server aufsetzen und verwalten. Der Aufwand ist viel geringer und serverlose Funktionen lassen sich einfach anpassen und skalieren, wenn ein Unternehmen wächst. In diesem Artikel erhalten Sie einen Überblick darüber, was serverlose Funktionen von HubSpot sind und wie sie funktionieren. Wir empfehlen, ihn vor der Durchführung dieses Tutorials zu lesen.
Dieses Tutorial führt Sie durch die Erstellung Ihrer ersten serverlosen Funktion.
Sie erstellen einen Ordner für serverlose Funktionen, richten Ihren Konfigurationsordner ein, erstellen eine Funktion und erhalten eine Antwort von ihr.
Was Sie tun sollten, bevor Sie dieses Tutorial machen:
- Sie haben Zugriff auf einen CMS Hub Enterprise-Account oder einen CMS-Entwickler-Sandbox-Account.
- Stellen Sie sicher, dass Sie zumindest ein grundlegendes Verständnis des Konzepts einer serverlosen Funktion haben.
- Machen Sie sich mit den Tools für lokale Entwicklung von HubSpot vertraut, da sie für die Arbeit mit serverlosen Funktionen erforderlich sind.
- Vergewissern Sie sich, dass Sie über die neueste Version der Tools für lokale Entwicklung von HubSpot verfügen.
- Sie sollten die Tools für lokale Entwicklung bereitsmit Ihrem HubSpot-Account authentifiziert haben.
Öffnen Sie Ihre hubspot.config.yml
-Datei und stellen Sie sicher, dass Ihr defaultPortal
entweder auf Ihren CMS-Entwickler-Sandbox-Account oder auf einen Account bei CMS Hub Enterprise festgelegt ist.
Danach müssen Sie auf Ihrem Computer in dem Ordner, der Ihre hubspot.config.yml
-Datei enthält, einen serverless-tutorial
-Ordner erstellen. Dieser Ordner enthält alle unsere Dateien, sowohl die Funktionen selbst als auch eine Vorlage, die die Funktion verwendet.
Führen Sie in Ihrem Terminal den watch-Befehl aus:
Dies bewirkt, dass alle Änderungen an diesem Ordner zu Uploads an den Design-Manager führen. Da der Ordner derzeit keinen Inhalt hat, zeigt dieser Befehl einfach an, dass Watcher bereit ist und überwacht.
Erstellen Sie im serverless-tutorial
-Ordner einen my-first-function.functions
-Ordner.
Dies ähnelt Ordnern für benutzerdefinierte Module, die in .module
enden. .functions
dient zur Kommunikation, dass der Ordner serverlose Funktionen enthält. Die in diesem Ordner gespeicherten Dateien sind nicht öffentlich zugänglich.
Da dieser Ordner derzeit leer ist, erstellt der von Ihnen ausgeführtewatch
-Befehl noch nicht diesen Ordner im Design-Manager.
Erstellen Sie eine neue Datei in Ihrem my-first-function.functions
-Ordner und benennen Sie sie serverless.json
. serverless.json
ist eine erforderliche Datei innerhalb eines .functions
-Ordners. Sie dient als Konfigurationsdatei für serverlose Funktionen. Definieren der Laufzeitumgebung, der Version der serverlosen Funktionen und der verfügbaren Endpunkte. Eine Übersicht über alles, was in dieser Datei definiert wird, finden Sie in unserer Referenz für serverlose Funktionen.
Wenn Sie die Datei leer erstellt und gespeichert haben, erhalten Sie eine Fehlermeldung in Ihrem Terminal, dass Sie keine leere serverless.json
-Datei hochladen können. Sie können diese ignorieren, da Sie diesen Code noch hinzufügen und dann speichern – dies löst dann einen neuen Upload aus, der erfolgreich ist.
Fügen Sie den folgenden Code in Ihre serverless.json ein:
Speichern Sie die Datei.
Lassen Sie diese Datei in Ihrem Code-Editor geöffnet, wir kommen darauf noch zurück.
Da watch
ausgeführt wird, sehen Sie nun, wenn Sie Ihren Design-Manager aktualisieren, Ihre serverless-tutorial
- und my-first-function.functions
-Ordner sowie Ihre neue serverless.json
-Datei.
Erstellen Sie eine neue Datei in Ihrem my-first-function.functions-Ordner und benennen Sie sie gratulation.js.
Dies ist die eigentliche Funktionsdatei, die Datei, die eine Aufgabe ausführt und ausführt.
Fügen Sie den folgenden Code ein:
Diese serverlose Funktion gibt bei Ausführung Folgendes zurück: die Zeichenfolge "Glückwunsch! Sie haben gerade eine serverlose Funktion bereitgestellt."
und den Status-Code 200
, der auf Erfolg hinweist.
In einem realen Szenario ist es wahrscheinlich, dass Sie APIs verwenden oder einige Berechnungen durchführen, die Sie nicht öffentlich sein sollen. Sie würden das Ergebnis dieser Berechnungen oder einen einfachen Statuscode basierend auf dem Erfolg Ihrer API-Transaktionen zurückgeben.
Sie sind noch nicht fertig, es gibt noch keine Möglichkeit, diese Funktion auszuführen.
Öffnen Sie Ihre serverless.json
-Datei erneut. Suchen Sie in Ihrer Datei nach Ihrem "endpoints"
-Objekt.
Aktualisieren Sie das Objekt wie folgt:
Das Endpunkt-Objekt enthält ein "congratulation"
-Objekt. "congratulation"
ist der Endpunkt, den Sie erstellen. Der Name des Endpunkts definiert den Pfad, mit dem Sie Ihre serverlose Funktion aufrufen.
Serverlose Funktionen werden über einen Pfad in der Domain Ihres HubSpot CMS-Accounts bereitgestellt.
Diese Funktionen können unter folgender Adresse aufgerufen werden:
<https://www.example.com>/_hcms/api/<endpoint-name/path>
Im Falle dieses von Ihnen erstellten "congratulation"-Endpunkts ist dies
<https://www.example.com>/_hcms/api/congratulation
Aus diesem Grund ist es in der Regel ratsam, Ihrem Endpunkt einen ähnlich Namen wie den Ihrer Funktionsdatei zu geben, und beide sollten basierend auf den Informationen, anhand deren sie wirken, benannt werden, nicht basierend auf der Aktion, die anhand dieser Informationen durchgeführt wird. Sie sollten die HTTP-Methode oder die HTTP-Methoden verwenden, um den Typ der Aktion mitzuteilen, die Sie anhand dieser Informationen durchführen. Der "method"-Parameter definiert die von Ihrer Funktion unterstützte HTTP-Methode. Dies kann eine einzelne Zeichenfolge oder ein Array von Zeichenfolgen sein, die die Methoden bezeichnen, die die Funktion unterstützt.
Der einfachste Weg, eine GET
-Anfrage an Ihre serverlose Funktion zu testen, ist, direkt im Browser zur URL Ihres Endpunkts zu gehen.
https://your-domain.com/_hcms/api/congratulation
Ersetzen Sie ihre-domain.com durch die Domain Ihrer HubSpot-Website.
Sie sollten "Glückwunsch! Sie haben gerade eine serverlose Funktion bereitgestellt"
sehen.
Sehr gut. Sie haben es geschafft.
Wenn Sie diese Antwort nicht erhalten, gehen Sie noch einmal von oben in diesem Tutorial sorgfältig die einzelnen Schritte durch und überprüfen Sie den Code. Wahrscheinlich wurden die Anweisungen in Schritt 4 oder 5 nicht korrekt befolgt.
Für kompliziertere Anfragen ist es hilfreich, ein Tool wiePostman zu verwenden. Postman erleichtert das Testen und Debuggen von APIs. Eine praktische Funktion für Front-End-Entwickler ist dessen Code-Generierung, die einen Startpunkt für Ihren JavaScript-Aufruf Ihrer Funktion generieren kann.
Gehen Sie über ein neues Terminalfenster mithilfe von cd
in Ihren serverless-tutorial
-Ordner.
Führen Sie den folgenden Befehl in Ihrem Terminal aus:
Dadurch wird eine test-function.html
-Datei erstellt. Öffnen Sie diese Datei in Ihrem Code-Editor.
Fügen Sie über dem </head>
-Tag <script></script>
hinzu.
Kopieren Sie das folgende JavaScript:
Serverlose Funktionen von HubSpot unterstützen nur den Content-Typ application/json
. Wenn Sie es auslassen, wird ein Fehler vom Typ „Nicht unterstützter Medientyp“ angezeigt.
Fügen Sie innerhalb des script-Tags, das Sie zuvor erstellt haben, Ihren kopierten JavaScript-Code ein.
Ändern Sie www.example.com
in die Domain Ihres Accounts.
Speichern Sie die Datei.
Im Design-Manager finden Sie Ihre test-function.html
-Datei (Sie müssen möglicherweise aktualisieren).
Klicken Sie mit der rechten Maustaste auf die Datei und wählen Sie „Seite erstellen“ aus.
Nennen Sie Ihre Seite „Testfunktion“. Seite erstellen
Klicken Sie auf „Vorschau“. Die Vorschau wird in einem neuem Fenster angezeigt.
Überprüfen Sie die Seite, indem Sie mit der rechten Maustaste auf eine beliebige Stelle auf der Seite klicken und „Untersuchen“ auswählen.
Wenn Sie alles richtig gemacht haben, sollten Sie in Ihrer Konsole die Glückwunschnachricht sehen.
Herzlichen Glückwunsch, Sie haben Ihre serverlose Funktion von einer CMS Hub-Seite aus aufgerufen.
Bei diesem Tutorial rufen Sie die serverlose Funktion auf der Vorlagenebene auf. Serverlose Funktionen können jedoch überall aufgerufen werden, wo Sie JavaScript auf Ihrer von CMS gehosteten Website hinzufügen können. Der häufigste Ort, an dem Sie dies tun können, ist in Ihren benutzerdefinierten Modulen.
In dieser Phase sollte Ihre serverlose Funktion einwandfrei funktionieren. Je komplizierter Ihre Funktion wird, desto schwieriger ist es, Fehler zu beheben. So wie die Konsole in Ihrem Browser beim Debuggen von JavaScript auf Ihrem Frontend hilft, können Sie ähnliche Protokolle für Ihre serverlosen Funktionen mit hs logs
erhalten. Weitere Informationen zu diesem Befehl finden Sie in der Referenz für lokale Entwicklung.
Was haben Sie getan?
Sie haben einen Ordner für serverlose Funktionen mit einer serverless.json-Konfigurationsdatei und einer Funktionsdatei mit dem Namen congratulation.js
erstellt. Sie haben „GET“ verwendet, um einen Glückwunschtext von der serverlosen Funktion abzurufen. Sie haben JavaScript verwendet, um Ihre serverlose Funktion von einer Seite im CMS Hub aus aufzurufen.
Sie können jetzt nachvollziehen, wie die Konfigurationsdatei, die Funktionsdatei und der .functions
-Ordner zusammenhängen. Das CLI verfügt über einen praktischen Befehl, den Sie verwenden können, um Ihre Funktionen beim nächsten Mal schneller zu erstellen.
Diese Funktion erstellt einen .functions
-Ordner eine serverless.json
-Datei und eine Funktionsdatei mit den von Ihnen angegebenen Namen.
- Allgemeine Übersicht über serverlose Funktionen im CMS Hub.
- Referenzleitfaden für serverlose Funktionen, in dem die Teile einer serverlosen Funktion aufschlüsselt werden
- Academy-Kurs „Einführung in die HubSpot-APIs“
- Kontinuierliche Integration mit GitHub
Vielen Dank, dass Sie Ihr Feedback mit uns geteilt haben.