Dev
Generator für gefälschte CDN-URL-Sets
A fake CDN URL set generator solves a recurring dev problem: you need realistic asset URLs for fixtures, mocks, or UI components, but pointing at live CDNs is a bad idea. This tool produces plausible content delivery network URLs complete with versioned paths, content hashes, and proper file extensions — images, JS bundles, CSS, web fonts, and video files. Each URL mirrors patterns you'd see from CloudFront or Fastly, making them drop-in substitutes in dev environments. For example, generate 20 mixed URLs and paste them straight into a Storybook story or a Vitest fixture file. Choose a specific file type or use mixed mode to get a varied batch across all asset categories.
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.
What is a CDN and why use one?
A CDN (content delivery network) is a distributed set of servers that caches your static assets close to users worldwide, cutting load times and offloading traffic from your origin server. The generator produces realistic CDN-style asset URLs — with versioning and content hashes — so you can test asset loaders, link rewriting, and HTML generation against URLs that look like a real CDN's.
What is cache busting and how do hashes help?
Cache busting forces browsers and CDNs to fetch a new version of a file when it changes, usually by embedding a content hash in the filename (app.3f9a2c.js) so a changed file gets a new URL that bypasses the old cache. The generator includes these hashes in its fake URLs, so your tests cover the hashed-asset pattern real build tools produce rather than static, unversioned paths.
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.