Three Chicks & A Wick: Production eCommerce with AI Security

Headless Shopify Architecture: Best of Both Worlds

Before diving into the AI security innovation, it's worth understanding the foundation. This is a headless Shopify eCommerce platform—we built a custom Next.js 15 storefront that leverages Shopify's powerful backend through three distinct APIs:

Shopify Storefront API handles product catalog, cart management, and checkout flows for anonymous users. Shopify Admin API powers the custom admin panel with order fulfillment, inventory management, and business analytics. Customer Account API enables authenticated users to view their order history and saved custom candles.

This headless approach gave us the flexibility to build custom features (like AI candle generation) while retaining Shopify's battle-tested checkout, payment processing, and fulfillment infrastructure. The customer gets a premium, tailored experience. The business gets enterprise-grade eCommerce reliability.

The Guardian-Sage-Creator Security Pipeline: AI Security with Psychological Warfare

At the heart of the platform is the Magic Request feature—customers describe their dream candle in natural language, and our AI generates a custom recipe with precise fragrance percentages, materials, and a poetic description. But opening an AI text input to the internet is dangerous.

We implemented the Guardian-Sage-Creator Security Pipeline, a 5-Lambda system orchestrated by AWS Step Functions. Instead of binary allow/block decisions, the system analyzes threats through multiple lenses and generates personalized responses using a Guardian-Sage-Creator archetype framework.

1. Lambda 1: input-sanitizer — Runs regex-based threat detection in under 50ms. Flags patterns like 'ignore previous instructions,' 'show system prompt,' script tags, and SQL injection attempts.
2. Lambda 2: ai-security-validator — Uses Google Gemini 2.5 Pro to perform deep threat analysis with psychological profiling. Determines sophistication level (basic, intermediate, advanced, expert), attack intent (malicious, curious, confused, testing), and recommends actions (ALLOW, MODIFY, CUSTOM_RESPONSE, BLOCK).
3. Lambda 3: ai-response-generator ⭐ The Innovation Core — When threats are detected, instead of generic error messages, Gemini 2.5 Pro generates charming, personalized counter-responses that acknowledge the attacker's skills, redirect their creativity, and invite them to create something instead. Example: 'Ah, I see you've mastered the art of linguistic misdirection! Your understanding of AI vulnerabilities is quite sophisticated. That same analytical creativity could craft something extraordinary: imagine a candle that captures the essence of a perfectly executed exploit…'
4. Lambda 4: inventory-fetcher — Runs in parallel with security validation, fetching in-stock fragrance inventory from DynamoDB. Completely isolated from user input to ensure zero attack surface.
5. Lambda 5: ai-processor — Receives only pre-validated, sanitized input plus inventory context. Generates the candle recipe using Gemini 2.5 Pro with strict output formatting, then applies final HTML sanitization before saving to DynamoDB.

Defense in Depth: The Three-Layer Security Strategy

The architecture embodies defense-in-depth principles. Every user-generated prompt flows through deterministic sanitization (regex), adaptive AI analysis (Gemini security validation), and isolated inventory access (never exposed to user input). If an attacker somehow bypasses the first two layers, the output still goes through HTML sanitization, script tag removal, and safe rendering enforcement.

The psychological warfare approach serves dual purposes: it protects the business while strengthening the brand. Attackers leave with a memorable experience they want to share—'you have to see how this AI responded to me!'—turning security incidents into viral marketing opportunities. Zero successful attacks. Potential for customer acquisition from the most technically sophisticated visitors.

Real-Time Cart Synchronization: Solving the Post-Checkout Problem

After customers complete checkout, the cart UI was getting stuck in an 'adding' state because the frontend didn't know the order had been placed. This required a defense-in-depth approach with three independent layers, each handling different failure scenarios.

1. Layer 1 (Primary): Cart Attributes in Shopify Orders — When a cart is created or updated, we set _cartId as a cart attribute using Shopify's cartAttributesUpdate mutation. Shopify automatically includes cart attributes in order data as note_attributes. Our webhook extracts the cartId from the order and publishes a cart clearance event to AWS AppSync. This works for both logged-in and anonymous users with zero race conditions.
2. Layer 2 (Fallback): DynamoDB Cart Registry — If the cartId isn't found in order attributes (edge cases like legacy carts created before this implementation), the webhook looks up the cart from a DynamoDB registry that maps customerId → cartId. This provides redundancy for authenticated users.
3. Layer 3 (Safety Net): Empty Cart Detection — The frontend checks if the cart is empty on page load and after successful mutations. If empty, it automatically clears localStorage and resets the UI. This is the primary mechanism for anonymous users who return to the site after completing checkout elsewhere.

User Experience: Different Strategies for Different Users

Logged-in users get real-time cart clearing via AppSync GraphQL subscriptions. The moment their order completes, all open browser tabs receive a WebSocket event, clear the cart simultaneously, and update the UI—no refresh needed. Anonymous users rely on page-load detection. When they return to the site after checkout, the empty cart check fires, clears localStorage, and resets the UI.

This approach avoids unnecessary complexity. We considered using BroadcastChannel for cross-tab communication with anonymous users, but the added implementation complexity provided marginal benefit since anonymous users typically complete checkout and leave. The page-load detection handles their return perfectly.

End-to-End Magic Request Pipeline

The Magic Request feature processes custom candle creation in under 10 seconds through a choreographed pipeline:

1. Step 1: User submits prompt — e.g., 'a cozy library with hints of old books, vanilla, and a crackling fireplace'
2. Step 2: Security validation — Dual-layer analysis (regex + AI) determines if input is safe
3. Step 3: Parallel processing — Security data and fragrance inventory fetched concurrently for performance
4. Step 4: AI generation — Gemini 2.5 Pro creates a custom candle with fragrance percentages, burn time, mood, and poetic description
5. Step 5: Real-time polling — Frontend polls DynamoDB every 2 seconds for job status
6. Step 6: Cross-tab notification — When ready, BroadcastChannel alerts all open tabs with a toast notification
7. Step 7: Auto-add to cart — Candle automatically added to Shopify cart with _creation_job_id attribute for recipe lookup during fulfillment

Admin Panel & Order Fulfillment Integration

The custom admin panel provides complete order management through the Shopify Admin API. When viewing orders, the panel extracts _creation_job_id from line item properties, queries DynamoDB to retrieve the full aiJson recipe, and displays exact fragrance percentages for the fulfillment team.

Admin features include fragrance inventory management (CRUD operations via AppSync GraphQL), manual review queue for community-shared candles, and real-time order status updates. The entire fulfillment workflow happens within the custom panel—no need to switch to Shopify admin.