Lancer votre boutique en ligne

Ce guide décrit comment lancer une boutique PWA Kit et la rendre accessible à partir de son adresse web officielle publique. Trois possibilités s’offrent à vous pour lancer et diriger votre trafic vers votre boutique PWA Kit :

  1. Utiliser un CDN tiers comme CloudFlare ou Akamai.
  2. Utilisez le CDN intégré (eCDN), fourni par Salesforce Commerce Cloud. Pour en savoir plus sur le routage du trafic vers Managed Runtime à l’aide d’eCDN, reportez-vous au guide.
  3. Utilisez le CDN Managed Runtime.

Dans ce guide, nous utilisons un exemple de boutique en ligne avec les attributs suivants :

  • URL de production : https://www.example.com
  • Identifiant du projet : example
  • Identifiants d’environnement : staging et production

L’empilement d’un CDN tiers sur Managed Runtime est facultatif. Les clients peuvent choisir d’utiliser un CDN tiers pour les raisons suivantes :

  • Une relation préexistante avec le fournisseur de CDN de leur choix, dont les équipes internes sont capables de configurer et de gérer un CDN.
  • Un besoin de contrôle supplémentaire des fonctionnalités du CDN au-delà de ce que propose Managed Runtime, comme des règles de WAF personnalisées, des en-têtes de performances supplémentaires et des intégrations tierces supplémentaires.

Les clients qui souhaitent un service à bas coût, une commercialisation rapide et dont les exigences concernant leur CDN sont limitées, peuvent utiliser l’eCDN ou le CDN intégré à Managed Runtime.

Ce guide suppose que vous avez accès à l'application Web Runtime Admin et à Managed Runtime API pour effectuer des tâches administratives. Pour accéder à ces outils, contactez votre administrateur Commerce Cloud et demandez-lui d'ajouter l'un des rôles suivants à votre compte dans Account Manager : Managed Runtime User ou Managed Runtime Admin.

Pour envoyer des requests à Managed Runtime API, vous devez inclure une clé API dans l’en-tête de la request HTTP Authorization avec la valeur Bearer $API_KEY. Pour tous les exemples de requests fournis, n'oubliez pas de remplacer $API_KEY par votre propre clé API.

Pour trouver votre clé API, connectez-vous à Runtime Admin et accédez à la page Account Settings.

Important : Considérez votre clé API comme un mot de passe, car elle permet aux scripts d'effectuer des opérations en votre nom.

Vous aurez besoin d’accéder à votre fournisseur DNS pour créer et mettre à jour des enregistrements CNAME, ainsi que d’accéder à votre fournisseur de CDN tiers (le cas échéant).

Dans ce guide, le mot « Mobify » apparaît à quelques endroits. Mobify est le nom de la société qui a développé à l'origine la technologie qui est devenue PWA Kit et Managed Runtime. En 2020, Salesforce a acquis Mobify ainsi que l'ensemble de ses technologies.

Le nom de marque Mobify apparaît dans le domaine mobify-storefront.com utilisé pour héberger votre boutique ainsi que dans le domaine cloud.mobify.com utilisé par Managed Runtime API.

Si vous devez ajouter une logique conditionnelle qui modifie le comportement de votre site en fonction du domaine utilisé, il est plus facile de tester cette logique si votre serveur de développement local peut utiliser un domaine personnalisé. Pourquoi auriez-vous besoin d’ajouter ce genre de logique ? Considérons, par exemple, le besoin de rechercher un identifiant client SLAS différent selon le domaine.

Pour exécuter votre serveur de développement local en utilisant un domaine personnalisé :

  1. Modifiez le DNS de votre ordinateur local pour résoudre votre domaine personnalisé en 127.0.0.1 (localhost).
  2. Modifiez ssr.js.
  3. Dans les options transmises à runtime.createHandler, configurez le port sur 80.
  4. Exécutez EXTERNAL_DOMAIN_NAME=www.example.com npm start, en remplaçant la valeur de example.com par votre domaine personnalisé. L’exécution du serveur sur le port 80 peut nécessiter des privilèges administratifs.

Les requests envoyées par votre navigateur vers le domaine personnalisé sont maintenant résolues et routées vers votre serveur de développement local !

Le processus de lancement d’un environnement est le même en staging et en production. Les seules différences sont le nom de domaine et l’environnement Managed Runtime utilisé.

Nous vous recommandons fortement de suivre d’abord le processus de lancement dans un environnement de staging avant de répéter le processus en production.

Pour les instructions fournies, supposons que vous lancez une boutique sur staging.example.com, que votre identifiant de projet dans Managed Runtime est example et que votre paquet est déployé dans un environnement appelé staging.

Vous pouvez suivre cette procédure à tout moment, mais nous vous recommandons de le faire dès que vous commencez à utiliser PWA Kit.

Utilisez l’application web Runtime Admin ou Managed Runtime API pour créer un environnement (ou cible) appelé staging pour vous entraîner au lancement de la boutique.

Voici un exemple de request qui utilise le point de terminaison projects_target_create de Managed Runtime API pour créer un environnement. Remplacez example dans la request par votre propre chaîne d’identification de projet, et remplacez $API_KEY par votre propre clé API :

Pour obtenir des instructions sur la création d'un environnement avec Runtime Admin, consultez notre guide Administration de Managed Runtime.

La plupart des implémentations du PWA Kit adressent des requests à OCAPI et aux contrôleurs fournis par B2C Commerce.

Vous devez vous assurer que Managed Runtime peut atteindre le domaine associé à votre instance B2C Commerce pour effectuer ces requests.

Pour rendre ce domaine accessible, vous devrez généralement configurer l’eCDN afin de rendre votre instance B2C Commerce disponible sur un sous-domaine tel que ecom.example.com. Pour en savoir plus, reportez-vous à la documentation d’installation et de configuration de l’eCDN.

Une fois votre domaine eCDN B2C Commerce configuré, mettez à jour les paramètres de proxy de votre environnement pour utiliser le nouvel emplacement de l’API. Pour en savoir plus, consultez notre guide Requests via proxy.

Si vous routez le trafic directement vers le CDN Managed Runtime, Managed Runtime émet et gère les certificats TLS pour vous.

Cette étape n’est pas obligatoire si vous utilisez un CDN ou un eCDN tiers. Consultez la documentation de votre fournisseur CDN pour configurer les certificats TLS.

Pour permettre à Managed Runtime d’émettre un certificat TLS, vous devez créer un enregistrement CNAME. Contactez le support client Salesforce en fournissant les domaines de certificat souhaités. Salesforce vous fournit ensuite les détails des enregistrements CNAME de validation de votre certificat. Les certificats génériques, comme *.example.com, sont pris en charge.

Le lancement avec des domaines personnalisés est pris en charge pour les environnements de staging et de production. Tous les autres environnements tels que l’environnement Development sont actuellement limités à la poursuite de l’utilisation des domaines mobify-storefront.com par défaut.

Vous devez créer l’enregistrement DNS CNAME de validation fourni dans les 24 heures suivant la réception des informations. Cet enregistrement est du type :

Cette étape n’est pas obligatoire si vous utilisez un CDN tiers.

Réduisez la durée de vie (TTL) pour staging.example.com à une minute. Réduire la TTL accélère le processus de transfert du DNS et, en cas de problème, permet de revenir en arrière rapidement.

Vous pouvez vérifier la TTL à l'aide de la commande dig :

Cette étape n’est pas obligatoire si vous utilisez un CDN tiers.

Configurez l'environnement pour recevoir le trafic à partir de l'hôte staging.example.com.

Mettez à jour les paramètres ssr_external_domain et ssr_external_hostname de l'environnement à l'aide de Managed Runtime API :

Après cette étape, l'environnement n'est plus accessible à l'adresse de son domaine mobify-storefront.com.

Vérifiez que les nouveaux paramètres sont bien en vigueur en utilisant une commande cURL qui lance une request avec usurpation de DNS :

Le processus de basculement varie selon que vous utilisez un CDN tiers ou le CDN Managed Runtime.

Pour cette option, vous devez configurer votre CDN pour qu’il pointe vers l’origine Managed Runtime au lieu de l’origine du CDN existante. Reportez-vous à la documentation de votre fournisseur de CDN pour des conseils détaillés.

Ajoutez le nom d’hôte externe ({{project}}-{{environment}}.mobify-storefront.com) comme origine dans votre CDN tiers. Assurez-vous que le CDN est configuré pour :

  • définir l’en-tête Host afin qu’il corresponde à l’origine {{project}}-{{environment}}.mobify-storefront.com
  • transférer la méthode de request
  • transférer le chemin d’accès (y compris la chaîne de requête)
  • transférer les en-têtes
  • transférer le corps
  • obéir aux en-têtes de mise en cache HTTP.

Pensez à ajouter un gestionnaire pour refléter les requests HTTP afin de vérifier que le CDN est configuré correctement :

Pensez également à ajouter un proxy avec httpbin.org/anything pour vérifier que les en-têtes transmis aux proxys sont envoyés correctement.

Pour cette option, vous devez effectuer un basculement DNS pour faire pointer votre domaine vers le CDN Managed Runtime au lieu de l’ancienne origine.

Le support Salesforce vous fournit un domaine stable suivant la convention {{project}}-{{environment}}-cdn.mobify-storefront.com où {{project}} correspond à l’identifiant de votre projet et {{environment}} à celui de votre environnement.

Changez l'enregistrement CNAME du DNS pour staging.example.com en example-staging-cdn.mobify-storefront.com.

Ouvrez votre navigateur Web et accédez à staging.example.com.

Félicitations, vous avez terminé votre lancement ! 🥳

Après avoir suivi ces instructions pour un site de staging, vous pouvez répéter le même processus avec le domaine et l’environnement de production.

À partir de là, le Customer Success Group vous aide à surveiller le trafic du site pour vous assurer que le lancement a bien réussi. L'objectif est de vérifier que tout se passe comme prévu lors du lancement !

Après le lancement, les clients abonnés à la formule Signature Success bénéficient d'un suivi proactif de leur site. Pour profiter de ce service de surveillance renforcée, vous devez indiquer que votre environnement est un environnement de production. Pour en savoir plus, consultez la section sur les environnements dans la Présentation de Managed Runtime.

  • Le paramètre de la cible ssr_external_hostname contrôle l’hôte à partir duquel l’environnement reçoit le trafic. Si l’en-tête HTTP Host d’une request ne correspond pas à cette valeur, la request échoue avec une erreur 403.
  • Actuellement, Salesforce ne prend pas en charge les URL de boutique en ligne avec un domaine nu comme example.com (sans sous-domaine www). Pour utiliser un domaine nu, vous devez configurer un serveur pour rediriger les requests du domaine nu vers votre CNAME.