Guide de démarrage rapide : Prendre le contrôle de l'environnement Mbbrowser

Ce chapitre fournit des scripts complets et exécutables pour trois langages. Choisissez celui avec lequel vous êtes le plus familier. La logique de base reste identique : demander l'adresse ws à l'ApiServer, puis utiliser connectOverCDP pour prendre le contrôle de Mbbrowser.

---

Méthode 1 : Version JavaScript / Node.js

Créez un fichier nommé start.js :

const { chromium } = require('playwright');
const axios = require('axios');

// ============================
// Configuration (Remplissez avec vos infos réelles)
// ============================
const API_URL    = 'http://127.0.0.1:8186';
const SESSION_ID = 'remplacer_par_votre_session_id';   // Clic droit sur l'environnement Mbbrowser → Copier l'ID de l'environnement

async function main() {
  // ── Étape 1 : Dire à l'ApiServer d'ouvrir un environnement spécifique ────────
  console.log('⏳ Ouverture de l\'environnement Mbbrowser...');
  let wsEndpoint;
  try {
    const response = await axios.post(`${API_URL}/api/v1/browser/start`, {
      Session_ID: SESSION_ID
    });
    if (response.data.code !== 0) {
      console.error('❌ Échec du démarrage de l\'environnement :', response.data.message);
      return;
    }
    // ── Étape 2 : Extraire l'adresse WebSocket (champ spécifique à Playwright) ──
    wsEndpoint = response.data.data.ws;
    console.log('✅ Environnement ouvert. Adresse ws :', wsEndpoint);
  } catch (err) {
    console.error('❌ Impossible de se connecter à l\'ApiServer. Assurez-vous qu\'il est en cours d\'exécution !', err.message);
    return;
  }

  // ── Étape 3 : Utiliser connectOverCDP pour prendre le contrôle ─────────────────
  const browser = await chromium.connectOverCDP(wsEndpoint);
  console.log('🎉 Prise de contrôle par Playwright réussie !');

  try {
    // ── Étape 4 : Obtenir le contexte et la page actuels ────────────────────
    // Les environnements Mbbrowser ont un contexte par défaut ; utilisez le premier.
    const context = browser.contexts()[0];
    const page    = context.pages()[0] || await context.newPage();

    // ── Étape 5 : Exécuter les opérations commerciales ─────────────────────
    await page.goto('https://www.mbbrowser.com', { waitUntil: 'domcontentloaded' });
    console.log('📄 Titre de la page actuelle :', await page.title());

    // Attendre 3 secondes pour l'observation
    await page.waitForTimeout(3000);

    console.log('✅ Exécution du script terminée !');
  } finally {
    // Déconnecter Playwright (la fenêtre Mbbrowser continuera de s'exécuter)
    await browser.close();
  }
}

main().catch(console.error);

Exécuter :

node start.js

---

Méthode 2 : Version Python

Créez un fichier nommé start_playwright.py :

import requests
from playwright.sync_api import sync_playwright

# ============================
# Configuration
# ============================
API_URL    = "http://127.0.0.1:8186"
SESSION_ID = "remplacer_par_votre_session_id"


def get_ws_endpoint(session_id: str) -> str or None:
    """Appelle l'ApiServer de Mbbrowser pour démarrer l'environnement et renvoyer l'adresse ws"""
    print("⏳ Ouverture de l'environnement Mbbrowser...")
    try:
        resp = requests.post(
            f"{API_URL}/api/v1/browser/start",
            json={"Session_ID": session_id},
            timeout=30
        )
        data = resp.json()
    except requests.exceptions.ConnectionError:
        print("❌ Impossible de se connecter à l'ApiServer ! Assurez-vous qu'apiserver.exe est en cours d'exécution.")
        return None

    if data.get("code") != 0:
        print(f"❌ Échec du démarrage de l'environnement : {data.get('message')}")
        return None

    ws = data["data"]["ws"]
    print(f"✅ Environnement ouvert. Adresse ws : {ws}")
    return ws


def main():
    ws_endpoint = get_ws_endpoint(SESSION_ID)
    if not ws_endpoint:
        return

    with sync_playwright() as p:
        # ── connect_over_cdp pour prendre le contrôle ─────────────────
        browser = p.chromium.connect_over_cdp(ws_endpoint)
        print("🎉 Prise de contrôle par Playwright réussie !")

        # Prendre le BrowserContext par défaut existant (préserve tous les cookies, le stockage, etc.)
        context = browser.contexts[0]
        # Prendre la première page ; en créer une si aucune n'existe
        page = context.pages[0] if context.pages else context.new_page()

        # ── Exécuter les opérations commerciales ──────────────────────────────
        page.goto("https://www.mbbrowser.com", wait_until="domcontentloaded")
        print(f"📄 Titre de la page actuelle : {page.title()}")

        page.wait_for_timeout(3000)
        print("✅ Exécution du script terminée !")

        browser.close()


if __name__ == "__main__":
    main()

Exécuter :

python start_playwright.py

---

Méthode 3 : Version Java

NOTE

Pour la version Java, nous recommandons d'utiliser le Gestionnaire de scripts d'automatisation du client Mbbrowser, qui gère automatiquement les bundles JAR de Playwright et l'extraction du pilote. Le code suivant est directement utilisable dans l'éditeur de scripts.

import com.microsoft.playwright.*;
import java.net.URI;
import java.net.http.*;
import org.json.*;

public class MBPlaywright {
    static final String API_URL    = "http://127.0.0.1:8186";
    static final String SESSION_ID = "remplacer_par_votre_session_id";

    public static void main(String[] args) throws Exception {
        // ── Étape 1 : Appeler l'ApiServer pour démarrer l'environnement ──────────────
        System.out.println("⏳ Ouverture de l'environnement Mbbrowser...");
        HttpClient httpClient = HttpClient.newHttpClient();
        String body = "{\"Session_ID\":\"" + SESSION_ID + "\"}";
        HttpRequest request = HttpRequest.newBuilder()
            .uri(URI.create(API_URL + "/api/v1/browser/start"))
            .header("Content-Type", "application/json")
            .POST(HttpRequest.BodyPublishers.ofString(body))
            .build();
        HttpResponse<String> response = httpClient.send(
            request, HttpResponse.BodyHandlers.ofString()
        );

        JSONObject data   = new JSONObject(response.body());
        String wsEndpoint = data.getJSONObject("data").getString("ws");
        System.out.println("✅ Environnement ouvert. ws : " + wsEndpoint);

        // ── Étape 2 : Prise de contrôle par Playwright connectOverCDP ───────────────
        // Définir pour ignorer les téléchargements de navigateurs intégrés
        System.setProperty("playwright.skip.browser.download", "1");

        try (Playwright playwright = Playwright.create()) {
            Browser browser = playwright.chromium().connectOverCDP(wsEndpoint);
            System.out.println("🎉 Prise de contrôle par Playwright réussie !");

            BrowserContext context = browser.contexts().get(0);
            Page page = context.pages().isEmpty()
                ? context.newPage()
                : context.pages().get(0);

            page.navigate("https://www.mbbrowser.com");
            System.out.println("📄 Titre de la page actuelle : " + page.title());

            Thread.sleep(3000);
            System.out.println("✅ Exécution du script terminée !");

            browser.close();
        }
    }
}

---

Analyse ligne par ligne

connectOverCDP vs launch : La différence critique

// ❌ Pratique Playwright standard : Crée une nouvelle fenêtre Chrome vierge
const browser = await chromium.launch();

// ✅ Pratique Playwright Mbbrowser : Prend le contrôle d'un environnement d'empreinte existant
const browser = await chromium.connectOverCDP(wsEndpoint);

Comparaison	launch() standard	connectOverCDP() de Mbbrowser
État du navigateur	Tout neuf, vide	Empreintes complètes, proxy et cookies présents
Conséquence	Le site cible voit un bot Chrome nu	Le site cible voit un "utilisateur réel"
Multi-compte	Impossible à différencier	Identifié précisément via le Session_ID

Pourquoi utiliser data.ws au lieu de data.http ?

Champ	Exemple de format	Framework adapté
data.http	127.0.0.1:9222	Selenium (debuggerAddress)
data.ws	ws://127.0.0.1:9222/devtools/browser/xxx	Playwright / Puppeteer ✅

Le connectOverCDP de Playwright nécessite l'adresse complète ws://....

browser.contexts()[0] : Ne créez pas de nouveaux contextes

// ❌ MAUVAIS : Crée un nouveau contexte ; les cookies et le stockage de Mbbrowser seront perdus.
const context = await browser.newContext();

// ✅ CORRECT : Utilisez le contexte existant de Mbbrowser (préserve l'état du compte).
const context = browser.contexts()[0];

---

Dépannage

❓ Erreur : connect ECONNREFUSED 127.0.0.1:8186

L'ApiServer n'est pas démarré ou le port est incorrect. Assurez-vous qu'apiserver.exe est en cours d'exécution dans sa fenêtre de terminal.

❓ Erreur : Browser closed ou Target page, context or browser has been closed

L'environnement Mbbrowser a été fermé (expiration ou manuellement). Appelez à nouveau /api/v1/browser/start.

❓ browser.contexts() renvoie un tableau vide

Lorsqu'un environnement est ouvert pour la première fois, le contexte par défaut peut mettre un moment à s'initialiser. Ajoutez une courte attente :

// Attendre que le contexte apparaisse (jusqu'à 5 secondes)
let context;
for (let i = 0; i < 50 && !browser.contexts().length; i++) {
  await new Promise(r => setTimeout(r, 100));
}
context = browser.contexts()[0];

❓ browser.close() ferme-t-il la fenêtre Mbbrowser ?

En mode connectOverCDP, browser.close() déconnecte seulement le lien Playwright — il ne ferme pas la fenêtre Mbbrowser. Pour la fermer, appelez l'interface d'arrêt :

await axios.post(`${API_URL}/api/v1/browser/stop`, { Session_ID: SESSION_ID });

---

TIP

Prêt à coder ? Le prochain chapitre Référence API de base vous apprendra à utiliser les puissantes API Locator et Page de Playwright.