Nachrichten mit Mock-JSON in der Vorschau testen

Simulieren Sie API- oder Entry-Style-JSON in Ihrer Nachricht mit capture und json_parse, um Liquid und Layout in der Vorschau des Nachrichten-Editors zu validieren, bevor Sie eine Campaign starten, ein Canvas triggern oder Connected Content live aufrufen.

Über dieses Beispiel

Flash & Thread, eine fiktive Bekleidungs-Einzelhandelsmarke, erstellt Nachrichten, die auf Connected-Content-Antworten, Canvas-Kontextvariablen oder Array-of-Objects-Profildaten basieren. Echte API-Aufrufe auszulösen oder Campaigns für jede Iteration zu starten, verlangsamt die Entwicklung.

Dieses Muster bettet eine simulierte JSON-Payload in den Nachrichtentext ein, speichert sie mit capture und parst sie anschließend mit json_parse, sodass Liquid in der Vorschau auf strukturierte Felder zugreifen kann – ohne einen Live-Connected-Content-Aufruf, einen API-getriggerten Canvas-Entry oder einen Testversand.

Verwenden Sie dieses Muster während der Nachrichtenentwicklung. Es ersetzt keine End-to-End-Tests mit echten Triggern, Testversendungen oder Vorschau von Nutzerpfaden in Canvas.

Überlegungen

• Dieser Ansatz unterstützt die Vorschau im Nachrichten-Editor während der Entwicklung. Führen Sie Testsendungen und Live-Pfad-Prüfungen durch, bevor Sie an Kund:innen ausliefern.
• Ein capture-Block allein speichert JSON als String. Referenzieren Sie Felder erst, nachdem Sie json_parse angewendet haben – andernfalls kann die Vorschauausgabe leer sein.
• Mock-JSON muss gültig sein. Ungültiges JSON führt dazu, dass json_parse fehlschlägt oder unerwartete Strukturen zurückgibt.
• Entfernen oder ersetzen Sie Mock-Blöcke vor dem Launch, oder schützen Sie Ihr Produktions-Liquid so, dass Mock-Daten nur in der Vorschau verwendet werden (zum Beispiel mit einem Kommentar-Flag, das Sie vor dem Go-live löschen).
• Die Liquid-Snippets in diesem Artikel sind Beispiele. Testen Sie sie in Ihren Kanälen und mit Ihren tatsächlichen Payload-Strukturen.
• Entfernen Sie für Connected-Content in der Produktion den Mock-Block und verwenden Sie Ihren Live-URL-Tag. Siehe API-Aufruf durchführen.

Setup

Dieses Beispiel simuliert eine produktlistenbasierte Antwort im Connected-Content-Stil für eine E-Mail, die über listings iteriert.

Schritt 1: Mock-JSON in der Nachricht erfassen

Verwenden Sie capture, um den JSON-String zu speichern. Verwenden Sie innerhalb des Blocks gültige JSON-Syntax (doppelte Anführungszeichen für Schlüssel und String-Werte).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

{% capture mock_response %}
{
  "success": true,
  "listings": [
    {
      "id": 45731,
      "name": "Summit Trail Jacket",
      "image_url": "https://example.com/images/trail-jacket.png",
      "price": {
        "actual": "89.00",
        "currency": "USD"
      },
      "link": "https://example.com/products/trail-jacket",
      "product_category": "Outerwear",
      "properties": {
        "size": "L",
        "colour": "Navy",
        "limited_edition": false
      },
      "out_of_stock": false
    }
  ]
}
{% endcapture %}

Schritt 2: JSON mit json_parse parsen

Weisen Sie die geparste Struktur einer Variablen zu, auf die Sie im restlichen Teil der Nachricht verweisen.

1

{% assign response_json = mock_response | json_parse %}

Ohne json_parse wird die Dot-Notation auf dem erfassten String (z. B. {{ mock_response.listings }}) in der Vorschau typischerweise leer dargestellt.

Schritt 3: Geparste Felder in Liquid referenzieren

Iterieren Sie über das geparste Array und rendern Sie Felder wie bei einer Live-API-Antwort.

1
2
3

{% for listing in response_json.listings %}
{{ listing.name }} — {{ listing.price.actual }} {{ listing.price.currency }}
{% endfor %}

Gehen Sie zum Abschnitt Vorschau im Nachrichten-Editor und überprüfen Sie, ob die Felder korrekt gerendert werden.

Schritt 4: Dasselbe Muster auf andere JSON-Strukturen anwenden

Verwenden Sie denselben capture- + json_parse-Ablauf, um Folgendes zu simulieren:

Ersetzen Sie Mock-Variablen durch Produktions-Liquid (Canvas-Kontextvariablen, angepasste Attribute oder Connected-Content-Tags), bevor Sie den Versand starten.

Verwandte Artikel

• Testnachrichten senden
• Nutzerpfade in Canvas in der Vorschau anzeigen
• Erweiterte Liquid-Filter (`json_parse`)
• Connected-Content
• Array von Objekten
• Kontextvariablen