managed-component-to-cloudflare-worker-cli
v1.6.1
Published
Managed 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 withi
Downloads
10
Readme
Managed Component To Cloudflare Worker
Managed Component To Cloudflare Worker provides an easy way for using custom Managed Components with Cloudflare Zaraz, by deploying them as a Cloudflare Worker. Deployed Managed Components can be configured as Tools within Cloudflare Zaraz from the "Add new Tool" page.
Usage
💡 Prerequisite: To deploy a new Cloudflare Worker you need to first login with using
npx wrangler login
Recommended: Using npx
Your Managed Component should be bundled before trying to deploy it.
npx managed-component-to-cloudflare-worker /path/to/managed/component.js component-name
Advanced: Custom wrangler.toml Configuration Using npx
Pass 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.
npx managed-component-to-cloudflare-worker /path/to/managed/component.js component-name /path/to/wrangler.toml
Advanced: Manual Worker setup
This method gives you more flexibility but requires you to be familiar with wrangler
and Cloudflare Workers in general.
Clone this repository
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)Import your Managed Component in index.ts by replacing the line
import component from './component.js'
with yourimport
commandEdit 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.If you're using any of the storage or cache methods (
get
,set
,useCache
,invalidateCache
) in your component, you have to add a KV binding. There are two ways to do this:Option 1. Run
npx wrangler kv:namespace create <KV_NAMESPACE>
, copy theid
string, and add binding in wrangler.toml as follows:kv_namespaces = [ { binding = "KV", id = "<YOUR_KV_ID>" } ]
Option 2. After publishing this Managed Component as worker, follow these steps to add a KV binding as environment variable with variable name
KV
.Run
npx wrangler publish
Environment Variables / Bindings
To use worker environment variables/secrets in your managed component, add variables via wrangler or via dashboard and use them in your component through the Manager.ext
parameter: manager.ext.env.YOUR_ENV_VARIABLE