Start Ihrer Storefront

Diese Anleitung beschreibt, wie Sie eine PWA Kit-Storefront starten und über ihre offizielle öffentliche Webadresse zugänglich machen. Sie haben drei Möglichkeiten, Ihr PWA Kit-Storefront zu starten und Traffic dorthin zu leiten:

1. Verwenden Sie ein externes CDN wie CloudFlare oder Akamai.
2. Verwenden Sie das von Salesforce Commerce Cloud bereitgestellte Embedded CDN (eCDN). Weitere Informationen zum Traffic-Routing an Managed Runtime mithilfe von eCDN finden Sie in der Anleitung.
3. Verwenden Sie das Managed Runtime CDN.

Im Rahmen dieser Anleitung verwenden wir eine Beispiel-Storefront mit den folgenden Attributen:

• Production-URL: https://www.example.com
• Projekt-ID: example
• Umgebungs-IDs: staging und production

• Checkliste mit Best Practices für Pre-Build und Go-Live

Das Aufsetzen eines CDN eines Drittanbieters auf Managed Runtime ist optional. Kunden können sich aus den folgenden Gründen für das CDN eines Drittanbieters entscheiden:

• Eine bereits bestehende Beziehung zum CDN-Anbieter Ihrer Wahl, dessen interne Teams in der Konfiguration und Verwaltung eines CDN geschult sind.
• Bedarf an zusätzlicher Kontrolle von CDN-Funktionalitäten, die über das hinausgehen, was eCDN oder Managed Runtime bieten.

Kunden, die niedrige "Cost to Serve" (CTS) und eine schnelle Markteinführung wünschen und nur begrenzte CDN-Anforderungen haben, können entweder eCDN oder das integrierte Managed Runtime CDN verwenden.

In dieser Anleitung wird davon ausgegangen, dass Sie für die Durchführung administrativer Aufgaben auf die Runtime Admin-Webanwendung und die Managed Runtime API zugreifen können. Um Zugriff auf diese Tools zu erhalten, bitten Sie Ihren Commerce Cloud-Administrator, Ihrem Konto eine der beiden folgenden Rollen im Account Manager hinzuzufügen: Managed Runtime User oder Managed Runtime Admin.

Um Anfragen an die Managed Runtime API zu senden, müssen Sie im Header Authorization der HTTP-Anfrage einen API-Schlüssel mit dem Wert Bearer $API_KEY einfügen. Vergessen Sie bei allen Beispielanfragen nicht, $API_KEY mit Ihrem tatsächlichen API-Schlüssel zu ersetzen.

Um Ihren API-Schlüssel zu finden, melden Sie sich bei Runtime Admin an und rufen Sie die Seite Kontoeinstellungen auf.

Wichtig: Behandeln Sie Ihren API-Schlüssel wie ein Passwort, da er es Skripts ermöglicht, Vorgänge in Ihrem Namen auszuführen.

Sie benötigen Zugang zu Ihrem DNS-Anbieter, um CNAME-Datensätze zu erstellen und zu aktualisieren, und gegebenenfalls auch Zugang zu Ihrem CDN-Drittanbieter.

In dieser Anleitung werden Sie gelegentlich auf den Namen Mobify stoßen. Mobify ist der Name des Unternehmens, das ursprünglich die Technologie entwickelt hat, die PWA Kit und Managed Runtime als Grundlage dient. Im Jahr 2020 hat Salesforce Mobify zusammen mit der gesamten Technologie des Unternehmens übernommen.

Der Markenname Mobify wird in der Domain mobify-storefront.com, die als Host Ihrer Storefront dient, sowie in der von der Managed Runtime API genutzten Domain cloud.mobify.com verwendet.

Wenn Sie eine bedingte Logik hinzufügen müssen, die das Verhalten Ihrer Website in Abhängigkeit von der verwendeten Domain ändert, ist es einfacher, diese Logik zu testen, wenn Ihr lokaler Entwicklungsserver eine benutzerdefinierte Domain verwenden kann. Warum sollten Sie diese Art von Logik hinzufügen müssen? Beispielsweise kann es notwendig sein, je nach Domain eine andere SLAS Client-ID zu ermitteln.

So führen Sie Ihren lokalen Entwicklungsserver mit einer benutzerdefinierten Domain aus:

1. Ändern Sie den DNS Ihres lokalen Computers so, dass Ihre benutzerdefinierte Domain in 127.0.0.1 (localhost) aufgelöst wird.
2. Bearbeiten Sie ssr.js.
3. Legen Sie in den an runtime.createHandler übergebenen options den Port auf 80 fest.
4. Führen Sie EXTERNAL_DOMAIN_NAME=www.example.com npm start aus, wobei Sie den Wert von example.com durch Ihre benutzerdefinierte Domain ersetzen. Für die Ausführung des Servers auf Port 80 sind in manchen Fällen Administratorrechte erforderlich.

Anfragen Ihres Browsers an die benutzerdefinierte Domain werden nun aufgelöst und an Ihren lokalen Entwicklungsserver weitergeleitet!

Der Startprozess ist identisch für Staging- und Production-Umgebungen; die einzigen Unterschiede sind der Domain-Name und die verwendete Managed Runtime-Umgebung.

Gehen wir im Rahmen der bereitgestellten Anweisungen davon aus, dass Sie eine Storefront auf staging.example.com starten, Ihre Projekt-ID in Managed Runtime example lautet und Ihr Bündel in einer Umgebung namens staging bereitgestellt wird.

Verwenden Sie Runtime Admin oder Managed Runtime API, um eine Umgebung namens staging zu erstellen, um das Starten der Storefront zu üben.

Hier sehen Sie eine Beispielanfrage, die den Endpunkt projects_target_create verwendet, um eine Umgebung zu erstellen. Ersetzen Sie example in der Anfrage durch die Zeichenfolge Ihrer tatsächlichen Projekt-ID und $API_KEY durch Ihren API-Schlüssel:

Anweisungen für die Erstellung einer Umgebung mit Runtime Admin finden Sie in unserer Anleitung Managed Runtime Administration.

Viele PWA Kit-Implementierungen stellen zusätzlich zur B2C Commerce API Anfragen an OCAPI oder Controller.

Sie müssen sicherstellen, dass Ihre B2C Commerce-Instanz über Managed Runtime erreichbar ist.

Um die APIs erreichbar zu machen, müssen Sie in der Regel eCDN konfigurieren, um Ihre B2C Commerce-Instanz in einer alternativen Domain wie ecom.example.com verfügbar zu machen. Weitere Informationen finden Sie in der Dokumentation zu Setup und Konfiguration von eCDN.

Nachdem Ihre Domain konfiguriert wurde, aktualisieren Sie die Proxy-Einstellungen Ihrer Umgebung, um sie zu verwenden. Näheres hierzu finden Sie in unserer Anleitung zu Proxy-Anfragen.

Wenn Sie Traffic direkt an das Managed Runtime CDN weiterleiten, stellt Managed Runtime TLS-Zertifikate in Ihrem Namen aus und verwaltet diese.

Damit Managed Runtime ein Zertifikat ausstellen kann, müssen Sie folgende Schritte ausführen:

• Wählen Sie die Domains aus, die Sie für Ihre Storefront verwenden möchten. Zum Beispiel staging.example.com und www.example.com. Platzhalter-Domains wie *.example.com werden unterstützt. Bestimmte Domain-Zertifikate werden nur für Domains ausgestellt, die mit Staging- und Production-Umgebungen verknüpft sind.
• Stellen Sie sicher, dass die Domain-Datensätze CAA so festgelegt sind, dassAWS Zertifikate ausstellen darf.
• Wenden Sie sich an den Salesforce-Kundensupport und geben Sie die gewünschten Domains für die Zertifikate an.
• Salesforce stellt einen CNAME-Datensatz bereit, der zur Validierung des Domain-Eigentums verwendet wird. Sie müssen den bereitgestellten Datensatz innerhalb von 24 Stunden nach Erhalt der Einzelheiten erstellen.

Reduzieren Sie die Zeit bis zur Live-Schaltung (TTL) für staging.example.com auf 1 Minute. Die Reduzierung der TTL beschleunigt den DNS-Wechsel, und falls etwas schief läuft, können Sie den Prozess schnell wieder rückgängig machen.

Mit dem Befehl dig können Sie die TTL verifizieren:

Legen Sie den Access Control Header einer Umgebung mithilfe der Managed Runtime-Benutzeroberfläche unter Access-Control-Einstellungen oder mithilfe der access_control_header API fest. In diesem Beispiel verwenden wir die API, um einen Access Control Header mit dem Header-Wert 25pn5dec7f1c einzurichten. Siehe Access Control Headers.

Konfigurieren Sie die Umgebung für den Empfang von Traffic vom Host staging.example.com.

Aktualisieren Sie die Umgebungseinstellungen ssr_external_domain und ssr_external_hostname mithilfe der projects_target_partial_update API:

Verifizieren Sie, dass die neuen Einstellungen aktiv sind. Verwenden Sie dazu einen cURL-Befehl, der eine Anfrage mittels DNS-Spoofing durchführt:

Bei Verwendung eines CDN eines Drittanbieters, eines eCDN und des Managed Runtime CDN ist der Wechselprozess anders.

Konfigurieren Sie Ihre Managed Runtime-Umgebung als Ursprung in Ihrem CDN:

• Legen Sie den Host-Header so fest, dass er Ihrer Umgebung {{project}}-{{environment}}.mobify-storefront.com entspricht;
• leiten Sie die Anfragemethode weiter;
• leiten Sie den Pfad (einschließlich Abfrage-String) weiter;
• leiten Sie die Header weiter;
• leiten Sie den Textkörper weiter;
• leiten Sie den gesamten Traffic über HTTPS weiter;
• befolgen Sie HTTP-Caching-Headers;
• legen Sie den Header-Wert x-sfdc-access-control fest, wenn dieser für Ihre Umgebung konfiguriert ist.

Eine ausführliche Anleitung finden Sie in der Dokumentation Ihres CDN-Anbieters.

Erwägen Sie das Hinzufügen eines Handlers, um HTTP-Anfragen widerzuspiegeln, und stellen Sie sicher, dass Ihr CDN ordnungsgemäß konfiguriert ist:

Ziehen Sie auch das Hinzufügen eines Proxys mit httpbin.org/anything in Betracht, um zu überprüfen, ob die an Proxys übergebenen Header ordnungsgemäß gesendet werden.

Wenn Probleme auftreten, verwenden Sie die unter Debuggen von PWA Kit-Apps beschriebenen Methoden.

Aktualisieren Sie Ihre eCDN-Routing-Regeln, um Traffic an Ihre Managed Runtime-Umgebung weiterzuleiten. Weitere Informationen finden Sie imLeitfaden eCDN-MRT-Regeln.

Führen Sie einen DNS-Wechsel durch, um Ihre Domain vom alten Ursprung auf das Managed Runtime CDN zu verweisen.

Die Managed Runtime CDN-Domain folgt der Konvention {{project}}-{{environment}}-cdn.mobify-storefront.com, wobei {{project}} Ihre Projekt-ID und {{environment}} Ihre Umgebungs-ID ist.

Ändern Sie den DNS CNAME-Datensatz für staging.example.com zu example-staging-cdn.mobify-storefront.com.

Öffnen Sie Ihren Webbrowser und rufen Sie staging.example.com auf.

Herzlichen Glückwunsch! Sie haben Ihren Start abgeschlossen! 🥳

Nachdem Sie diese Anweisungen für eine Staging-Website ausgeführt haben, können Sie den gleichen Prozess mit der Production-Domain und der Production-Umgebung wiederholen.

Ab diesem Zeitpunkt unterstützt Sie die Customer Success Group beim Monitoring des Website-Traffics, um sicherzustellen, dass der Start erfolgreich war. Ziel ist es, sicherzustellen, dass alles während des Starts wie erwartet über die Bühne geht!

Nach dem Start können Kunden mit einem Signature Success Plan von einem proaktiven Website-Monitoring profitieren. Um die Vorteile dieses erweiterten Monitoring-Dienstes zu nutzen, müssen Sie Ihre Umgebung als production-Umgebung kennzeichnen. Näheres hierzu finden Sie im Abschnitt zu Umgebungen in der Übersicht über Managed Runtime.

• Die Zieleinstellung ssr_external_hostname steuert, über welchen Host die Umgebung Traffic erhält. Wenn der HTTP-Host-Header einer Anfrage nicht mit diesem Wert übereinstimmt, schlägt die Anfrage mit einem 403-Fehler fehl.
• Derzeit unterstützt Salesforce keine Storefront-URLs mit einer Stammdomain wie example.com (ohne www-Subdomain). Um eine Stamm-Domain zu verwenden, müssen Sie einen Server so einrichten, dass er Anfragen von der Stamm-Domain an Ihren CNAME umleitet.