fix: World ID v4 proper flow - RP signature + v4 verify API

- Worker: POST /api/world-id/rp-signature (signRequest from @worldcoin/idkit-server)
- Worker: verify now forwards to POST /v4/verify/{rp_id} (not v2)
- Frontend: fetches RP signature before opening IDKitRequestWidget
- Frontend: passes rp_context + allow_legacy_proofs to widget
- Env: WORLD_ID_RP_ID in wrangler.toml, SIGNING_KEY as wrangler secret
- Follows official docs.world.org/world-id/idkit/integrate

Author: CloudLobster

package-lock.json

@@ -1,10 +1,11 @@
 import { useState, useEffect, useCallback } from 'react';
-import { IDKitRequestWidget, useIDKitRequest, orbLegacy } from '@worldcoin/idkit';
-import type { IDKitResult } from '@worldcoin/idkit';
+import { IDKitRequestWidget, orbLegacy } from '@worldcoin/idkit';
+import type { IDKitResult, RpContext } from '@worldcoin/idkit';
 
 const API_BASE = (typeof window !== 'undefined' && window.location.hostname === 'localhost') ? '' : 'https://api.basemail.ai';
 const WORLD_ID_APP_ID = 'app_7099aeba034f8327d91420254b4b660e';
 const WORLD_ID_ACTION = 'verify-human';
+const WORLD_ID_RP_ID = 'rp_2b23fabfd8dffcaf';
 
 interface Props {
   token: string;
@@ -18,6 +19,7 @@ export default function WorldIdVerify({ token, handle, wallet }: Props) {
   const [verifiedAt, setVerifiedAt] = useState<number | null>(null);
   const [error, setError] = useState('');
   const [widgetOpen, setWidgetOpen] = useState(false);
+  const [rpContext, setRpContext] = useState<RpContext | null>(null);
 
   // Check current status on mount
   useEffect(() => {
@@ -35,51 +37,59 @@ export default function WorldIdVerify({ token, handle, wallet }: Props) {
       .catch(() => setStatus('unverified'));
   }, [handle]);
 
-  const handleSuccess = useCallback(async (result: IDKitResult) => {
-    setStatus('verifying');
+  // Fetch RP signature before opening widget
+  const handleOpenWidget = useCallback(async () => {
     setError('');
-
     try {
-      // Extract v3 legacy proof fields from result
-      const v3 = result.responses?.find((r: any) => r.version === 'v3' || r.merkle_root);
-      const merkle_root = v3?.merkle_root || (result as any).merkle_root;
-      const nullifier_hash = v3?.nullifier_hash || (result as any).nullifier_hash;
-      const proof = v3?.proof || (result as any).proof;
-
-      if (!merkle_root || !nullifier_hash || !proof) {
-        setError('No valid proof in response');
-        setStatus('unverified');
-        return;
-      }
-
-      const res = await fetch(`${API_BASE}/api/world-id/verify`, {
+      const res = await fetch(`${API_BASE}/api/world-id/rp-signature`, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',
           'Authorization': `Bearer ${token}`,
         },
-        body: JSON.stringify({
-          merkle_root,
-          nullifier_hash,
-          proof,
-          verification_level: v3?.verification_level || 'orb',
-          signal: wallet,
-        }),
       });
-      const data = await res.json() as any;
-      if (data.ok || data.is_human) {
-        setStatus('verified');
-        setVerificationLevel(data.verification_level || 'orb');
-        setVerifiedAt(Math.floor(Date.now() / 1000));
-      } else {
-        setError(data.error || 'Verification failed');
-        setStatus('unverified');
+      if (!res.ok) {
+        const data = await res.json() as any;
+        setError(data.error || 'Failed to get RP signature');
+        return;
       }
+      const rpSig = await res.json() as { sig: string; nonce: string; created_at: number; expires_at: number };
+      setRpContext({
+        rp_id: WORLD_ID_RP_ID,
+        nonce: rpSig.nonce,
+        created_at: rpSig.created_at,
+        expires_at: rpSig.expires_at,
+        signature: rpSig.sig,
+      });
+      setWidgetOpen(true);
     } catch (e: any) {
       setError(e.message || 'Network error');
-      setStatus('unverified');
     }
-  }, [token, wallet]);
+  }, [token]);
+
+  // handleVerify: send proof to backend for v4 verification
+  const handleVerify = useCallback(async (result: IDKitResult) => {
+    const res = await fetch(`${API_BASE}/api/world-id/verify`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${token}`,
+      },
+      body: JSON.stringify(result),
+    });
+    if (!res.ok) {
+      const data = await res.json() as any;
+      throw new Error(data.error || 'Backend verification failed');
+    }
+  }, [token]);
+
+  // onSuccess: update UI after successful verification
+  const handleSuccess = useCallback((_result: IDKitResult) => {
+    setStatus('verified');
+    setVerificationLevel('orb');
+    setVerifiedAt(Math.floor(Date.now() / 1000));
+    setWidgetOpen(false);
+  }, []);
 
   if (status === 'loading') {
     return (
@@ -118,7 +128,7 @@ export default function WorldIdVerify({ token, handle, wallet }: Props) {
           </p>
 
           <button
-            onClick={() => setWidgetOpen(true)}
+            onClick={handleOpenWidget}
             disabled={status === 'verifying'}
             className="bg-gradient-to-r from-purple-600 to-blue-600 text-white px-6 py-3 rounded-xl text-sm font-bold hover:from-purple-500 hover:to-blue-500 transition disabled:opacity-50 flex items-center gap-2"
           >
@@ -133,18 +143,23 @@ export default function WorldIdVerify({ token, handle, wallet }: Props) {
             )}
           </button>
 
-          <IDKitRequestWidget
-            app_id={WORLD_ID_APP_ID as `app_${string}`}
-            action={WORLD_ID_ACTION}
-            preset={orbLegacy({ signal: wallet })}
-            open={widgetOpen}
-            onOpenChange={setWidgetOpen}
-            onSuccess={handleSuccess}
-            onError={(err) => {
-              setError(`Verification error: ${err}`);
-              setStatus('unverified');
-            }}
-          />
+          {rpContext && (
+            <IDKitRequestWidget
+              app_id={WORLD_ID_APP_ID as `app_${string}`}
+              action={WORLD_ID_ACTION}
+              rp_context={rpContext}
+              allow_legacy_proofs={true}
+              preset={orbLegacy({ signal: wallet })}
+              open={widgetOpen}
+              onOpenChange={setWidgetOpen}
+              handleVerify={handleVerify}
+              onSuccess={handleSuccess}
+              onError={(err) => {
+                setError(`Verification error: ${err}`);
+                setWidgetOpen(false);
+              }}
+            />
+          )}
 
           {error && (
             <p className="text-red-400 text-sm mt-3">{error}</p>

web/src/components/WorldIdVerify.tsx

@@ -9,6 +9,7 @@
     "db:migrate:local": "wrangler d1 execute basemail-db --file=src/db/schema.sql --local"
   },
   "dependencies": {
+    "@worldcoin/idkit-server": "^1.0.0",
     "hono": "^4.7.0",
     "mimetext": "^3.0.24",
     "postal-mime": "^2.4.1",

worker/package.json

@@ -1,6 +1,7 @@
 import { Hono } from 'hono';
 import { AppBindings } from '../types';
 import { authMiddleware } from '../auth';
+import { signRequest } from '@worldcoin/idkit-server';
 
 const worldId = new Hono<AppBindings>();
 
@@ -23,68 +24,75 @@ async function ensureTable(db: D1Database) {
   `);
 }
 
+/**
+ * POST /api/world-id/rp-signature
+ * Generate RP signature for IDKit v4. Requires auth.
+ * Returns: { sig, nonce, created_at, expires_at }
+ */
+worldId.post('/rp-signature', authMiddleware(), async (c) => {
+  const SIGNING_KEY = c.env.WORLD_ID_SIGNING_KEY;
+  const ACTION = c.env.WORLD_ID_ACTION || 'verify-human';
+
+  if (!SIGNING_KEY) {
+    return c.json({ error: 'World ID signing key not configured' }, 500);
+  }
+
+  const { sig, nonce, createdAt, expiresAt } = signRequest(ACTION, SIGNING_KEY);
+
+  return c.json({
+    sig,
+    nonce,
+    created_at: createdAt,
+    expires_at: expiresAt,
+  });
+});
+
 /**
  * POST /api/world-id/verify
- * Accepts IDKit proof, verifies with World ID cloud API, stores result.
- * Body: { merkle_root, nullifier_hash, proof, verification_level, signal? }
+ * Accepts full IDKit result, forwards to World ID v4 verify API.
+ * Body: IDKit result payload (forwarded as-is)
  */
 worldId.post('/verify', authMiddleware(), async (c) => {
   const auth = c.get('auth');
-  const body = await c.req.json<{
-    merkle_root: string;
-    nullifier_hash: string;
-    proof: string;
-    verification_level?: string;
-    signal?: string;
-  }>();
-
-  const { merkle_root, nullifier_hash, proof, verification_level, signal } = body;
-
-  if (!merkle_root || !nullifier_hash || !proof) {
-    return c.json({ error: 'Missing required proof fields' }, 400);
-  }
+  const body = await c.req.json();
 
-  const APP_ID = c.env.WORLD_ID_APP_ID;
-  const ACTION = c.env.WORLD_ID_ACTION || 'verify-human';
+  const RP_ID = c.env.WORLD_ID_RP_ID;
 
-  if (!APP_ID) {
+  if (!RP_ID) {
     return c.json({ error: 'World ID not configured' }, 500);
   }
 
-  // Call World ID cloud verification API
-  // v2 endpoint works for both v3 and v4 proofs (with allow_legacy_proofs)
+  // Forward IDKit result to World ID v4 verify API
   const verifyRes = await fetch(
-    `https://developer.worldcoin.org/api/v2/verify/${APP_ID}`,
+    `https://developer.world.org/api/v4/verify/${RP_ID}`,
     {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({
-        merkle_root,
-        nullifier_hash,
-        proof,
-        action: ACTION,
-        signal: signal || '',
-      }),
+      body: JSON.stringify(body),
     },
   );
 
   if (!verifyRes.ok) {
     const err = await verifyRes.text();
-    console.error('World ID verify failed:', verifyRes.status, err);
+    console.error('World ID v4 verify failed:', verifyRes.status, err);
     return c.json({
       error: 'World ID verification failed',
       detail: verifyRes.status === 400 ? 'Invalid proof or already used' : 'Verification service error',
+      status: verifyRes.status,
     }, 400);
   }
 
-  const verifyData = await verifyRes.json<{
-    success: boolean;
-    nullifier_hash: string;
-    action: string;
-  }>();
+  const verifyData = await verifyRes.json<any>();
+
+  // Extract nullifier from response
+  // v3 legacy: responses[0].nullifier
+  // v4: responses[0].nullifier
+  const firstResponse = verifyData.responses?.[0];
+  const nullifier = firstResponse?.nullifier;
+  const identifier = firstResponse?.identifier || 'orb';
 
-  if (!verifyData.success) {
-    return c.json({ error: 'Proof verification returned false' }, 400);
+  if (!nullifier) {
+    return c.json({ error: 'No nullifier in verification response' }, 400);
   }
 
   // Ensure DB table exists
@@ -93,7 +101,7 @@ worldId.post('/verify', authMiddleware(), async (c) => {
   // Check if this nullifier was already used (same human, different account)
   const existing = await c.env.DB.prepare(
     'SELECT handle FROM world_id_verifications WHERE nullifier_hash = ?'
-  ).bind(nullifier_hash).first<{ handle: string }>();
+  ).bind(nullifier).first<{ handle: string }>();
 
   if (existing) {
     if (existing.handle === auth.handle) {
@@ -104,12 +112,15 @@ worldId.post('/verify', authMiddleware(), async (c) => {
     }, 409);
   }
 
+  // Determine version from response
+  const version = verifyData.protocol_version || 'v4';
+
   // Store verification
   const id = crypto.randomUUID();
   await c.env.DB.prepare(`
     INSERT INTO world_id_verifications (id, handle, wallet, nullifier_hash, verification_level, world_id_version)
-    VALUES (?, ?, ?, ?, ?, 'v4')
-  `).bind(id, auth.handle, auth.wallet, nullifier_hash, verification_level || 'orb').run();
+    VALUES (?, ?, ?, ?, ?, ?)
+  `).bind(id, auth.handle, auth.wallet, nullifier, identifier, version).run();
 
   // Mark account as human (add column if not exists — D1 safe)
   try {
@@ -122,7 +133,8 @@ worldId.post('/verify', authMiddleware(), async (c) => {
   return c.json({
     ok: true,
     is_human: true,
-    verification_level: verification_level || 'orb',
+    verification_level: identifier,
+    protocol_version: version,
     message: '✅ Human verified!',
   });
 });
@@ -154,7 +166,7 @@ worldId.get('/status/:handle', async (c) => {
 
 /**
  * DELETE /api/world-id/verify
- * Authenticated: remove own World ID verification (rare, but useful)
+ * Authenticated: remove own World ID verification
  */
 worldId.delete('/verify', authMiddleware(), async (c) => {
   const auth = c.get('auth');

worker/src/routes/world-id.ts

@@ -16,6 +16,8 @@ export interface Env {
   PAYMENT_ESCROW_ADDRESS?: string; // PaymentEscrow 合約地址 (Base Mainnet)
   WORLD_ID_APP_ID?: string;        // World ID app_id
   WORLD_ID_ACTION?: string;        // World ID action name (default: verify-human)
+  WORLD_ID_RP_ID?: string;         // World ID rp_id
+  WORLD_ID_SIGNING_KEY?: string;   // World ID RP signing key (SECRET - never expose)
 }
 
 export interface Account {

worker/src/types.ts

@@ -16,6 +16,8 @@ REGISTRY_CONTRACT = "0x54569D87348ba71e33832b78D61FBC0B94Fed17D"
 PAYMENT_ESCROW_ADDRESS = "0xaf41b976978ac981d79c1008dd71681355c71bf6"
 WORLD_ID_APP_ID = "app_7099aeba034f8327d91420254b4b660e"
 WORLD_ID_ACTION = "verify-human"
+WORLD_ID_RP_ID = "rp_2b23fabfd8dffcaf"
+# WORLD_ID_SIGNING_KEY is stored as a wrangler secret (never in code!)
 
 # D1 Database — 帳號與郵件索引
 [[d1_databases]]