> ## Documentation Index
> Fetch the complete documentation index at: https://upstash-dx-2808-improve-quickstarts.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Cloudflare Workers

<Snippet file="redis/start-redis-snippet.mdx" />

### Database Setup

Create a Redis database using [Upstash Console](https://console.upstash.com) or
[Upstash CLI](https://github.com/upstash/cli).

### Project Setup

We will use **C3 (create-cloudflare-cli)** command-line tool to create our application. You can open a new terminal window and run C3 using the prompt below.

<CodeGroup>
  ```shell npm theme={null}
  npm create cloudflare@latest -- upstash-redis-worker
  ```

  ```shell yarn theme={null}
  yarn create cloudflare upstash-redis-worker
  ```

  ```shell pnpm theme={null}
  pnpm create cloudflare upstash-redis-worker
  ```
</CodeGroup>

This will create a new Cloudflare Workers project:

```text theme={null}
➜  npm create cloudflare@latest -- upstash-redis-worker

> npx
> create-cloudflare upstash-redis-worker


─────────────────────────────────────────────────────────────────────────────────────────────────
👋 Welcome to create-cloudflare vX.Y.Z!
🧡 Let's get started.
📊 Cloudflare collects telemetry about your usage of Create-Cloudflare.

Learn more at: https://github.com/cloudflare/workers-sdk/blob/main/packages/create-cloudflare/telemetry.md
─────────────────────────────────────────────────────────────────────────────────────────────────

╭ Create an application with Cloudflare Step 1 of 3
│
├ In which directory do you want to create your application?
│ dir ./upstash-redis-worker
│
├ What would you like to start with?
│ category Hello World example
│
├ Which template would you like to use?
│ type Worker only
│
├ Which language do you want to use?
│ lang TypeScript
│
├ Copying template files
│ files copied to project directory
│
├ Updating name in `package.json`
│ updated `package.json`
│
├ Installing dependencies
│ installed via `npm install`
│
╰ Application created 

...

────────────────────────────────────────────────────────────
🎉  SUCCESS  Application created successfully!
```

We will also install the **Upstash Redis SDK** to connect to Redis.

```bash theme={null}
npm install @upstash/redis
```

### The Code

Here is a Worker template to configure and test Upstash Redis connection.

<CodeGroup>
  ```ts src/index.ts theme={null}
  import { Redis } from "@upstash/redis/cloudflare";

  export interface Env {
    UPSTASH_REDIS_REST_URL: string;
    UPSTASH_REDIS_REST_TOKEN: string;
  }

  export default {
    async fetch(request, env, ctx): Promise<Response> {
      const redis = Redis.fromEnv(env);
      const count = await redis.incr("counter");
      return new Response(JSON.stringify({ count }));
    },
  } satisfies ExportedHandler<Env>;
  ```

  ```js src/index.js theme={null}
  import { Redis } from "@upstash/redis/cloudflare";

  export default {
    async fetch(request, env, ctx) {
      const redis = Redis.fromEnv(env);
      const count = await redis.incr("counter");
      return new Response(JSON.stringify({ count }));
    },
  };
  ```
</CodeGroup>

### Configure Credentials

There are two methods for setting up the credentials for Redis. One for worker level, the other for account level.

#### Using Cloudflare Secrets (Worker Level Secrets)

This is the common way of creating secrets for your worker, see [Workers Secrets](https://developers.cloudflare.com/workers/configuration/secrets/)

The recommended method is the Wrangler CLI, since secrets added this way persist
across deployments. Navigate to [Upstash Console](https://console.upstash.com),
get your Redis credentials and run in your project directory:

```shell theme={null}
npx wrangler secret put UPSTASH_REDIS_REST_URL
npx wrangler secret put UPSTASH_REDIS_REST_TOKEN
```

Each command prompts you for the secret value.

Alternatively, you can add the secrets from the dashboard:

* Navigate to [Upstash Console](https://console.upstash.com) and get your Redis credentials.

* In [Cloudflare Dashboard](https://dash.cloudflare.com/), Go to **Compute (Workers)** > **Workers & Pages**.

* Select your worker and go to **Settings** > **Variables and Secrets**.

* Add your Redis credentials as secrets here:

<Frame>
  <img src="https://mintcdn.com/upstash-dx-2808-improve-quickstarts/SIhn1t4MrDLDsHsN/img/cloudflare-integration/redis-secrets.png?fit=max&auto=format&n=SIhn1t4MrDLDsHsN&q=85&s=bcd71a7800a7266a2e33758e5b4b2201" width="1716" height="626" data-path="img/cloudflare-integration/redis-secrets.png" />
</Frame>

#### Using Cloudflare Secrets Store (Account Level Secrets)

This method requires a few modifications in the worker code, see [Access to Secret on Env Object](https://developers.cloudflare.com/secrets-store/integrations/workers/#3-access-the-secret-on-the-env-object)

```ts src/index.ts theme={null}
import { Redis } from "@upstash/redis/cloudflare";

export interface Env {
  UPSTASH_REDIS_REST_URL: SecretsStoreSecret;
  UPSTASH_REDIS_REST_TOKEN: SecretsStoreSecret;
}

export default {
  async fetch(request, env, ctx): Promise<Response> {
    const redis = Redis.fromEnv({
      UPSTASH_REDIS_REST_URL: await env.UPSTASH_REDIS_REST_URL.get(),
      UPSTASH_REDIS_REST_TOKEN: await env.UPSTASH_REDIS_REST_TOKEN.get(),
    });
    const count = await redis.incr("counter");
    return new Response(JSON.stringify({ count }));
  },
} satisfies ExportedHandler<Env>;
```

After doing these modifications, you can deploy the worker to Cloudflare with `npx wrangler deploy`, and
follow the steps below to define the secrets:

* Navigate to [Upstash Console](https://console.upstash.com) and get your Redis credentials.

* In [Cloudflare Dashboard](https://dash.cloudflare.com/), Go to **Secrets Store** and add Redis credentials as secrets.

<Frame>
  <img src="https://mintcdn.com/upstash-dx-2808-improve-quickstarts/SIhn1t4MrDLDsHsN/img/cloudflare-integration/redis-secrets-store.png?fit=max&auto=format&n=SIhn1t4MrDLDsHsN&q=85&s=21cbe86e2b78a26e1db1308048eec8f7" width="1940" height="1110" data-path="img/cloudflare-integration/redis-secrets-store.png" />
</Frame>

* Under **Compute (Workers)** > **Workers & Pages**, find your worker and add these secrets as bindings.

<Frame>
  <img src="https://mintcdn.com/upstash-dx-2808-improve-quickstarts/SIhn1t4MrDLDsHsN/img/cloudflare-integration/redis-add-binding.png?fit=max&auto=format&n=SIhn1t4MrDLDsHsN&q=85&s=87a6e00abef408f5ae4c510a0238a024" width="1940" height="1370" data-path="img/cloudflare-integration/redis-add-binding.png" />
</Frame>

### Deployment

<Note>
  Newer deployments may revert the configurations you did in the dashboard.
  While worker level secrets persist, the bindings will be gone!
</Note>

Deploy your function to Cloudflare with `npx wrangler deploy`

The endpoint of the function will be provided to you, once the deployment is done.

### Testing

Open a different terminal and test the endpoint. Note the destination
url is the same that was printed in the previous deploy step.

```bash theme={null}
curl https://<your-worker-name>.<account-name>.workers.dev
```

The response will be in the format of `{"count":20}`

In the logs you should see something like this:

```bash theme={null}
$ npx wrangler tail

⛅️ wrangler X.Y.Z
--------------------

Successfully created tail, expires at <expiry-date>
Connected to <your-worker-name>, waiting for logs...
GET https://<your-worker-name>.<account-name>.workers.dev/ - Ok @ <timestamp>
```

## Repositories

Javascript:
[https://github.com/upstash/upstash-redis/tree/main/examples/cloudflare-workers](https://github.com/upstash/upstash-redis/tree/main/examples/cloudflare-workers)

Typescript:
[https://github.com/upstash/upstash-redis/tree/main/examples/cloudflare-workers-with-typescript](https://github.com/upstash/upstash-redis/tree/main/examples/cloudflare-workers-with-typescript)