{"id":15715371,"url":"https://github.com/cloudflare/managed-component-to-cloudflare-worker","last_synced_at":"2025-10-20T04:30:30.458Z","repository":{"id":171601623,"uuid":"623430332","full_name":"cloudflare/managed-component-to-cloudflare-worker","owner":"cloudflare","description":"Deploy Managed Components as Cloudflare Workers and use them in Cloudflare Zaraz","archived":false,"fork":false,"pushed_at":"2024-10-01T14:28:34.000Z","size":131,"stargazers_count":14,"open_issues_count":4,"forks_count":6,"subscribers_count":8,"default_branch":"main","last_synced_at":"2024-10-04T21:41:28.567Z","etag":null,"topics":["cloudflare","cloudflare-workers","managed-components","workers","zaraz"],"latest_commit_sha":null,"homepage":"https://www.cloudflare.com/products/zaraz/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cloudflare.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-04T11:04:20.000Z","updated_at":"2024-09-20T01:57:01.000Z","dependencies_parsed_at":null,"dependency_job_id":"d79f238b-8c19-4246-b73d-d981e7ff8ead","html_url":"https://github.com/cloudflare/managed-component-to-cloudflare-worker","commit_stats":null,"previous_names":["cloudflare/managed-component-to-cloudflare-worker"],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudflare%2Fmanaged-component-to-cloudflare-worker","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudflare%2Fmanaged-component-to-cloudflare-worker/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudflare%2Fmanaged-component-to-cloudflare-worker/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudflare%2Fmanaged-component-to-cloudflare-worker/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cloudflare","download_url":"https://codeload.github.com/cloudflare/managed-component-to-cloudflare-worker/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":219869309,"owners_count":16555579,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cloudflare","cloudflare-workers","managed-components","workers","zaraz"],"created_at":"2024-10-03T21:41:20.016Z","updated_at":"2025-10-20T04:30:30.149Z","avatar_url":"https://github.com/cloudflare.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Managed Component To Cloudflare Worker\n\nManaged Component To Cloudflare Worker provides an easy way for using custom [Managed Components](https://managedcomponents.dev/) with Cloudflare Zaraz, by deploying them as a Cloudflare Worker. Deployed Managed Components can be configured as Tools within [Cloudflare Zaraz](https://dash.cloudflare.com/) from the \"Add new Tool\" page.\n\n## Usage\n\n\u003e 💡 **Prerequisite:** To deploy a new Cloudflare Worker you need to first login with using `npx wrangler login`\n\n### Recommended: Using `npx`\n\nYour Managed Component should be bundled before trying to deploy it.\n\n`npx managed-component-to-cloudflare-worker /path/to/managed/component.js component-name`\n\n### Advanced: Custom wrangler.toml Configuration Using `npx`\nPass the path to your custom wrangler.toml file as an optional third argument. Passed in component name will override the name in the custom wrangler.toml file. Assumes that a KV binding is configured in the custom wrangler.toml file bound to `KV` if required by the component.\n\n`npx managed-component-to-cloudflare-worker /path/to/managed/component.js component-name /path/to/wrangler.toml`\n\n### Advanced: Manual Worker setup\n\nThis method gives you more flexibility but requires you to be familiar with `wrangler` and Cloudflare Workers in general.\n\n1. Clone this repository\n2. Copy your Managed Component files to `./src` (it's recommended to create a new directory within `./src` if you're not using an already bundled Managed Component)\n3. Import your Managed Component in index.ts by replacing the line `import component from './component.js'` with your `import` command\n4. Edit [wrangler.toml](wrangler.toml) if you need to change the Worker name or if you're using a more complex Worker configuration for your Managed Component. Your Worker name must start with `custom-mc-` for it to appear in the Cloudflare Dashboard.\n5. If you're using any of the storage or cache methods (`get`, `set`, `useCache`, `invalidateCache`) in your component,\n  you have to add a KV binding. There are two ways to do this:\n\n     Option 1. Run `npx wrangler kv:namespace create \u003cKV_NAMESPACE\u003e`, copy the `id` string, and add binding in [wrangler.toml](wrangler.toml) as follows:\n\n     ```\n     kv_namespaces = [\n         { binding = \"KV\", id = \"\u003cYOUR_KV_ID\u003e\" }\n        ]\n     ```\n     Option 2. After publishing this Managed Component as worker, follow [these steps](https://developers.cloudflare.com/workers/configuration/environment-variables/#add-environment-variables-via-the-dashboard) to add a KV binding as environment variable with variable name `KV`.\n\n1. Run `npx wrangler publish`\n\n#### Environment Variables / Bindings\n\nTo use worker environment variables/secrets in your managed component, add variables [via wrangler](https://developers.cloudflare.com/workers/configuration/environment-variables/#add-environment-variables-via-wrangler) or [via dashboard](https://developers.cloudflare.com/workers/configuration/environment-variables/#add-environment-variables-via-the-dashboard) and use them in your component through the `Manager.ext` parameter: `manager.ext.env.YOUR_ENV_VARIABLE`","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcloudflare%2Fmanaged-component-to-cloudflare-worker","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcloudflare%2Fmanaged-component-to-cloudflare-worker","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcloudflare%2Fmanaged-component-to-cloudflare-worker/lists"}