Lancio dello storefront

Questa guida descrive come lanciare un nuovo storefront PWA Kit e renderlo accessibile dal relativo indirizzo web pubblico ufficiale. Per lanciare lo storefront PWA Kit e instradarvi il traffico sono disponibili due opzioni:

  1. Utilizzare una CDN di terze parti come CloudFlare o Akamai.
  2. Utilizzare la CDN fornita da Managed Runtime.

In questa guida verrà utilizzato uno storefront di esempio con i seguenti attributi:

  • URL Production: https://www.example.com
  • ID progetto: example
  • Ambienti: staging e production

Il termine "Mobify" compare in alcuni punti di questa guida. Mobify è il nome dell'azienda che in origine ha sviluppato la tecnologia successivamente adottata per PWA Kit e Managed Runtime. Nel 2020 Salesforce ha acquisito Mobify insieme a tutte le relative tecnologie.

Il processo di rebranding da Mobify a Salesforce è ancora in corso. Il nome del brand Mobify compare ancora nel dominio mobify-storefront.com in cui viene ospitato lo storefront e nel dominio cloud.mobify.com utilizzato da Managed Runtime API. Sebbene i nuovi domini Salesforce sostituiranno in futuro i domini Mobify, il supporto per questi ultimi rimarrà attivo.

Managed Runtime supporta l'uso di una CDN di terze parti di fronte a uno storefront PWA Kit. Iniziare implementando l'ambiente con le impostazioni predefinite. In seguito aggiungere lo storefront ({{project}}-{{environment}}.mobify-storefront.com) come origine nella CDN di terze parti. Verificare che la CDN sia configurata per l'inoltro del metodo di richiesta, del percorso (inclusa la stringa di query), delle intestazioni e del corpo. Assicurarsi inoltre che la CDN sia impostata per eseguire le istruzioni delle intestazioni di caching HTTP.

Considerare l'aggiunta di un handler in base alle richieste HTTP per verificare che la CDN sia configurata correttamente:

Considerare inoltre di aggiungere un proxy con httpbin.org/anything per verificare che le intestazioni passate ai proxy vengano inviate correttamente.

Verranno illustrate le tre fasi del "go live": preparazione, lancio di un ambiente Staging e lancio dell'ambiente Production.

Istruzioni preliminari

In questa guida si presuppone che l'utente abbia accesso all'applicazione web Runtime Admin e a Managed Runtime API per l'esecuzione delle attività amministrative. Per ottenere l'accesso a questi strumenti, rivolgersi all'amministratore Commerce Cloud e chiedere di aggiungere uno dei seguenti ruoli all'account che utilizza Account Manager: Managed Runtime User (Utente Managed Runtime) o Managed Runtime Admin (Amministratore Managed Runtime).

Per effettuare richieste a Managed Runtime API, è necessario includere una chiave API nell'intestazione Authorization della richiesta HTTP con il valore Bearer {{api_key}}. In tutte le richieste di esempio fornite, non dimenticare di sostituire {{api_key}} con la chiave API effettiva.

Per individuare la chiave API, accedere a Runtime Admin e passare alla pagina Account Settings (Impostazioni account).

Importante: poiché la chiave API consente agli script di eseguire le operazioni automaticamente, è necessario considerarla come una password.

Prima fase: preparazione

Questa procedura può essere completata in qualsiasi momento, ma è consigliabile eseguirla al primo utilizzo di PWA Kit.

1. Creare un ambiente Staging

Per esercitarsi con la procedura di lancio dello storefront, creare un ambiente (noto anche come target) denominato staging utilizzando Managed Runtime API o l'applicazione web Runtime Admin.

Di seguito è riportata una richiesta di esempio che utilizza l'endpoint target di Managed Runtime API per creare un ambiente. Sostituire example nella richiesta con la stringa dell'ID progetto effettivo e {{api_key}} con la chiave API effettiva.

Per istruzioni sulla creazione di un ambiente con Runtime Admin, consultare la guida Amministrazione in Managed Runtime.

2. Rendere le API disponibili pubblicamente

Poiché il codice dello storefront deve essere in grado di accedere all'istanza di B2C Commerce, le API devono essere disponibili pubblicamente.

Si supponga che attualmente www.example.com venga risolto in un'istanza di B2C Commerce. Dopo il lancio, www.example.com verrà risolto nel dominio mobify-storefront.com. Il codice dello storefront deve poter richiamare le API associate all'istanza di B2C Commerce. È possibile scegliere di rendere le API disponibili su api.example.com e aggiornare le impostazioni proxy dell'ambiente per permetterne l'utilizzo. Per ulteriori informazioni, consultare la guida Invio delle richieste a un proxy.

3. Consentire a Salesforce di emettere certificati TLS

Per consentire a Salesforce di emettere un certificato TLS per il dominio, è necessario creare un record CNAME. Contattare Salesforce Customer Support e richiedere i dettagli necessari per la creazione di un record CNAME per lo storefront.

Creare il record CNAME entro 24 ore dal ricevimento dei dettagli. Un record CNAME ha il seguente aspetto:

Seconda fase: lancio di un ambiente Staging

Il processo di lancio deve essere sempre testato in primo luogo in un ambiente Staging.

Si supponga di lanciare uno storefront su staging.example.com con ID progetto example in Managed Runtime e bundle distribuito in un ambiente denominato staging.

1. Ridurre la durata Time to Live (TTL) del CNAME DNS

Ridurre la durata TTL di staging.example.com a un minuto. La riduzione della durata TTL accelera il processo di migrazione DNS e, in caso di errore, consente di eseguire rapidamente il rollback.

È possibile verificare la durata TTL utilizzando il comando dig:

2. Configurare l'ambiente

Configurare l'ambiente per ricevere il traffico dall'host staging.example.com.

Aggiornare le impostazioni ssr_external_domain e ssr_external_hostname dell'ambiente utilizzando Managed Runtime API:

Importante: Dopo questa fase, l'ambiente non è più accessibile sul proprio dominio mobify-storefront.com.

Verificare che le nuove impostazioni siano effettive utilizzando un comando cURL che effettui una richiesta con spoofing DNS:

3. Eseguire la migrazione DNS

Salesforce Support fornisce un dominio stabile in base alla convenzione {{project}}-{{environment}}-cdn.mobify-storefront.com, dove {{project}} è l'ID progetto e {{environment}} è l'ID ambiente.

Aggiornare il record CNAME DNS per staging.example.com a example-staging-cdn.mobify-storefront.com. Aprire il browser web e passare a staging.example.com.

Congratulazioni. Il lancio di prova è stato completato. 🥳

Terza fase: lancio dell'ambiente Production

Quando è tutto pronto per il lancio dell'ambiente Production, eseguire la stessa procedura utilizzata per il lancio di prova, ma con dominio e ambiente production.

A questo punto, con l'aiuto del Customer Success Group, monitorare il traffico del sito per verificare che il lancio sia andato a buon fine. L'obiettivo è verificare che durante il lancio tutto proceda come previsto.

Dopo il lancio, i clienti con piano Signature Success Plan hanno diritto al monitoraggio del sito proattivo. Per usufruire di questo ulteriore servizio di monitoraggio, è necessario contrassegnare l'ambiente come Production. Per ulteriori informazioni, vedere la sezione relativa agli ambienti in Managed Runtime.

  • L'impostazione del target ssr_external_domain controlla da quale host il target riceve traffico. Se l'intestazione Host HTTP di una richiesta non corrisponde a questo valore, la richiesta non va a buon fine.
  • Attualmente Salesforce non supporta gli URL di storefront contenenti un dominio semplice, ad esempio example.com (senza sottodominio www). Per utilizzare un dominio semplice, è necessario impostare un server per il reindirizzamento delle richieste da tale dominio al proprio CNAME.

Se occorre aggiungere una logica condizionale che modifichi il comportamento del sito in base al dominio utilizzato, risulta più facile testarla quando il server di sviluppo locale può utilizzare un dominio personalizzato. Perché dovrebbe essere necessario aggiungere questo tipo di logica? Si pensi, ad esempio, alla necessità di cercare un ID client SLAS diverso a seconda del dominio.

Per eseguire il server di sviluppo locale utilizzando un dominio personalizzato:

  1. Modificare il DNS del computer locale per risolvere il dominio personalizzato a 127.0.0.1 (localhost).
  2. Modificare ssr.js.
  3. Nelle options passate a runtime.createHandler, impostare la porta su 80.
  4. Eseguire EXTERNAL_DOMAIN_NAME=www.example.com npm start sostituendo il valore di example.com con il dominio personalizzato. L'esecuzione del server sulla porta 80 potrebbe richiedere privilegi amministrativi.

Le richieste dal browser al dominio personalizzato ora vengono risolte e instradate al server di sviluppo locale.

Buon lavoro di debugging. 😊