Premiers pas avec votre première salle d'attente

Dans ce guide, nous allons vous présenter certaines fonctionnalités essentielles de CrowdHandler, créer votre première salle d'attente et l'intégrer à votre site.

Première connexion

Lorsque vous vous connectez pour la première fois à votre panneau d'administration, vous devriez voir quelque chose qui ressemble à ceci :

CrowdHandler ne détecte actuellement aucun trafic sur votre domaine, d'où cette page vide. Votre compte est tout nouveau, vous n'avez pas encore installé le code sur votre site web et vous devez créer une « salle d'attente » pour protéger toutes les URL de votre domaine.

La « salle d'attente » est une page Web que CrowdHandler héberge pour vous ; tout visiteur de cette salle d'attente sera finalement redirigé vers votre site Web. Poursuivez votre lecture pour en savoir plus sur la manière dont nous redirigeons les visiteurs vers vos pages.

Créer une d'attente

Cliquez sur le bouton « Ajouter une salle » pour accéder à l'écran « Ajouter une salle ».

N'hésitez pas à cliquer sur le bouton « Créer une salle » ! Vous serez redirigé vers le tableau de bord.

Jetez un œil à la salle d'attente

Votre nouvelle « Waiting Room » apparaîtra sur le tableau de bord. Elle est configurée pour protéger toutes les URL de votre domaine et est déjà active. Vous ne nous croyez pas ? Cliquez sur le lien « Waiting Room » : votre « Waiting Room » s'ouvrira dans un nouvel onglet.

Tu es le premier visiteur de la salle d'attente (enfin, elle vient tout juste d'être mise en place), tu devrais donc voir quelque chose comme ça :

État initial de la salle d'attente

Vous êtes le premier parce que vous êtes le seul utilisateur à essayer d'accéder à votre site web via cette « salle d'attente ». Vous allez toutefois devoir patienter longtemps, car lorsque nous avons configuré votre domaine, nous avons défini le débit d'entrée sur 0. Nous voulions que vous testiez la salle d'attente, et si nous avions fixé un débit plus élevé, vous auriez été directement redirigé vers votre site.

Jetez un œil au tableau

Revenez au tableau de bord dans le panneau d'administration. Au bout d'environ une minute, vous devriez voir quelque chose qui ressemble à ceci :

Fini les « tumbleweeds ». Ce point en haut de la file, c'est vous, en attente. Le point rouge en bas de la file est à zéro, ce qui indique qu'il n'y a pas d'utilisateurs actifs, mais uniquement des utilisateurs en attente.

Allez, faisons avancer cette file d'attente !

Transformons cet utilisateur en attente en utilisateur actif ! Allez-y, réglez la valeur sur un chiffre supérieur à 0. Augmentez la valeur du curseur jusqu'à 10.

Si vous revenez maintenant à l'onglet « Salle d'attente », vous devriez constater que vous êtes redirigé vers votre site web en moins d'une minute.

Succès du test de redirection vers la salle d'attente

Et si vous vous rendez sur le tableau de bord et que vous attendez moins d'une minute, vous devriez voir le graphique s'actualiser comme ceci :

Il n'y a actuellement aucun utilisateur en attente, et un seul utilisateur actif (vous !).

Le paramètre de débit détermine le nombre d'utilisateurs que nous autoriserons à accéder à votre site chaque minute.

Comprendre le débit et

Prenons un instant pour réfléchir à ce qu'est le « taux » et au fonctionnement d'une file d'attente avec CrowdHandler. Voici le point essentiel à retenir :

C'est vous qui fixez le rythme qui vous convient, et la salle d'attente s'active quand c'est nécessaire, et reste inactive le reste du temps.

Nous comptabilisons chaque utilisateur dès qu'il accède à votre site et enregistrons le nombre de visites par minute. Ce débit peut aller d'une visite par minute à la limite maximale prise en charge par votre forfait. De nombreux clients de CrowdHandler ne savent pas quel débit leur système peut supporter ; c'est pourquoi nous proposons une fonctionnalité d'ajustement automatique qui le détermine en temps réel.

  • Tant que le nombre d'utilisateurs reste inférieur à votre quota, nous autorisons leur accès sans vérification.
  • Dès que le nombre d'utilisateurs dépasse votre quota, nous commençons à rediriger les utilisateurs vers la salle d'attente.
  • Ils sont ensuite réintroduits sur votre site selon ce tarif.

Et voilà ! C'est ça, le lien entre le taux et la salle d'attente. Il est également intéressant de voir comment cela évolue sur une période plus longue :

  • Si le nombre d'utilisateurs tentant d'accéder à votre site dépasse systématiquement votre débit, ceux-ci se retrouveront alors dans une file d'attente qui ne cessera de s'allonger au fil du temps.
  • Dès que le nombre d'utilisateurs tentant d'accéder à votre site sera inférieur à votre débit, la file d'attente diminuera jusqu'à ce que la salle d'attente soit désactivée.

Rediriger le trafic vers

Nous avons donc vu que la « salle d’attente » permet de retenir les visiteurs et de les rediriger vers votre site web de manière contrôlée. Parfait ! Mais en quoi cela protège-t-il le site ? Eh bien, lorsque le trafic vers votre site dépasse le seuil autorisé, les visiteurs doivent être redirigés depuis votre site vers la « salle d’attente » — CrowdHandler peut alors les retenir et les laisser accéder au site de manière contrôlée.

Il existe plusieurs façons de rediriger le trafic vers CrowdHandler :

Votre trafic ne sera pas redirigé vers la « salle d'attente » tant que vous n'aurez pas ajouté l'une de ces intégrations permettant de rediriger les visiteurs vers cette dernière.

Il est maintenant temps de choisir votre implémentation.

Pour cette configuration rapide, nous allons choisir JavaScript.

La manière dont vous ajoutez le code JavaScript à votre site dépend de sa configuration.Nous proposons un guide dédié à l'installation du code JavaScript. Nous vous recommandons de le consulter attentivement. Sur votre tableau de bord, vous verrez un extrait de code JavaScript, prêt à être intégré à vos pages web. Il ressemblera à ceci :

<script src="https://wait.crowdhandler.com/js/latest/lite-validator/main.js?id=12533683a055c52b09e383c50a3e5c65b6a33ba17629af3166d6dedd647020a6"></script>

Vous pouvez cliquer sur l'icône du presse-papiers pour copier les balises de script.

Si vous modifiez du code ou du balisage, il est préférable de placer ce script avant toute autre balise de script.

Emplacement recommandé pour l'extrait de code JS dans le code HTML

Si vous utilisez un créateur de sites web (comme SquareSpace), recherchez une option du type « insertion de code » ou « HTML personnalisé » dans le panneau de configuration ou l'éditeur. Si cette option est disponible, insérez le script dans l'en-tête, avant tout autre script.

Exemple d'injection de code dans un éditeur de sites web tel que SquareSpace

Pour vérifier si le code est bien installé, je retourne sur mon site web et je clique sur quelques pages. Lorsque je reviens sur le tableau de bord, voici à quoi il ressemble désormais :

Affichage initial du tableau de bord après l'installation de JS

Ce graphique indique à quel moment vous avez quitté la salle d'attente.

Conseil n° 4 : L'intégration via JavaScript est rapide et pratique, et répond aux besoins de nombreux clients. Cependant, elle ne peut jamais être totalement sécurisée. Nous vous recommandons donc d'envisager une intégration via une API côté serveur une fois que votre site est opérationnel. Vous pouvez également opter pour une intégration via le DNS, via un CDN (Cloudflare, CloudFront) ou via WordPress, pour plus de sécurité et de commodité.

Modification du de la salle d'attente

Lorsque vos visiteurs sont redirigés vers la salle d'attente de CrowdHandler, ils voudront comprendre ce qui s'est passé et où ils se trouvent. Vous pouvez leur fournir davantage d'informations en modifiant la configuration de la salle d'attente. Depuis votre tableau de bord, sélectionnez l'icône de modification :

Bouton « Modifier » de la salle d'attente

Vous pouvez ici modifier le nom de la salle d'attente ainsi que le message :

Vous trouverez plus d'informations sur la fonction de chacun de ces champs dans l'article d'aide : Modifier une salle d'attente. Il existe également des options permettant de personnaliser le modèle (formules payantes uniquement) ou d'ajouter votre propre logo (toutes les formules) ; pour en savoir plus, consultez l'article : Ajouter des modèles.

Pour vérifier que cela a bien fonctionné :

  1. Rétablissez le taux d'entrée à 0 sur le tableau de bord
  2. Ouvrez un nouvel onglet en mode incognito/privé et rendez-vous sur mon site à partir de celui-ci. (Vous pourriez vous rendre directement dans la salle d'attente, mais cela vous permettra également de vérifier que vous y êtes bien redirigé.)

Le nom de la salle a été mis à jour et affiche désormais le message personnalisé suivant :

Salle d'attente personnalisée avec succèsConseil n° 5 : si vous êtes déjà passé par la « salle d'attente », vous devrez effectuer le test en mode incognito ou en session privée, ou bien sur un autre ordinateur.

Pour

Dans ce guide, nous avons montré :

  • La salle d'attente initiale
  • Comment utiliser le paramétrage du taux pour contrôler la redirection depuis la « salle d'attente » vers votre site web
  • Comment l'intégration achemine le trafic vers la « salle d'attente »
  • Comment personnaliser la salle d'attente pour fournir des informations utiles à vos visiteurs

Voici quelques étapes supplémentaires que vous pouvez suivre pour mieux comprendre le produit :

1. Intégration du code JavaScript

2. Modification d'une salle d'attente

3. Mécanismes de file d'attente

4. Les bases de l'intégration d'API