Dev
Fake CDN URL Set Generator
Pointing tests or Storybook stories at live CDN assets couples your dev environment to external network conditions and real file locations. This generator produces structurally plausible CDN URLs — with versioned paths like /v3.7.2/images/hero.jpg or content-hash filenames like banner.a3f92c1b.webp — that you can use anywhere a remote asset URL is expected without touching a real CDN. The count input controls how many URLs you get per run, up to 50. The file type dropdown filters the asset category: images (jpg, png, webp, avif, svg), scripts (js, mjs), styles (css), fonts (woff2, woff, ttf), or videos (mp4, webm). Mixed mode pulls from all categories in a single batch, which is the right choice for a media library UI or a DAM mock response. Each URL uses one of five realistic-looking domain names and alternates randomly between hash-suffixed and version-prefixed path patterns, matching what Webpack, Vite, and Rollup actually emit. A concrete workflow: generate 20 mixed URLs, import them as a JSON array in your Storybook story's argTypes, and you get realistic pagination behaviour from a media asset grid without any backend. For CSP testing, generate several batches of different file types, note the CDN domains in use, and build both your allow-list and block-list test cases from the same set.
How to use
- Choose your options above
- Click Generate
- Copy your result
Detailed instructions
- Set the Number of URLs input to how many CDN URLs your fixture or test needs.
- Choose a File Type from the dropdown — pick 'mixed' for variety or a specific type like 'image' or 'font' for uniform fixtures.
- Click Generate to produce the URL set with realistic domains, versioned paths, and content hashes.
- Copy the full list and paste directly into your fixture file, mock API handler, or database seed script.
Use Cases
- •Testing CSP allow-list logic against a pool of varied CDN hostnames and path structures
- •Seeding a Postgres staging database with realistic product image and video asset URLs
- •Populating Storybook stories with remote font and stylesheet URL references
- •Building Jest or Vitest fixtures that validate URL parsing against both hash-based and versioned paths
- •Mocking asset management API responses in Postman collections during backend integration testing
Tips
- →Use 'mixed' file type when seeding a media library UI — varied extensions expose edge cases in icon rendering and MIME-type display logic.
- →Generate 50+ URLs and import them as a JSON array in Storybook argTypes to get realistic pagination behavior without a real backend.
- →When testing CSP, generate several batches and note the different CDN domains — use them to build both your allow-list and your block-list test cases.
- →If your URL parser uses regex, specifically look for URLs with both a version segment (/v2/) and a hash suffix — some parsers handle one but silently drop the other.
- →For Playwright visual tests, map each generated URL to a mocked network route returning a placeholder image so screenshots remain deterministic across runs.
FAQ
why do CDN URLs have hashes in them and should fake ones match that pattern
Content-hash suffixes like hero.a3f92c1b.webp let browsers cache files indefinitely — when the file changes, the hash changes, forcing a fresh download. This is standard output from Webpack, Vite, and Rollup. If your test URLs skip hashes, any regex or cache-invalidation logic that depends on them won't get proper coverage.
can I actually fetch these generated CDN URLs or will they return real files
No — these are structurally realistic but entirely fictional. The domains don't host real files, so fetching them returns DNS errors or timeouts. For end-to-end testing with real responses, pair these URLs with a local mock server like MSW or an Express stub that intercepts the domain and returns a placeholder asset.
what's the difference between mixed and single file type when generating CDN URLs
Mixed mode generates a batch spanning images (jpg, webp, avif), JS bundles, CSS stylesheets, woff2 fonts, and mp4/webm video — ideal for a media-heavy fixture or a DAM mock response. A single file type gives a homogeneous set, which is better when testing a specific pipeline like an image optimizer, where mixing extensions would introduce unrelated variables.
do the generated URLs always use a content hash or are some versioned differently
The generator randomly alternates between two patterns: a hash-suffixed filename like banner.a3f92c1b.webp and a version-prefixed path like /v2.14.3/images/logo.png. This mirrors real-world variation between build tools, so your URL parsers and cache logic get coverage for both styles in a single batch.
You might also like
Popular tools from other categories that share themes with this one.
Try these next
More free tools from other corners of the catalog, picked by shared themes.