[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6FGAXYF5BMZJA3MB7BNF708":3,"skill-same:01M6FGAXYF5BMZJA3MB7BNF708":269},{"skillNo":4,"name":5,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":17,"publishedAt":21,"linkOnly":22,"markdownContent":23,"markdownBody":24,"frontMatter":25,"refName":26,"commitSha":27,"skillDirectory":28,"forksCount":29,"repositoryHtmlUrl":30,"repositoryHomepageUrl":31,"ownerHtmlUrl":32,"ownerBlogUrl":6,"ownerDescription":33,"updatedAt":34,"install":35,"resources":48},"01M6FGAXYF5BMZJA3MB7BNF708","cloudflare-images",null,"ComeOnOliver\u002Fskillshub","ComeOnOliver","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F43215937?v=4","01M6E5JNFECJAAVFE0W7SMWWD2","Haoran Shu","01M6E5JNNDQS7AJZDYFQ8TPZCK",67,"MIT","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002FSKILL.md",[],[18,19,20],"cloudflare","images","cloudflare images","2026-11-10 10:12:30",false,"---\nname: cloudflare-images\ndescription: This skill should be used when the user asks to \"upload images to Cloudflare\", \"implement direct creator upload\", \"configure image transformations\", \"optimize WebP\u002FAVIF\", \"create image variants\", \"generate signed URLs\", \"add image watermarks\", \"integrate with Next.js\u002FRemix\", \"configure webhooks\", \"debug CORS errors\", \"troubleshoot error 5408\u002F9401-9413\", or \"build responsive images with Cloudflare Images API\".\n\n  Keywords: cloudflare images, image upload cloudflare, imagedelivery.net, cloudflare image transformations, \u002Fcdn-cgi\u002Fimage\u002F, direct creator upload, image variants, cf.image workers, signed urls images, flexible variants, webp avif conversion, responsive images cloudflare, error 5408, error 9401, error 9403, CORS direct upload, multipart\u002Fform-data, image optimization cloudflare, image watermarks, webhooks images, nextjs cloudflare images, remix cloudflare images, custom domains images, content credentials, c2pa\nlicense: MIT\nmetadata:\n  version: \"3.0.0\"\n  last_verified: \"2025-12-27\"\n  workers_types_version: \"4.20250110.0\"\n  typescript_version: \"5.7.2\"\n  wrangler_version: \"3.91.0\"\n  production_tested: true\n  token_savings: \"~65%\"\n  errors_prevented: 10\n  templates_included: 16\n  references_included: 16\n  agents_included: 3\n  commands_included: 3\n  examples_included: 3\n  diagrams_included: 3\n  scripts_included: 5\n---\n\n# Cloudflare Images\n\n**Status**: Production Ready ✅ | **Version**: 3.0.0 | **Last Verified**: 2025-12-27\n\n---\n\n## What Is Cloudflare Images?\n\nTwo powerful features:\n\n1. **Images API**: Upload, store, serve images globally\n2. **Image Transformations**: Resize\u002Foptimize ANY image\n\n**Key benefits:**\n- Global CDN delivery\n- Automatic WebP\u002FAVIF conversion\n- Up to 100 variants\n- Direct creator upload (no API keys in frontend)\n- Signed URLs for private images\n- Transform any image via URL or Workers\n\n---\n\n## Quick Start (5 Minutes)\n\n### 1. Enable Cloudflare Images\n\nDashboard → **Images** → **Enable**\n\nGet your **Account ID** and create **API token** (Cloudflare Images: Edit permission)\n\n### 2. Upload Image\n\n```bash\ncurl --request POST \\\n  --url https:\u002F\u002Fapi.cloudflare.com\u002Fclient\u002Fv4\u002Faccounts\u002F\u003CACCOUNT_ID>\u002Fimages\u002Fv1 \\\n  --header 'Authorization: Bearer \u003CAPI_TOKEN>' \\\n  --header 'Content-Type: multipart\u002Fform-data' \\\n  --form 'file=@.\u002Fimage.jpg'\n```\n\n**CRITICAL:** Use `multipart\u002Fform-data`, not JSON\n\n### 3. Serve Image\n\n```html\n\u003Cimg src=\"https:\u002F\u002Fimagedelivery.net\u002F\u003CACCOUNT_HASH>\u002F\u003CIMAGE_ID>\u002Fpublic\" \u002F>\n```\n\n### 4. Enable Transformations\n\nDashboard → **Images** → **Transformations** → **Enable for zone**\n\nTransform ANY image:\n\n```html\n\u003Cimg src=\"\u002Fcdn-cgi\u002Fimage\u002Fwidth=800,quality=85\u002Fuploads\u002Fphoto.jpg\" \u002F>\n```\n\n### 5. Transform via Workers\n\n```typescript\nexport default {\n  async fetch(request: Request): Promise\u003CResponse> {\n    return fetch(\"https:\u002F\u002Fexample.com\u002Fimage.jpg\", {\n      cf: {\n        image: {\n          width: 800,\n          quality: 85,\n          format: \"auto\"  \u002F\u002F WebP\u002FAVIF\n        }\n      }\n    });\n  }\n};\n```\n\n**Load `references\u002Fsetup-guide.md` for complete walkthrough.**\n\n---\n\n## The 3 Core Features\n\n### Feature 1: Images API (Upload & Storage)\n\n**Upload methods:**\n1. File upload (server-side)\n2. Upload via URL (ingest from external)\n3. Direct creator upload (user uploads, no API keys)\n\n**Load `templates\u002Fupload-api-basic.ts` for file upload example.**\n**Load `references\u002Fdirect-upload-complete-workflow.md` for user uploads.**\n\n### Feature 2: Image Transformations\n\nOptimize ANY image (uploaded or external).\n\n**Methods:**\n1. URL: `\u002Fcdn-cgi\u002Fimage\u002Fwidth=800,quality=85\u002Fpath\u002Fto\u002Fimage.jpg`\n2. Workers: `cf.image` fetch option\n\n**Load `references\u002Ftransformation-options.md` for all options.**\n**Load `templates\u002Ftransform-via-workers.ts` for Workers example.**\n\n### Feature 3: Variants\n\nPredefined transformations (up to 100).\n\n**Examples:**\n- `thumbnail`: 200x200, fit=cover\n- `hero`: 1920x1080, quality=90\n- `mobile`: 640, quality=75\n\n**Load `references\u002Fvariants-guide.md` for complete guide.**\n\n---\n\n## Critical Rules\n\n### Always Do ✅\n\n1. **Use multipart\u002Fform-data** for uploads (not JSON)\n2. **Enable transformations for zones** before using `\u002Fcdn-cgi\u002Fimage\u002F`\n3. **Use direct creator upload** for user uploads (don't expose API tokens)\n4. **Set CORS headers** for direct uploads from browser\n5. **Use signed URLs** for private images\n6. **Configure variants** for common sizes (avoid dynamic transformations)\n7. **Use format=auto** for automatic WebP\u002FAVIF\n8. **Handle error codes** (9401, 9403, 9413, 5408)\n9. **Set quality=85** for optimal size\u002Fquality balance\n10. **Use fit=cover** for consistent aspect ratios\n\n### Never Do ❌\n\n1. **Never expose API tokens** in frontend code\n2. **Never use JSON encoding** for file uploads\n3. **Never skip CORS configuration** for direct uploads\n4. **Never exceed 100 variants** (hard limit)\n5. **Never use transformations without enabling for zone**\n6. **Never hardcode account IDs** in public code\n7. **Never skip error handling** (uploads can fail)\n8. **Never use quality >90** (diminishing returns)\n9. **Never skip image validation** (size, format, dimensions)\n10. **Never use transformations on non-proxied requests**\n\n---\n\n## Top 2 Use Cases\n\n### Use Case 1: User Profile Pictures\n\nDirect creator upload pattern for user-uploaded images:\n\n```typescript\n\u002F\u002F Backend: Generate upload URL\nconst response = await fetch(\n  `https:\u002F\u002Fapi.cloudflare.com\u002Fclient\u002Fv4\u002Faccounts\u002F${ACCOUNT_ID}\u002Fimages\u002Fv2\u002Fdirect_upload`,\n  { method: 'POST', headers: { 'Authorization': `Bearer ${API_TOKEN}` } }\n);\nconst { result } = await response.json();\nreturn Response.json({ uploadURL: result.uploadURL });\n\n\u002F\u002F Frontend: Upload file\nconst formData = new FormData();\nformData.append('file', file);\nawait fetch(uploadURL, { method: 'POST', body: formData });\n```\n\n**Load `templates\u002Fdirect-creator-upload-backend.ts` for complete example.**\n**See `examples\u002Fbasic-upload\u002F` for complete working project.**\n\n### Use Case 2: Responsive Images\n\nResponsive images with srcset for optimal performance:\n\n```html\n\u003Cimg\n  srcset=\"\n    https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=400 400w,\n    https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=800 800w,\n    https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=1200 1200w\n  \"\n  sizes=\"(max-width: 600px) 400px, (max-width: 1000px) 800px, 1200px\"\n  src=\"https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=800\"\n\u002F>\n```\n\n**Load `templates\u002Fresponsive-images-srcset.html` for complete example.**\n**See `examples\u002Fresponsive-gallery\u002F` for complete working project.**\n\n**Additional Use Cases:**\n- **Transform Existing Images**: Load `references\u002Ftransformation-options.md`\n- **Private Images**: Load `references\u002Fsigned-urls-guide.md` or see `examples\u002Fprivate-images\u002F`\n- **Batch Upload**: Load `templates\u002Fbatch-upload.ts`\n- **Framework Integration**: Load `references\u002Fframework-integration.md` for Next.js, Remix, Astro\n- **Watermarking**: Load `references\u002Foverlays-watermarks.md` and `templates\u002Foverlay-watermark.ts`\n- **Custom Domains**: Load `references\u002Fcustom-domains.md`\n- **Webhooks**: Load `references\u002Fwebhooks-guide.md` and `templates\u002Fwebhook-handler.ts`\n\n---\n\n## Top 2 Errors Prevented\n\n### Error 1: CORS Issues with Direct Upload\n\n**Problem:** Browser blocks direct upload from your domain.\n\n**Solution:** Configure CORS headers when generating upload URL:\n\n```typescript\nconst response = await fetch(\n  `https:\u002F\u002Fapi.cloudflare.com\u002Fclient\u002Fv4\u002Faccounts\u002F${ACCOUNT_ID}\u002Fimages\u002Fv2\u002Fdirect_upload`,\n  {\n    method: 'POST',\n    headers: { 'Authorization': `Bearer ${API_TOKEN}` },\n    body: JSON.stringify({\n      requireSignedURLs: false,\n      metadata: { source: 'user-upload' }\n    })\n  }\n);\n```\n\n### Error 2: Multipart Form Data Encoding\n\n**Problem:** JSON encoding fails for file uploads (must use multipart\u002Fform-data).\n\n**Solution:**\n\n```typescript\n\u002F\u002F ✅ CORRECT\nconst formData = new FormData();\nformData.append('file', file);\nawait fetch(uploadURL, { method: 'POST', body: formData });\n\n\u002F\u002F ❌ WRONG\nconst json = JSON.stringify({ file: base64File });\n```\n\n**Additional Common Errors:**\n- **Error 9401** (Transformations not enabled): Load `references\u002Ftop-errors.md`\n- **Error 9403** (Invalid transformation): Load `references\u002Ftop-errors.md`\n- **Error 9413** (Variant limit exceeded): Load `references\u002Ftop-errors.md`\n- **Error 5408** (Upload timeout): Load `references\u002Ftop-errors.md`\n- **Missing requireSignedURLs**: Load `references\u002Fsigned-urls-guide.md`\n\n**Load `references\u002Ftop-errors.md` for all 10 errors with complete solutions.**\n\n---\n\n## When to Load References\n\n### Core References\n\n**Load `references\u002Fsetup-guide.md` when:**\n- First-time Cloudflare Images setup\n- Need step-by-step walkthrough\n\n**Load `references\u002Fapi-reference.md` when:**\n- Need complete API documentation\n- All endpoints and parameters\n\n**Load `references\u002Ftop-errors.md` when:**\n- Encountering any error code (5408, 9401-9413)\n- Troubleshooting upload\u002Ftransformation issues\n\n### Upload References\n\n**Load `references\u002Fdirect-upload-complete-workflow.md` when:**\n- Implementing user uploads\n- Need frontend + backend example\n- Configuring CORS\n\n**Load `references\u002Fsigned-urls-guide.md` when:**\n- Implementing private images with access control\n- Need HMAC-SHA256 signature generation\n\n**Load `references\u002Fwebhooks-guide.md` when:**\n- Processing upload completion events\n- Implementing webhook handlers with signature verification\n\n### Transformation References\n\n**Load `references\u002Ftransformation-options.md` when:**\n- Need complete transformation reference\n- Exploring all fit\u002Fformat\u002Feffect options\n\n**Load `references\u002Fformat-optimization.md` when:**\n- Optimizing format selection (WebP\u002FAVIF)\n- Quality vs size tradeoffs\n\n**Load `references\u002Fpolish-compression.md` when:**\n- Need details on Lossless\u002FLossy\u002FWebP compression modes\n- Metadata handling (EXIF removal)\n\n**Load `references\u002Foverlays-watermarks.md` when:**\n- Adding text or logo watermarks\n- Implementing branding\u002Fcopyright protection\n\n### Advanced Features\n\n**Load `references\u002Fvariants-guide.md` when:**\n- Creating\u002Fmanaging variants (up to 100 max)\n- Need flexible variants vs named variants\n\n**Load `references\u002Fresponsive-images-patterns.md` when:**\n- Building responsive images with srcset\n- Implementing picture element for art direction\n\n**Load `references\u002Fframework-integration.md` when:**\n- Integrating with Next.js, Remix, Astro, SvelteKit\n- Need framework-specific patterns and loaders\n\n**Load `references\u002Fcustom-domains.md` when:**\n- Serving images from branded domains\n- CNAME configuration and SSL setup\n\n**Load `references\u002Fcontent-credentials.md` when:**\n- Preserving EXIF\u002FIPTC metadata\n- Implementing C2PA Content Credentials for authenticity\n\n**Load `references\u002Fsourcing-kit.md` when:**\n- Migrating from Cloudinary, Imgix, or S3\n- Bulk import from external CDNs\n\n---\n\n## Using Bundled Resources\n\n### References (16 reference files)\n\n**Core**: setup-guide.md, api-reference.md, top-errors.md\n\n**Upload**: direct-upload-complete-workflow.md, signed-urls-guide.md, webhooks-guide.md\n\n**Transform**: transformation-options.md, format-optimization.md, polish-compression.md, overlays-watermarks.md\n\n**Advanced**: variants-guide.md, responsive-images-patterns.md, framework-integration.md, custom-domains.md, content-credentials.md, sourcing-kit.md\n\n### Templates (16 template files)\n\n**Upload**: upload-api-basic.ts, upload-via-url.ts, direct-creator-upload-backend.ts, direct-creator-upload-frontend.html, batch-upload.ts\n\n**Transform**: transform-via-url.ts, transform-via-workers.ts, overlay-watermark.ts\n\n**Variants**: variants-management.ts, signed-urls-generation.ts, responsive-images-srcset.html\n\n**Integration**: nextjs-integration.tsx, remix-integration.tsx, webhook-handler.ts\n\n**Config**: wrangler-images-binding.jsonc, package.json\n\n### Agents (3 autonomous agents)\n\n- **troubleshooting-agent** - Diagnose upload\u002Ftransformation errors (5408, 9401-9413)\n- **upload-workflow-agent** - Guide complete upload implementation (frontend + backend)\n- **optimization-agent** - Recommend image optimization strategies\n\nUse: `\u002Fagent \u003Cagent-name>` or let Claude auto-detect when relevant\n\n### Commands (3 slash commands)\n\n- **\u002Fcheck-images** - Quick API health check and configuration validation\n- **\u002Fvalidate-config** - Validate wrangler.jsonc bindings and configuration\n- **\u002Fgenerate-variant** - Interactive variant generator\n\nUse: `\u002F\u003Ccommand-name>`\n\n### Examples (3 complete working projects)\n\n- **basic-upload\u002F** - Minimal upload implementation with Hono + Workers\n- **responsive-gallery\u002F** - Responsive image gallery with srcset and lazy loading\n- **private-images\u002F** - Signed URLs with time-based expiry and access control\n\nClone and run: `cd examples\u002F\u003Cexample-name> && npm install && npm run dev`\n\n### Architecture Diagrams (3 diagrams)\n\n- **direct-upload-workflow.md** - Sequence diagram of direct creator upload flow\n- **transformation-pipeline.md** - Flowchart showing transformation processing\n- **variants-structure.md** - Named vs flexible variants comparison\n\nView in: `assets\u002Fdiagrams\u002F`\n\n### Utility Scripts (5 scripts)\n\n- **test-upload.sh** - Test API connectivity with sample image upload\n- **generate-signed-url.sh** - CLI tool to generate signed URLs with expiry\n- **validate-variants.sh** - List all variants and check variant count (max 100)\n- **analyze-usage.sh** - Query API for storage usage and estimated costs\n- **check-versions.sh** - Verify package versions are current\n\nRun: `.\u002Fscripts\u002F\u003Cscript-name>.sh` (requires CF_ACCOUNT_ID and CF_API_TOKEN in .env)\n\n---\n\n## Pricing\n\n**Images API**: $5\u002F100k stored, $1\u002F100k delivered\n**Transformations**: $0.50\u002F1k (100k\u002Fmonth free per zone)\n**Direct Upload**: Included in API pricing\n\n---\n\n## Official Documentation\n\n- **Images Overview**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002F\n- **Upload API**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Fupload-images\u002F\n- **Transformations**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Ftransform-images\u002F\n- **Direct Creator Upload**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Fupload-images\u002Fdirect-creator-upload\u002F\n- **Variants**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Fmanage-images\u002Fcreate-variants\u002F\n\n","# Cloudflare Images\n\n**Status**: Production Ready ✅ | **Version**: 3.0.0 | **Last Verified**: 2025-12-27\n\n---\n\n## What Is Cloudflare Images?\n\nTwo powerful features:\n\n1. **Images API**: Upload, store, serve images globally\n2. **Image Transformations**: Resize\u002Foptimize ANY image\n\n**Key benefits:**\n- Global CDN delivery\n- Automatic WebP\u002FAVIF conversion\n- Up to 100 variants\n- Direct creator upload (no API keys in frontend)\n- Signed URLs for private images\n- Transform any image via URL or Workers\n\n---\n\n## Quick Start (5 Minutes)\n\n### 1. Enable Cloudflare Images\n\nDashboard → **Images** → **Enable**\n\nGet your **Account ID** and create **API token** (Cloudflare Images: Edit permission)\n\n### 2. Upload Image\n\n```bash\ncurl --request POST \\\n  --url https:\u002F\u002Fapi.cloudflare.com\u002Fclient\u002Fv4\u002Faccounts\u002F\u003CACCOUNT_ID>\u002Fimages\u002Fv1 \\\n  --header 'Authorization: Bearer \u003CAPI_TOKEN>' \\\n  --header 'Content-Type: multipart\u002Fform-data' \\\n  --form 'file=@.\u002Fimage.jpg'\n```\n\n**CRITICAL:** Use `multipart\u002Fform-data`, not JSON\n\n### 3. Serve Image\n\n```html\n\u003Cimg src=\"https:\u002F\u002Fimagedelivery.net\u002F\u003CACCOUNT_HASH>\u002F\u003CIMAGE_ID>\u002Fpublic\" \u002F>\n```\n\n### 4. Enable Transformations\n\nDashboard → **Images** → **Transformations** → **Enable for zone**\n\nTransform ANY image:\n\n```html\n\u003Cimg src=\"\u002Fcdn-cgi\u002Fimage\u002Fwidth=800,quality=85\u002Fuploads\u002Fphoto.jpg\" \u002F>\n```\n\n### 5. Transform via Workers\n\n```typescript\nexport default {\n  async fetch(request: Request): Promise\u003CResponse> {\n    return fetch(\"https:\u002F\u002Fexample.com\u002Fimage.jpg\", {\n      cf: {\n        image: {\n          width: 800,\n          quality: 85,\n          format: \"auto\"  \u002F\u002F WebP\u002FAVIF\n        }\n      }\n    });\n  }\n};\n```\n\n**Load `references\u002Fsetup-guide.md` for complete walkthrough.**\n\n---\n\n## The 3 Core Features\n\n### Feature 1: Images API (Upload & Storage)\n\n**Upload methods:**\n1. File upload (server-side)\n2. Upload via URL (ingest from external)\n3. Direct creator upload (user uploads, no API keys)\n\n**Load `templates\u002Fupload-api-basic.ts` for file upload example.**\n**Load `references\u002Fdirect-upload-complete-workflow.md` for user uploads.**\n\n### Feature 2: Image Transformations\n\nOptimize ANY image (uploaded or external).\n\n**Methods:**\n1. URL: `\u002Fcdn-cgi\u002Fimage\u002Fwidth=800,quality=85\u002Fpath\u002Fto\u002Fimage.jpg`\n2. Workers: `cf.image` fetch option\n\n**Load `references\u002Ftransformation-options.md` for all options.**\n**Load `templates\u002Ftransform-via-workers.ts` for Workers example.**\n\n### Feature 3: Variants\n\nPredefined transformations (up to 100).\n\n**Examples:**\n- `thumbnail`: 200x200, fit=cover\n- `hero`: 1920x1080, quality=90\n- `mobile`: 640, quality=75\n\n**Load `references\u002Fvariants-guide.md` for complete guide.**\n\n---\n\n## Critical Rules\n\n### Always Do ✅\n\n1. **Use multipart\u002Fform-data** for uploads (not JSON)\n2. **Enable transformations for zones** before using `\u002Fcdn-cgi\u002Fimage\u002F`\n3. **Use direct creator upload** for user uploads (don't expose API tokens)\n4. **Set CORS headers** for direct uploads from browser\n5. **Use signed URLs** for private images\n6. **Configure variants** for common sizes (avoid dynamic transformations)\n7. **Use format=auto** for automatic WebP\u002FAVIF\n8. **Handle error codes** (9401, 9403, 9413, 5408)\n9. **Set quality=85** for optimal size\u002Fquality balance\n10. **Use fit=cover** for consistent aspect ratios\n\n### Never Do ❌\n\n1. **Never expose API tokens** in frontend code\n2. **Never use JSON encoding** for file uploads\n3. **Never skip CORS configuration** for direct uploads\n4. **Never exceed 100 variants** (hard limit)\n5. **Never use transformations without enabling for zone**\n6. **Never hardcode account IDs** in public code\n7. **Never skip error handling** (uploads can fail)\n8. **Never use quality >90** (diminishing returns)\n9. **Never skip image validation** (size, format, dimensions)\n10. **Never use transformations on non-proxied requests**\n\n---\n\n## Top 2 Use Cases\n\n### Use Case 1: User Profile Pictures\n\nDirect creator upload pattern for user-uploaded images:\n\n```typescript\n\u002F\u002F Backend: Generate upload URL\nconst response = await fetch(\n  `https:\u002F\u002Fapi.cloudflare.com\u002Fclient\u002Fv4\u002Faccounts\u002F${ACCOUNT_ID}\u002Fimages\u002Fv2\u002Fdirect_upload`,\n  { method: 'POST', headers: { 'Authorization': `Bearer ${API_TOKEN}` } }\n);\nconst { result } = await response.json();\nreturn Response.json({ uploadURL: result.uploadURL });\n\n\u002F\u002F Frontend: Upload file\nconst formData = new FormData();\nformData.append('file', file);\nawait fetch(uploadURL, { method: 'POST', body: formData });\n```\n\n**Load `templates\u002Fdirect-creator-upload-backend.ts` for complete example.**\n**See `examples\u002Fbasic-upload\u002F` for complete working project.**\n\n### Use Case 2: Responsive Images\n\nResponsive images with srcset for optimal performance:\n\n```html\n\u003Cimg\n  srcset=\"\n    https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=400 400w,\n    https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=800 800w,\n    https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=1200 1200w\n  \"\n  sizes=\"(max-width: 600px) 400px, (max-width: 1000px) 800px, 1200px\"\n  src=\"https:\u002F\u002Fimagedelivery.net\u002Fabc\u002Fxyz\u002Fwidth=800\"\n\u002F>\n```\n\n**Load `templates\u002Fresponsive-images-srcset.html` for complete example.**\n**See `examples\u002Fresponsive-gallery\u002F` for complete working project.**\n\n**Additional Use Cases:**\n- **Transform Existing Images**: Load `references\u002Ftransformation-options.md`\n- **Private Images**: Load `references\u002Fsigned-urls-guide.md` or see `examples\u002Fprivate-images\u002F`\n- **Batch Upload**: Load `templates\u002Fbatch-upload.ts`\n- **Framework Integration**: Load `references\u002Fframework-integration.md` for Next.js, Remix, Astro\n- **Watermarking**: Load `references\u002Foverlays-watermarks.md` and `templates\u002Foverlay-watermark.ts`\n- **Custom Domains**: Load `references\u002Fcustom-domains.md`\n- **Webhooks**: Load `references\u002Fwebhooks-guide.md` and `templates\u002Fwebhook-handler.ts`\n\n---\n\n## Top 2 Errors Prevented\n\n### Error 1: CORS Issues with Direct Upload\n\n**Problem:** Browser blocks direct upload from your domain.\n\n**Solution:** Configure CORS headers when generating upload URL:\n\n```typescript\nconst response = await fetch(\n  `https:\u002F\u002Fapi.cloudflare.com\u002Fclient\u002Fv4\u002Faccounts\u002F${ACCOUNT_ID}\u002Fimages\u002Fv2\u002Fdirect_upload`,\n  {\n    method: 'POST',\n    headers: { 'Authorization': `Bearer ${API_TOKEN}` },\n    body: JSON.stringify({\n      requireSignedURLs: false,\n      metadata: { source: 'user-upload' }\n    })\n  }\n);\n```\n\n### Error 2: Multipart Form Data Encoding\n\n**Problem:** JSON encoding fails for file uploads (must use multipart\u002Fform-data).\n\n**Solution:**\n\n```typescript\n\u002F\u002F ✅ CORRECT\nconst formData = new FormData();\nformData.append('file', file);\nawait fetch(uploadURL, { method: 'POST', body: formData });\n\n\u002F\u002F ❌ WRONG\nconst json = JSON.stringify({ file: base64File });\n```\n\n**Additional Common Errors:**\n- **Error 9401** (Transformations not enabled): Load `references\u002Ftop-errors.md`\n- **Error 9403** (Invalid transformation): Load `references\u002Ftop-errors.md`\n- **Error 9413** (Variant limit exceeded): Load `references\u002Ftop-errors.md`\n- **Error 5408** (Upload timeout): Load `references\u002Ftop-errors.md`\n- **Missing requireSignedURLs**: Load `references\u002Fsigned-urls-guide.md`\n\n**Load `references\u002Ftop-errors.md` for all 10 errors with complete solutions.**\n\n---\n\n## When to Load References\n\n### Core References\n\n**Load `references\u002Fsetup-guide.md` when:**\n- First-time Cloudflare Images setup\n- Need step-by-step walkthrough\n\n**Load `references\u002Fapi-reference.md` when:**\n- Need complete API documentation\n- All endpoints and parameters\n\n**Load `references\u002Ftop-errors.md` when:**\n- Encountering any error code (5408, 9401-9413)\n- Troubleshooting upload\u002Ftransformation issues\n\n### Upload References\n\n**Load `references\u002Fdirect-upload-complete-workflow.md` when:**\n- Implementing user uploads\n- Need frontend + backend example\n- Configuring CORS\n\n**Load `references\u002Fsigned-urls-guide.md` when:**\n- Implementing private images with access control\n- Need HMAC-SHA256 signature generation\n\n**Load `references\u002Fwebhooks-guide.md` when:**\n- Processing upload completion events\n- Implementing webhook handlers with signature verification\n\n### Transformation References\n\n**Load `references\u002Ftransformation-options.md` when:**\n- Need complete transformation reference\n- Exploring all fit\u002Fformat\u002Feffect options\n\n**Load `references\u002Fformat-optimization.md` when:**\n- Optimizing format selection (WebP\u002FAVIF)\n- Quality vs size tradeoffs\n\n**Load `references\u002Fpolish-compression.md` when:**\n- Need details on Lossless\u002FLossy\u002FWebP compression modes\n- Metadata handling (EXIF removal)\n\n**Load `references\u002Foverlays-watermarks.md` when:**\n- Adding text or logo watermarks\n- Implementing branding\u002Fcopyright protection\n\n### Advanced Features\n\n**Load `references\u002Fvariants-guide.md` when:**\n- Creating\u002Fmanaging variants (up to 100 max)\n- Need flexible variants vs named variants\n\n**Load `references\u002Fresponsive-images-patterns.md` when:**\n- Building responsive images with srcset\n- Implementing picture element for art direction\n\n**Load `references\u002Fframework-integration.md` when:**\n- Integrating with Next.js, Remix, Astro, SvelteKit\n- Need framework-specific patterns and loaders\n\n**Load `references\u002Fcustom-domains.md` when:**\n- Serving images from branded domains\n- CNAME configuration and SSL setup\n\n**Load `references\u002Fcontent-credentials.md` when:**\n- Preserving EXIF\u002FIPTC metadata\n- Implementing C2PA Content Credentials for authenticity\n\n**Load `references\u002Fsourcing-kit.md` when:**\n- Migrating from Cloudinary, Imgix, or S3\n- Bulk import from external CDNs\n\n---\n\n## Using Bundled Resources\n\n### References (16 reference files)\n\n**Core**: setup-guide.md, api-reference.md, top-errors.md\n\n**Upload**: direct-upload-complete-workflow.md, signed-urls-guide.md, webhooks-guide.md\n\n**Transform**: transformation-options.md, format-optimization.md, polish-compression.md, overlays-watermarks.md\n\n**Advanced**: variants-guide.md, responsive-images-patterns.md, framework-integration.md, custom-domains.md, content-credentials.md, sourcing-kit.md\n\n### Templates (16 template files)\n\n**Upload**: upload-api-basic.ts, upload-via-url.ts, direct-creator-upload-backend.ts, direct-creator-upload-frontend.html, batch-upload.ts\n\n**Transform**: transform-via-url.ts, transform-via-workers.ts, overlay-watermark.ts\n\n**Variants**: variants-management.ts, signed-urls-generation.ts, responsive-images-srcset.html\n\n**Integration**: nextjs-integration.tsx, remix-integration.tsx, webhook-handler.ts\n\n**Config**: wrangler-images-binding.jsonc, package.json\n\n### Agents (3 autonomous agents)\n\n- **troubleshooting-agent** - Diagnose upload\u002Ftransformation errors (5408, 9401-9413)\n- **upload-workflow-agent** - Guide complete upload implementation (frontend + backend)\n- **optimization-agent** - Recommend image optimization strategies\n\nUse: `\u002Fagent \u003Cagent-name>` or let Claude auto-detect when relevant\n\n### Commands (3 slash commands)\n\n- **\u002Fcheck-images** - Quick API health check and configuration validation\n- **\u002Fvalidate-config** - Validate wrangler.jsonc bindings and configuration\n- **\u002Fgenerate-variant** - Interactive variant generator\n\nUse: `\u002F\u003Ccommand-name>`\n\n### Examples (3 complete working projects)\n\n- **basic-upload\u002F** - Minimal upload implementation with Hono + Workers\n- **responsive-gallery\u002F** - Responsive image gallery with srcset and lazy loading\n- **private-images\u002F** - Signed URLs with time-based expiry and access control\n\nClone and run: `cd examples\u002F\u003Cexample-name> && npm install && npm run dev`\n\n### Architecture Diagrams (3 diagrams)\n\n- **direct-upload-workflow.md** - Sequence diagram of direct creator upload flow\n- **transformation-pipeline.md** - Flowchart showing transformation processing\n- **variants-structure.md** - Named vs flexible variants comparison\n\nView in: `assets\u002Fdiagrams\u002F`\n\n### Utility Scripts (5 scripts)\n\n- **test-upload.sh** - Test API connectivity with sample image upload\n- **generate-signed-url.sh** - CLI tool to generate signed URLs with expiry\n- **validate-variants.sh** - List all variants and check variant count (max 100)\n- **analyze-usage.sh** - Query API for storage usage and estimated costs\n- **check-versions.sh** - Verify package versions are current\n\nRun: `.\u002Fscripts\u002F\u003Cscript-name>.sh` (requires CF_ACCOUNT_ID and CF_API_TOKEN in .env)\n\n---\n\n## Pricing\n\n**Images API**: $5\u002F100k stored, $1\u002F100k delivered\n**Transformations**: $0.50\u002F1k (100k\u002Fmonth free per zone)\n**Direct Upload**: Included in API pricing\n\n---\n\n## Official Documentation\n\n- **Images Overview**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002F\n- **Upload API**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Fupload-images\u002F\n- **Transformations**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Ftransform-images\u002F\n- **Direct Creator Upload**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Fupload-images\u002Fdirect-creator-upload\u002F\n- **Variants**: https:\u002F\u002Fdevelopers.cloudflare.com\u002Fimages\u002Fmanage-images\u002Fcreate-variants\u002F\n\n",{},"main","def8531e65114c0fca8fb8551c1871ee0eed705c","skills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images",24,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub","https:\u002F\u002Fskillshub.wtf","https:\u002F\u002Fgithub.com\u002FComeOnOliver","AI & Blockchain Engineer\r\n","2026-06-24 22:07:19",{"source":7,"skillName":5,"commands":36,"prompt":46,"zipAvailable":47},[37,40,43],{"tool":38,"command":39},"npx","npx skills add ComeOnOliver\u002Fskillshub --skill cloudflare-images",{"tool":41,"command":42},"bunx","bunx skills add ComeOnOliver\u002Fskillshub --skill cloudflare-images",{"tool":44,"command":45},"pnpm","pnpm dlx skills add ComeOnOliver\u002Fskillshub --skill cloudflare-images","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002FSKILL.md",true,[49,55,59,63,69,75,79,83,89,93,97,101,105,109,113,117,121,125,129,133,137,141,145,149,153,157,161,165,169,173,177,181,185,189,193,197,201,205,209,213,217,221,225,229,233,237,241,245,249,253,257,261,265],{"path":50,"resourceType":51,"resourceTypeDesc":52,"sizeBytes":53,"sourceHtmlUrl":54},"assets\u002Fdiagrams\u002Fdirect-upload-workflow.md","ASSET","资产文件",5149,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fassets\u002Fdiagrams\u002Fdirect-upload-workflow.md",{"path":56,"resourceType":51,"resourceTypeDesc":52,"sizeBytes":57,"sourceHtmlUrl":58},"assets\u002Fdiagrams\u002Ftransformation-pipeline.md",8377,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fassets\u002Fdiagrams\u002Ftransformation-pipeline.md",{"path":60,"resourceType":51,"resourceTypeDesc":52,"sizeBytes":61,"sourceHtmlUrl":62},"assets\u002Fdiagrams\u002Fvariants-structure.md",10853,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fassets\u002Fdiagrams\u002Fvariants-structure.md",{"path":64,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":67,"sourceHtmlUrl":68},"examples\u002Fbasic-upload\u002F.env.example","OTHER","其他",474,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fbasic-upload\u002F.env.example",{"path":70,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":73,"sourceHtmlUrl":74},"examples\u002Fbasic-upload\u002Fpackage.json","REFERENCE","参考文档",541,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fbasic-upload\u002Fpackage.json",{"path":76,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":77,"sourceHtmlUrl":78},"examples\u002Fbasic-upload\u002Fpublic\u002Findex.html",12068,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fbasic-upload\u002Fpublic\u002Findex.html",{"path":80,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":81,"sourceHtmlUrl":82},"examples\u002Fbasic-upload\u002FREADME.md",6669,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fbasic-upload\u002FREADME.md",{"path":84,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":87,"sourceHtmlUrl":88},"examples\u002Fbasic-upload\u002Fsrc\u002Findex.ts","SCRIPT","脚本",2765,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fbasic-upload\u002Fsrc\u002Findex.ts",{"path":90,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":91,"sourceHtmlUrl":92},"examples\u002Fbasic-upload\u002Fwrangler.jsonc",378,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fbasic-upload\u002Fwrangler.jsonc",{"path":94,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":95,"sourceHtmlUrl":96},"examples\u002Fprivate-images\u002F.env.example",631,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fprivate-images\u002F.env.example",{"path":98,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":99,"sourceHtmlUrl":100},"examples\u002Fprivate-images\u002Fpackage.json",740,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fprivate-images\u002Fpackage.json",{"path":102,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":103,"sourceHtmlUrl":104},"examples\u002Fprivate-images\u002Fpublic\u002Findex.html",18397,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fprivate-images\u002Fpublic\u002Findex.html",{"path":106,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":107,"sourceHtmlUrl":108},"examples\u002Fprivate-images\u002FREADME.md",12805,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fprivate-images\u002FREADME.md",{"path":110,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":111,"sourceHtmlUrl":112},"examples\u002Fprivate-images\u002Fsrc\u002Findex.ts",5342,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fprivate-images\u002Fsrc\u002Findex.ts",{"path":114,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":115,"sourceHtmlUrl":116},"examples\u002Fprivate-images\u002Fwrangler.jsonc",427,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fprivate-images\u002Fwrangler.jsonc",{"path":118,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":119,"sourceHtmlUrl":120},"examples\u002Fresponsive-gallery\u002FREADME.md",4447,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fexamples\u002Fresponsive-gallery\u002FREADME.md",{"path":122,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":123,"sourceHtmlUrl":124},"references\u002Fapi-reference.md",8284,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fapi-reference.md",{"path":126,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":127,"sourceHtmlUrl":128},"references\u002Fcontent-credentials.md",11903,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fcontent-credentials.md",{"path":130,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":131,"sourceHtmlUrl":132},"references\u002Fcustom-domains.md",10803,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fcustom-domains.md",{"path":134,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":135,"sourceHtmlUrl":136},"references\u002Fdirect-upload-complete-workflow.md",11477,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fdirect-upload-complete-workflow.md",{"path":138,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":139,"sourceHtmlUrl":140},"references\u002Fformat-optimization.md",7403,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fformat-optimization.md",{"path":142,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":143,"sourceHtmlUrl":144},"references\u002Fframework-integration.md",15764,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fframework-integration.md",{"path":146,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":147,"sourceHtmlUrl":148},"references\u002Foverlays-watermarks.md",11363,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Foverlays-watermarks.md",{"path":150,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":151,"sourceHtmlUrl":152},"references\u002Fpolish-compression.md",10624,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fpolish-compression.md",{"path":154,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":155,"sourceHtmlUrl":156},"references\u002Fresponsive-images-patterns.md",6213,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fresponsive-images-patterns.md",{"path":158,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":159,"sourceHtmlUrl":160},"references\u002Fsetup-guide.md",3849,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fsetup-guide.md",{"path":162,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":163,"sourceHtmlUrl":164},"references\u002Fsigned-urls-guide.md",7731,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fsigned-urls-guide.md",{"path":166,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":167,"sourceHtmlUrl":168},"references\u002Fsourcing-kit.md",15336,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fsourcing-kit.md",{"path":170,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":171,"sourceHtmlUrl":172},"references\u002Ftop-errors.md",11936,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Ftop-errors.md",{"path":174,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":175,"sourceHtmlUrl":176},"references\u002Ftransformation-options.md",6602,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Ftransformation-options.md",{"path":178,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":179,"sourceHtmlUrl":180},"references\u002Fvariants-guide.md",6845,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fvariants-guide.md",{"path":182,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":183,"sourceHtmlUrl":184},"references\u002Fwebhooks-guide.md",12075,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Freferences\u002Fwebhooks-guide.md",{"path":186,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":187,"sourceHtmlUrl":188},"scripts\u002Fanalyze-usage.sh",6103,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fscripts\u002Fanalyze-usage.sh",{"path":190,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":191,"sourceHtmlUrl":192},"scripts\u002Fcheck-versions.sh",3377,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fscripts\u002Fcheck-versions.sh",{"path":194,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":195,"sourceHtmlUrl":196},"scripts\u002Fgenerate-signed-url.sh",3761,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fscripts\u002Fgenerate-signed-url.sh",{"path":198,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":199,"sourceHtmlUrl":200},"scripts\u002Ftest-upload.sh",3855,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fscripts\u002Ftest-upload.sh",{"path":202,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":203,"sourceHtmlUrl":204},"scripts\u002Fvalidate-variants.sh",4677,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Fscripts\u002Fvalidate-variants.sh",{"path":206,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":207,"sourceHtmlUrl":208},"templates\u002Fbatch-upload.ts",8022,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fbatch-upload.ts",{"path":210,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":211,"sourceHtmlUrl":212},"templates\u002Fdirect-creator-upload-backend.ts",5570,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fdirect-creator-upload-backend.ts",{"path":214,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":215,"sourceHtmlUrl":216},"templates\u002Fdirect-creator-upload-frontend.html",8582,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fdirect-creator-upload-frontend.html",{"path":218,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":219,"sourceHtmlUrl":220},"templates\u002Fnextjs-integration.tsx",11682,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fnextjs-integration.tsx",{"path":222,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":223,"sourceHtmlUrl":224},"templates\u002Foverlay-watermark.ts",14042,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Foverlay-watermark.ts",{"path":226,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":227,"sourceHtmlUrl":228},"templates\u002Fpackage.json",387,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fpackage.json",{"path":230,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":231,"sourceHtmlUrl":232},"templates\u002Fremix-integration.tsx",15159,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fremix-integration.tsx",{"path":234,"resourceType":71,"resourceTypeDesc":72,"sizeBytes":235,"sourceHtmlUrl":236},"templates\u002Fresponsive-images-srcset.html",8169,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fresponsive-images-srcset.html",{"path":238,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":239,"sourceHtmlUrl":240},"templates\u002Fsigned-urls-generation.ts",6726,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fsigned-urls-generation.ts",{"path":242,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":243,"sourceHtmlUrl":244},"templates\u002Ftransform-via-url.ts",6625,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Ftransform-via-url.ts",{"path":246,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":247,"sourceHtmlUrl":248},"templates\u002Ftransform-via-workers.ts",8870,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Ftransform-via-workers.ts",{"path":250,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":251,"sourceHtmlUrl":252},"templates\u002Fupload-api-basic.ts",3922,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fupload-api-basic.ts",{"path":254,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":255,"sourceHtmlUrl":256},"templates\u002Fupload-via-url.ts",5053,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fupload-via-url.ts",{"path":258,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":259,"sourceHtmlUrl":260},"templates\u002Fvariants-management.ts",7122,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fvariants-management.ts",{"path":262,"resourceType":85,"resourceTypeDesc":86,"sizeBytes":263,"sourceHtmlUrl":264},"templates\u002Fwebhook-handler.ts",8991,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fwebhook-handler.ts",{"path":266,"resourceType":65,"resourceTypeDesc":66,"sizeBytes":267,"sourceHtmlUrl":268},"templates\u002Fwrangler-images-binding.jsonc",1264,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fsecondsky\u002Fclaude-skills\u002Fcloudflare-images\u002Ftemplates\u002Fwrangler-images-binding.jsonc",[270,284,294,303,309,316],{"skillNo":271,"name":272,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":273,"categories":274,"keywords":280,"publishedAt":21},"01M6FKJN13GMG4KY57J3QD8GY5","model-hierarchy-skill","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzscole\u002Fmodel-hierarchy-skill\u002Fmodel-hierarchy-skill\u002FSKILL.md",[275],{"categoryNo":276,"categoryName":277,"taxonomyType":278,"taxonomyTypeDesc":279},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[281,282,283],"model","model hierarchy","model hierarchy skill",{"skillNo":285,"name":286,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":287,"categories":288,"keywords":290,"publishedAt":21},"01M6FKJJJ6GCAMR4PPPRD12M5X","zoom-mcp","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-mcp\u002FSKILL.md",[289],{"categoryNo":276,"categoryName":277,"taxonomyType":278,"taxonomyTypeDesc":279},[291,292,293],"MCP","zoom","zoom mcp",{"skillNo":295,"name":296,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":297,"categories":298,"keywords":299,"publishedAt":21},"01M6FKJE3KYT3KPEZMEEHYKA6K","zoom-apps-sdk","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-apps-sdk\u002FSKILL.md",[],[300,301,302,292],"sdk","zoom apps sdk","apps",{"skillNo":304,"name":305,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":306,"categories":307,"keywords":308,"publishedAt":21},"01M6FKJ9EDH9Q5VWDF8HAJRSP0","windows","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwindows\u002FSKILL.md",[],[305],{"skillNo":310,"name":311,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":312,"categories":313,"keywords":315,"publishedAt":21},"01M6FKJ666BEEFC3AE9GJ72Q93","whiteboard","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwhiteboard\u002FSKILL.md",[314],{"categoryNo":276,"categoryName":277,"taxonomyType":278,"taxonomyTypeDesc":279},[311],{"skillNo":317,"name":318,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":319,"categories":320,"keywords":321,"publishedAt":21},"01M6FKJ21WFCDGTJQ2Q91T9DVW","websockets","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwebsockets\u002FSKILL.md",[],[318]]