WebMirage

Adversariale Bilder kapern Web-Agenten vom visuellen Grounding bis zur Browser-Ausführung

Wanjing Han, Levi Taiji Li, Mu Zhang, Yue Jiang, Guanhong Tao — University of Utah

WebMirage ist ein Red-Teaming-Framework für vision-grounded Web-Agenten. Es erzeugt lokalisierte adversariale Perturbationen auf angreiferkontrollierten Webseitenbildern (z. B. einem Produkt-Thumbnail oder einem Profilfoto), die den Agenten dazu bringen, das Element des Angreifers auszuwählen und die entsprechende Browser-Aktion auszuführen, und zwar über verschiedene Webseiten-Renderings hinweg. Der Angriff wird End-to-End formuliert, vom visuellen Grounding bis zur Browser-Ausführung, und nicht allein auf der Model-Inferenz-Ebene.

Zwei Komponenten ermöglichen dies:

• Role-Slot-Abstraktion und Webseiten-Rekomposition — modelliert die Konkurrenz zwischen dem Element des Angreifers und seinen Begleitelementen, indem Seiten mit variierenden Begleitmengen und Slot-Positionen rekomponiert werden, sodass die Perturbation auf ungesehene Renderings generalisiert.
• Execution-aligned Supervision — eine CodeQL-Datenflussanalyse des Post-Processing-Codes des Agenten identifiziert, welche Output-Tokens tatsächlich die ausgeführte Aktion bestimmen, und die Optimierung wird nur auf diesen Tokens überwacht.

Das Framework wird gegen SeeAct- und VisualWebArena-Agenten über sechs VLM-Backbones (LLaVA, MiniCPM-o, Phi-3 Vision und andere) evaluiert. Die vollständige Evaluation findet sich im Paper.

---

Repository-Layout

.
├── src/            # Perturbation optimization, one subdirectory per backbone
│   ├── LLaVA/
│   ├── MiniCPM-o/
│   └── Phi-3-vision/
├── scripts/        # Training / evaluation launch scripts, one subdirectory per backbone
├── dataflow/       # CodeQL query pack for agent dataflow analysis (DataflowAnalysis.ql)
├── data/           # Recomposed training / test screenshots and conversation templates
└── test/           # Pre-generated clean and perturbed samples for quick verification

---

Voraussetzungen

Die Basismodelle müssen vor der Verwendung dieses Frameworks manuell eingerichtet werden.

Da die Backbones widersprüchliche Bibliotheksanforderungen haben, benötigt jedes eine eigene Umgebung und lokal heruntergeladene Gewichte.

1. MiniCPM-o

• Repo: OpenBMB/MiniCPM-o
• Setup: Klone das Repo, erstelle eine dedizierte Umgebung (z. B. conda create -n minicpm) und installiere die Abhängigkeiten.
• Gewichte: Lade die offiziellen Gewichte lokal herunter und notiere den Pfad.

2. LLaVA

• Repo: haotian-liu/LLaVA
• Setup: Klone das Repo und erstelle eine dedizierte Umgebung (z. B. conda create -n llava).
• Gewichte: Lade die LLaVA-v1.5/v1.6-Gewichte lokal herunter und notiere den Pfad.

3. Phi-3 Vision

• Repo: microsoft/Phi-3-vision-128k-instruct
• Setup: Installiere die kompatible transformers-Version in einer dedizierten Umgebung.
• Gewichte: Lade die Phi-3-vision-128k-instruct-Gewichte lokal herunter.

---

Schnelle Verifikation (Phi-3 Vision)

Ein minimaler Test führt Inferenz sowohl auf sauberen als auch auf perturbierten Screenshots aus und vergleicht die Auswahlen des Agenten nebeneinander.

Hinweis: Dieser Test erfordert Phi-3 Vision (siehe Voraussetzungen §3). Die bereitgestellten perturbierten Bilder wurden für Phi-3 optimiert; Testdaten für andere Backbones können mit den Trainingsskripten in scripts/ generiert werden.

Testdaten

Vorgenerierte Testfälle befinden sich in test/:

test/
├── clean_fix_slot/         # Clean screenshots, target in a fixed slot position
├── clean_multi_slot/       # Clean screenshots, target across multiple slot positions
├── perturbed_fix_slot/     # Perturbed screenshots (ε=16/255), target in a fixed slot
├── perturbed_multi_slot/   # Perturbed screenshots (ε=16/255), target across multiple slots
├── conv.json               # Conversation data (system prompt, user query, grounding prompt)
└── verify.py               # Runs inference on clean vs. perturbed and compares results

Die fix_slot-Fälle testen Begleitvariation (Zielposition fest, umgebende Elemente variieren); die multi_slot-Fälle testen Begleitvariation und Positionsverschiebung gleichzeitig.

Test ausführen

conda activate phi3vision

# Fixed slot position
python test/verify.py \
    --model-path /path/to/Phi-3-vision-128k-instruct \
    --conv-path test/conv.json \
    --clean-image test/clean_fix_slot/sample_0.png \
    --perturbed-image test/perturbed_fix_slot/sample_0.png

# Varying slot positions
python test/verify.py \
    --model-path /path/to/Phi-3-vision-128k-instruct \
    --conv-path test/conv.json \
    --clean-image test/clean_multi_slot/sample_0.png \
    --perturbed-image test/perturbed_multi_slot/sample_0.png

Erwartete Ausgabe

Das Skript gibt eine Vergleichstabelle aus, die für jeden Testfall das unter sauberer vs. perturbierter Eingabe ausgewählte Element zeigt. Bei sauberen Screenshots sollte der Agent den am besten passenden Kandidaten auswählen; bei perturbierten Screenshots sollte er konsistent den angreiferkontrollierten Kandidaten auswählen.

---

Optimierung einer Perturbation (LLaVA-Beispiel)

Mit einer dedizierten Conda-Umgebung für jeden Backbone verwendet der folgende Workflow LLaVA als Beispiel.

1. LLaVA klonen

Die Skripte referenzieren den offiziellen LLaVA-Code aus deinem Home-Verzeichnis (~/):

cd ~
git clone https://github.com/haotian-liu/LLaVA.git

2. Trainingsskript konfigurieren

Öffne scripts/LLaVA/train_with_mask.sh und setze jeden Pfad (Modellgewichte, Trainingsdaten, Konversationsvorlage, Maske, Ausgabeverzeichnis) passend zu deinem lokalen Setup.

3. Ausführen

bash scripts/LLaVA/train_with_mask.sh

Datenformat

Trainingsdaten liegen unter data/<scenario>/, mit rekomponierten Screenshots und einer train_samples.json-Konversationsdatei. Der Image-Token-Platzhalter in der Konversationsdatei muss zum Ziel-Backbone passen:

Backbone	Platzhalter
MiniCPM-o	(<image>./</image>)\n
LLaVA	<image>\n
Phi-3	<|image_1|>\n

---

End-to-End-Agenten-Evaluation

Die End-to-End-Evaluation erfordert die Ziel-Agenten-Frameworks.

SeeAct

• Repo: OSU-NLP-Group/SeeAct
• Setup: Klone das Repo und folge den offiziellen Installationsanweisungen.
• Verwendung: Die Evaluation verwendet das im Paper beschriebene clientseitige Asset-Replacement-Protokoll. Siehe scripts/seeact/.

VisualWebArena

• Repo: web-arena-x/visualwebarena
• Setup: Folge den offiziellen Anweisungen zum Einrichten der Sandbox, einschließlich der Bereitstellung der OneStopShop-Shopping-Seite.
• Verwendung: Siehe scripts/visualwebarena/ für Evaluationsskripte mit sowohl Accessibility-Tree- als auch Set-of-Mark-Beobachtungsmodi.

Datenflussanalyse

dataflow/DataflowAnalysis.ql ist die CodeQL-Abfrage, mit der nachverfolgt wird, welche Modell-Output-Tokens in die ausgeführte Browser-Aktion im Post-Processing-Code eines Agenten fließen. Führe sie gegen den Quellcode des Ziel-Agenten mit der CodeQL CLI unter Verwendung der Pack-Definition in dataflow/codeql-pack.yml aus.

---

Ethik

Alle Experimente mit öffentlichen Websites im Paper verwenden clientseitiges Asset-Replacement: Adversariale Bilder werden nur in der lokalen Browser-Ansicht des Agenten ersetzt, und es werden keine Inhalte auf eine Website eines Drittanbieters hochgeladen oder dort verändert. Bitte verwende dieses Framework nur für defensive Forschung.

Zitation