Skip to content

Commit 62563d8

Browse files
committed
remove pkce content
1 parent 7112140 commit 62563d8

1 file changed

Lines changed: 7 additions & 172 deletions

File tree

docs.md

Lines changed: 7 additions & 172 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ Base Verify is for mini-app builders to allow their users to prove they have ver
66

77
**How it works:**
88

9-
1. Your app checks if user has verification → backend returns yes/no
10-
2. If no verification → redirect user to Base Verify Mini App
11-
3. User completes OAuth in mini app → returns to your app
9+
1. Your app checks if user has verification → backend returns yes/no
10+
2. If no verification → redirect user to Base Verify Mini App
11+
3. User completes OAuth in mini app → returns to your app
1212
4. Check again → user now verified
1313

1414
**Why This Matters:**
@@ -218,8 +218,6 @@ async function claimAirdrop(verificationToken: string, walletAddress: string) {
218218

219219
Before diving into the full integration, here's the absolute minimal example showing the core flow. This example checks if a wallet has verified an X account (no trait requirements).
220220

221-
**Note:** This uses the simple redirect flow. For production apps, consider the [PKCE flow](#option-b-pkce-flow-more-secure-recommended-for-production) for additional security.
222-
223221
### Step 1: Check Verification (Backend)
224222

225223
```typescript
@@ -520,9 +518,9 @@ async function checkVerification(address: string) {
520518
} else if (response.status === 400) {
521519
const data = await response.json();
522520
if (data.message === 'verification_traits_not_satisfied') {
523-
return {
524-
verified: false,
525-
message: 'User does not meet trait requirements'
521+
return {
522+
verified: false,
523+
message: 'User does not meet trait requirements'
526524
}
527525
}
528526
}
@@ -537,8 +535,6 @@ async function checkVerification(address: string) {
537535

538536
**Runs on:** Frontend
539537

540-
#### Option A: Simple Redirect (Easier)
541-
542538
```ts
543539
function redirectToVerifyMiniApp(provider: string) {
544540
// Build mini app URL with your app as the redirect
@@ -555,118 +551,7 @@ function redirectToVerifyMiniApp(provider: string) {
555551
}
556552
```
557553

558-
After verification, user returns to your `redirect_uri` with `?success=true`. Just check verification again.
559-
560-
#### Option B: PKCE Flow (More Secure, Recommended for Production)
561-
562-
**PKCE (Proof Key for Code Exchange)** provides additional security by preventing authorization code interception.
563-
564-
**Step 4a: Generate PKCE Challenge**
565-
566-
```ts
567-
// Generate random code verifier
568-
function generateCodeVerifier() {
569-
const array = new Uint8Array(32);
570-
crypto.getRandomValues(array);
571-
return btoa(String.fromCharCode(...array))
572-
.replace(/\+/g, '-')
573-
.replace(/\//g, '_')
574-
.replace(/=/g, '');
575-
}
576-
577-
// Generate code challenge from verifier
578-
async function generateCodeChallenge(verifier: string) {
579-
const encoder = new TextEncoder();
580-
const data = encoder.encode(verifier);
581-
const digest = await crypto.subtle.digest('SHA-256', data);
582-
return btoa(String.fromCharCode(...new Uint8Array(digest)))
583-
.replace(/\+/g, '-')
584-
.replace(/\//g, '_')
585-
.replace(/=/g, '');
586-
}
587-
```
588-
589-
**Step 4b: Redirect with PKCE**
590-
591-
```ts
592-
async function redirectToVerifyMiniAppPKCE(provider: string) {
593-
// Generate PKCE parameters
594-
const codeVerifier = generateCodeVerifier();
595-
const codeChallenge = await generateCodeChallenge(codeVerifier);
596-
const state = `verify-${Date.now()}`;
597-
598-
// Store verifier for later (when user returns)
599-
sessionStorage.setItem('pkce_code_verifier', codeVerifier);
600-
sessionStorage.setItem('pkce_state', state);
601-
602-
// Build redirect with PKCE parameters
603-
const params = new URLSearchParams({
604-
redirect_uri: config.appUrl,
605-
providers: provider,
606-
state: state,
607-
code_challenge: codeChallenge,
608-
code_challenge_method: 'S256'
609-
});
610-
611-
const miniAppUrl = `${config.baseVerifyMiniAppUrl}?${params.toString()}`;
612-
const deepLink = `cbwallet://miniapp?url=${encodeURIComponent(miniAppUrl)}`;
613-
window.open(deepLink, '_blank');
614-
}
615-
```
616-
617-
**Step 4c: Handle Return & Exchange Code**
618-
619-
When user returns, the URL will contain `?code=...&state=...`:
620-
621-
```ts
622-
// On page load, check for OAuth callback
623-
const urlParams = new URLSearchParams(window.location.search);
624-
const code = urlParams.get('code');
625-
const state = urlParams.get('state');
626-
627-
if (code && state) {
628-
// Verify state matches
629-
const storedState = sessionStorage.getItem('pkce_state');
630-
if (state !== storedState) {
631-
throw new Error('State mismatch - possible CSRF attack');
632-
}
633-
634-
// Get stored code verifier
635-
const codeVerifier = sessionStorage.getItem('pkce_code_verifier');
636-
637-
// Exchange code for verification token
638-
const response = await fetch('https://verify.base.dev/v1/token', {
639-
method: 'POST',
640-
headers: {
641-
'Content-Type': 'application/json',
642-
'Authorization': `Bearer ${YOUR_SECRET_KEY}`,
643-
},
644-
body: JSON.stringify({
645-
code: code,
646-
code_verifier: codeVerifier
647-
})
648-
});
649-
650-
if (response.ok) {
651-
const { token } = await response.json();
652-
console.log('Verification token:', token);
653-
654-
// Clean up
655-
sessionStorage.removeItem('pkce_code_verifier');
656-
sessionStorage.removeItem('pkce_state');
657-
658-
// Store token and proceed with your app logic
659-
await saveVerificationToken(token);
660-
}
661-
}
662-
```
663-
664-
**Which Should You Use?**
665-
666-
- **Simple Redirect**: Good for testing, demos, low-security use cases
667-
- **PKCE Flow**: Recommended for production, especially for high-value operations (token gates, airdrops)
668-
669-
The main difference: Simple redirect relies on re-checking with SIWE signature. PKCE provides an authorization code exchange for more robust security.
554+
After verification, user returns to your `redirect_uri` with `?success=true`. Check verification again to get the token.
670555

671556
---
672557

@@ -744,56 +629,6 @@ Invalid or missing API key.
744629

745630
---
746631

747-
### POST /v1/token
748-
749-
Exchange authorization code for verification token (PKCE flow only).
750-
751-
**Authentication:** Requires `Authorization: Bearer {SECRET_KEY}`
752-
753-
**Request:**
754-
755-
```ts
756-
{
757-
code: string, // Authorization code from redirect
758-
code_verifier: string // PKCE code verifier you generated
759-
}
760-
```
761-
762-
**Example Request:**
763-
764-
```bash
765-
curl -X POST https://verify.base.dev/v1/token \
766-
-H "Content-Type: application/json" \
767-
-H "Authorization: Bearer YOUR_SECRET_KEY" \
768-
-d '{
769-
"code": "abc123...",
770-
"code_verifier": "def456..."
771-
}'
772-
```
773-
774-
**Response (200 OK):**
775-
776-
```ts
777-
{
778-
token: string, // Verification token
779-
signature: string, // Signature from Base Verify
780-
action: string, // Action that was verified
781-
wallet: string // User's wallet address
782-
}
783-
```
784-
785-
**Response (400 Bad Request):**
786-
787-
Invalid code or verifier.
788-
789-
```ts
790-
{
791-
error: "invalid_grant"
792-
}
793-
```
794-
795-
---
796-
797632
### Mini App Redirect
798633

799634
When redirecting to Base Verify Mini App:

0 commit comments

Comments
 (0)