Juragan Midtrans Online Payments

In addition to WhatsApp checkout, the theme can accept online payments (QRIS, Virtual Account & E-Wallet) via the Midtrans payment gateway. Payment funds go directly to your Midtrans account. The backend uses Cloudflare Worker (create-payment + notification endpoints).

Required Prerequisite: Automatic Order History

This feature cannot be used without Automatic Order History: the webhook from that guide serves as both an order recorder and a payment status receiver. Complete Automatic Order History first, including installing the webhook in the theme (step 5).

1. Requirements & Midtrans account

1. Midtrans account (to receive payments).
2. Cloudflare account (for Worker).
3. Google account (for Automatic Order History from the previous page).

In the Midtrans dashboard: activate Snap. Test using Sandbox (Development) first, then Production once the pattern is working. Copy the Server Key from Settings → Access Keys (according to the mode). Do not share the server key.

2. Create Worker code

Open the Cloudflare Worker Code Generator at https://tools.sugeng.id/juragan-worker/. Fill in the Server Key, mode (Sandbox/Production), Automatic Order History webhook URL (required, from the Automatic Order History page), and Store URL (redirect after successful payment). Click Generate Worker Code, then copy the code.

3. Deploy on Cloudflare

1. Cloudflare Dashboard → Workers & Pages → Create application → select Start with Hello World! → Deploy.
2. Click Edit code, delete all default code, replace with the generated code, click Deploy (Save and Deploy).
3. Copy the worker URL (https://<name>.<subdomain>.workers.dev).

4. Notification URL & ensure it's not blocked

1. In Midtrans Settings → Payment → Notification URL, fill in the endpoint: (your worker URL)/notification.
2. Ensure notifications are not blocked by Cloudflare Browser Integrity Check (error 1010). The safest way: use a custom domain for the worker AND create a WAF Custom Rule to bypass Browser Integrity Check specifically for the /notification path.

WARNING

Without this, successful payments will not be automatically marked as "Paid" (notifications are rejected before reaching the worker).

5. Connect to Order History

Ensure the Automatic Order History Apps Script is installed from the latest Sheet template (see Automatic Order History). The latest template already supports automatic order status updates (Paid). When generating the code in the generator (step 2), the Automatic Order History webhook URL field must be filled with your webhook URL (this value goes into the worker code as ORDER_WEBHOOK), so that settlement notifications change the status to Paid in the sheet.

6. Activate in the theme

1. Open the Settings Code Generator at https://tools.sugeng.id/juragan-setting/, Advanced features group.
2. Turn on the Online Payment (Midtrans) toggle and fill in the Cloudflare Worker URL = https://<name>.<subdomain>.workers.dev (only the base URL; /create-payment is added automatically).
3. Generate Code, copy, then re-install the settings code in the theme: Layout → "Template Settings Code" widget.
4. The "Online Payment (QRIS, Virtual Account & E-Wallet)" method will appear in the checkout dropdown.

7. Test & Production

• Sandbox test: ensure generation uses Sandbox mode (code contains CFG.IS_PRODUCTION = false), test orders. Ensure redirection to Snap, status becomes Paid in the sheet, and Telegram notifications are received.
• Production: regenerate with Production Server Key + Production mode (CFG.IS_PRODUCTION = true), redeploy with the new code, test once with a real transaction.

Troubleshooting

Symptom	Possible cause	Solution
"Online Payment" method does not appear	History webhook not installed, or old theme version	Complete Automatic Order History first (webhook is mandatory); ensure the theme is the latest version
Payment failed "Payment failed"	Worker URL incorrect / worker offline / CORS	Check Cloudflare Worker URL is correct; worker is online; server key matches the mode
Status does not become Paid	Notifications blocked by WAF or ORDER_WEBHOOK/Notification URL is incorrect	Check WAF bypass for /notification; ensure webhook is filled in the generator
Incorrect redirect after payment	Store URL not filled during generation	Regenerate with the correct Store URL