secure-checkout

What this skill does

# Secure Checkout

## Overview

Payment pages are the highest-value target for attackers — a single XSS vulnerability can lead to Magecart-style card skimming attacks that steal thousands of card numbers. Securing checkout requires enforcing TLS everywhere, implementing strict Content Security Policies (CSP) to prevent script injection, using payment tokenization to minimize PCI scope, and removing non-essential third-party scripts from payment pages. The good news: Shopify and BigCommerce handle most of this infrastructure automatically. WooCommerce merchants need to configure hosting and install security plugins. Custom storefronts require implementing all of these controls from scratch.

## When to Use This Skill

- When building or auditing a checkout flow that accepts payment information
- When a penetration test or security scan surfaces XSS, CSP, or header vulnerabilities on payment pages
- When reviewing third-party script loading on pages that have access to payment form context
- When preparing for PCI DSS SAQ A-EP or SAQ D compliance assessment
- When migrating from a hosted payment page to a custom UI (increases PCI scope)

## Core Instructions

### Step 1: Understand your checkout security responsibility by platform

| Platform | HTTPS / TLS | CSP Headers | Payment Tokenization | Third-Party Script Control |
|----------|-------------|-------------|---------------------|---------------------------|
| **Shopify** | Automatic — Shopify provisions and renews SSL certificates | Shopify manages checkout CSP; your theme pages need review | Shopify Payments and all gateway integrations use tokenization | Use Shopify's Script Manager and Customer Events to control what loads on checkout |
| **WooCommerce** | Your hosting responsibility — install SSL from Let's Encrypt or your host | Your server responsibility — configure via hosting or plugin | Determined by your gateway choice (Stripe Elements = SAQ A-EP) | WordPress plugin and theme scripts load globally; use conditional loading to exclude checkout |
| **BigCommerce** | Automatic — BigCommerce provisions SSL and enforces HTTPS | BigCommerce manages checkout CSP for hosted checkout | Handled by your payment gateway choice through BigCommerce checkout | BigCommerce Script Manager controls third-party script placement |
| **Custom / Headless** | Your infrastructure responsibility | Your application responsibility — implement per-request CSP with nonces | Implement with Stripe Elements or Braintree Drop-in UI | Full control and full responsibility — must implement explicitly |

### Step 2: Platform-specific checkout security setup

---

#### Shopify

Shopify's hosted checkout is one of the most secure available — it runs on Shopify's own domain (`checkout.shopify.com` or your custom domain with SSL), uses Shopify Payments tokenization, and is protected by Shopify's CDN and WAF.

**HTTPS enforcement:**
- Shopify automatically provisions free SSL certificates for all stores and custom domains
- Go to **Online Store → Domains** to verify SSL is active on your custom domain
- Enable **Redirect all traffic to HTTPS** under **Online Store → Preferences → Checkout and accounts**

**Third-party scripts on checkout:**
Shopify's checkout extension model (Checkout Extensibility) limits what can run on the checkout page — this is by design for PCI compliance.

1. Go to **Settings → Customer events** to manage tracking pixels and scripts
2. Scripts added via Customer Events run in a sandboxed context and cannot access payment data
3. **Do not inject JavaScript into the checkout page via theme code or ScriptTag API** — this is prohibited for SAQ A compliance and may be blocked by Shopify

**Theme security review:**
1. Go to **Online Store → Themes → Edit code**
2. Search your theme for any references to `document.cookie`, `localStorage`, or `fetch` on cart/checkout pages — these are red flags if you did not add them intentionally
3. Review installed apps: go to **Settings → Apps and sales channels** and remove apps you no longer use; each installed app can inject scripts into your storefront

**Admin account security (reduces attack surface):**
1. Go to **Settings → Users and permissions**
2. Require 2FA for all staff accounts — a compromised admin account is the most common way attackers modify checkout behavior
3. Limit staff access to only the permissions needed for their role

---

#### WooCommerce

WooCommerce checkout security depends almost entirely on your hosting configuration and payment gateway. Your hosting provider is responsible for TLS, and the gateway you choose determines whether card data ever touches your server.

**Step 1 — Force HTTPS on your store:**
1. In your WordPress hosting control panel (cPanel, Kinsta, WP Engine), enable free SSL via Let's Encrypt or your host's built-in certificate
2. Install **Really Simple SSL** (free plugin) — it forces HTTPS sitewide, updates internal links, and fixes mixed content warnings in one step
3. After activating, verify at **Settings → SSL** that the redirect is active and no mixed content warnings appear

**Step 2 — Choose a payment gateway that keeps card data off your server:**
- **Stripe (WooCommerce Stripe Payment Gateway)** — uses Stripe Elements; card data entered in a Stripe iframe never touches your server (SAQ A-EP)
- **Stripe Checkout (redirect)** — customer is redirected to Stripe's hosted page; even simpler (SAQ A)
- **PayPal Standard** — redirect to PayPal; SAQ A
- Avoid any gateway that requires your server to receive raw card numbers

**Step 3 — Install security plugins:**
1. Install **Wordfence Security** (free): go to **Wordfence → Firewall** and set protection level to "Extended Protection" — this adds a WAF rule at the WordPress application layer
2. Install **WP Activity Log** (~$99/year) or **Simple History** (free): logs all admin actions including order edits, plugin installs, and setting changes
3. Go to **Settings → Discussion** — disable comments on checkout/cart pages if enabled (reduces XSS attack surface)

**Step 4 — Remove scripts from checkout pages:**
WooCommerce loads all active plugins on every page by default. Use **Asset CleanUp Pro** ($25 one-time) or add conditional PHP to prevent non-essential scripts from loading on checkout:

Go to **WooCommerce → Settings → Advanced** and verify:
- Debug logging is **off** (`WP_DEBUG` must be `false` in `wp-config.php` in production)
- No custom code logs order data or payment details

**Step 5 — Configure SSL security headers via hosting or plugin:**
1. If using Nginx hosting (Kinsta, WP Engine, Nexcess), ask your host to add HSTS and X-Frame-Options headers — these are commonly pre-configured on managed WordPress hosts
2. Alternatively, install **HTTP Headers** (free plugin) to add security headers via WordPress without editing server config

---

#### BigCommerce

BigCommerce's hosted checkout is PCI-DSS Level 1 certified and handles TLS, CSP, and payment tokenization automatically when you use a supported gateway.

**HTTPS enforcement:**
- BigCommerce automatically provisions and renews SSL for all stores
- Go to **Store Setup → Store Settings → Security** — verify **Force secure checkout** is enabled
- Go to **Storefront → SSL Certificate** to confirm your custom domain has SSL active

**Controlling third-party scripts:**
1. Go to **Storefront → Script Manager**
2. Review all installed scripts — for each script, check the **Placement** setting
3. For scripts that do not need to run on checkout (analytics, advertising, chat), set **Placement** to exclude checkout pages
4. Scripts in Script Manager run in the storefront context; BigCommerce's checkout itself is protected by a separate, more restrictive CSP

**Checkout payment security:**
- BigCommerce Payments and certified payment gateways (Stripe, Braintree, PayPal) use tokenization — card data never touches BigCommerce's or your application servers
- Go to **Store Setup → Payments** and review your active gateway — ens