Guide de déploiement Wonderweb sur Infomaniak

Architecture

┌─────────────────────────────────────────────────────────────┐
│                    Environnement local                       │
│  ┌──────────────┐  ┌──────────────┐  ┌──────────────────┐   │
│  │ Eleventy     │  │ Node.js      │  │ SQLite           │   │
│  │ (build)      │  │ server       │  │ (vectors.db)     │   │
│  └──────┬───────┘  └──────┬───────┘  └────────┬─────────┘   │
└─────────┼─────────────────┼───────────────────┼─────────────┘
          │                 │                   │
          │ deploy.js       │ SFTP manuel       │ copié avec
          │ (SSH)           │                   │ server/
          ▼                 ▼                   ▼
┌─────────────────────────────────────────────────────────────┐
│                       Infomaniak                             │
│  ┌──────────────────┐      ┌────────────────────────────┐   │
│  │ Hébergement Web  │      │ Hébergement Node.js        │   │
│  │ wonderweb.ch     │ ───► │ v2.wonderweb.ch/api        │   │
│  │ (site statique)  │      │ (API chatbot)              │   │
│  └──────────────────┘      └────────────────────────────┘   │
└─────────────────────────────────────────────────────────────┘

Prérequis

• Node.js 18+ installé localement
• Accès SSH configuré vers Infomaniak
• Clé API Infomaniak AI (dans le Manager Infomaniak > AI Tools)

1. Déploiement du Frontend (Eleventy)

Configuration locale

Créer .env à la racine du projet :

DEPLOY_USER = 'votre_user_ftp'
DEPLOY_HOST = 'xxxxx.ftp.infomaniak.com'
DEPLOY_AGENT = "/private/tmp/com.apple.launchd.xxx/Listeners"  # echo $SSH_AUTH_SOCK
DEPLOY_PATH = "/home/clients/xxx/web"

Pour trouver DEPLOY_AGENT, exécuter echo $SSH_AUTH_SOCK dans le terminal.

Commandes

# 1. Build du site statique
npm run build

# 2. Déploiement via SSH
npm run deploy

Le script deploy.js utilise ssh-deploy-release pour envoyer le dossier _site/ vers le serveur.

2. Déploiement du Backend (Node.js)

A. Configuration Infomaniak

1. Dans le Manager Infomaniak, créer un hébergement Node.js
2. Noter le chemin de déploiement (ex: /home/clients/xxx/sites/v2.wonderweb.ch)
3. Configurer le domaine/sous-domaine pointant vers cet hébergement

B. Transfert des fichiers

Copier le dossier server/ vers Infomaniak via SFTP (Cyberduck, FileZilla, etc.) :

server/
├── src/                      # Code source
├── scripts/                  # Scripts utilitaires
├── data/
│   └── chatbot-vectors.db    # Base SQLite (générée par npm run reindex)
├── package.json
├── package-lock.json
└── .env                      # À créer sur le serveur (NE PAS COMMIT)

C. Configuration serveur

Créer server/.env directement sur le serveur Infomaniak :

# Infomaniak définit PORT automatiquement, pas besoin de le spécifier
INFOMANIAK_API_KEY=votre_cle_api_infomaniak
INFOMANIAK_PRODUCT_ID=100044
CORS_ORIGIN=https://wonderweb.ch
DATABASE_PATH=./data/chatbot-vectors.db

D. Installation et démarrage

Via SSH sur le serveur :

cd /home/clients/xxx/sites/v2.wonderweb.ch
npm install
npm start

Infomaniak gère automatiquement le redémarrage du serveur Node.js (pas besoin de PM2).

3. Mise à jour du contenu chatbot

Modifier le contenu

1. Éditer les fichiers JSON dans _data/ :

   • chatbot-content.json - Contenu principal (services, about, contact)
   • projets.json - Liste des projets/réalisations
   • chatbotConfig.json - Prompt système et configuration du bot

2. Regénérer les vecteurs d'embedding :

cd server
npm run reindex

3. Transférer la nouvelle base server/data/chatbot-vectors.db vers le serveur

Modifier le prompt du chatbot

Éditer uniquement _data/chatbotConfig.json :

{
  "systemPrompt": "Tu es l'assistant de Wonderweb...",
  "welcomeMessage": "Bonjour ! Je suis...",
  "welcomeActions": ["Question 1", "Question 2"],
  ...
}

Puis rebuild et deploy le frontend :

npm run build && npm run deploy

4. Workflow complet de mise à jour

Mise à jour du code/design

# Modifications locales
git add . && git commit -m "Update"

# Build et deploy frontend
npm run build && npm run deploy

Mise à jour du contenu chatbot

# 1. Éditer les fichiers _data/*.json

# 2. Reindex les vecteurs
cd server && npm run reindex

# 3. Upload server/ vers Infomaniak (SFTP)

# 4. Redémarrer Node.js si nécessaire (via Manager Infomaniak)

5. URLs et endpoints

Endpoints API

6. Dépannage

Le chatbot ne répond pas

1. Vérifier que le serveur Node.js tourne : https://v2.wonderweb.ch/health
2. Vérifier les logs dans le Manager Infomaniak
3. Vérifier que INFOMANIAK_API_KEY est correcte

Erreur CORS

Vérifier que CORS_ORIGIN dans .env correspond au domaine du frontend.

Base de données vide

Exécuter npm run reindex dans le dossier server/ puis re-upload data/chatbot-vectors.db.

Fichiers clés