https://github.com/optimizely/edge-delivery
https://github.com/optimizely/edge-delivery
optimizely-environment-prod optimizely-environment-public optimizely-owner-cjs
Last synced: 11 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/optimizely/edge-delivery
- Owner: optimizely
- License: apache-2.0
- Created: 2024-05-09T16:43:55.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-05-15T15:49:12.000Z (10 months ago)
- Last Synced: 2025-05-15T16:42:55.665Z (10 months ago)
- Topics: optimizely-environment-prod, optimizely-environment-public, optimizely-owner-cjs
- Language: TypeScript
- Homepage:
- Size: 7.31 MB
- Stars: 1
- Watchers: 9
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
Optimizely Edge Delivery SDK
Optimizely Edge Delivery lets you execute Optimizely Web experiments on Cloudflare Workers.
## Prequisites
- You must have a [Cloudflare Account](https://dash.cloudflare.com/sign-up/workers-and-pages).
- You must install the [Wrangler CLI](https://developers.cloudflare.com/workers/wrangler/).
## Quick Start
#TODO: turn this into a cloudflare worker template instead
To get started quickly with a new project:
1. Clone this repository and navigate to the templates/edge-delivery-starter directory
```bash
cd templates/edge-delivery-starter
```
1. Install requirements
```bash
npm install
```
1. Run the worker locally
```bash
npm run dev
```
This will open your worker executing in a browser. This loads the website https://example.com/ and executes an experiment that modifies the `h1` header text on the edge.
1. Modify the `SNIPPET_ID` and `DEV_URL` environment variables in the in the [wrangler.toml file](./templates/edge-delivery-starter/wrangler.toml). In this project, these are set to an example Optimizely Web Experiment by default. Modify these to your to test an Optimizely Web Experiment against your own website.
- Run `npm run dev` again to test the changes.
1. Log in to your Cloudflare account using OAuth
```bash
wrangler login
```
1. Deploy the worker to your Cloudflare account:
```bash
npm run deploy
```
1. On Cloudflare, add a route for your worker for the target website you want to proxy
- Alternatively, you can do this by [adding a route to the wrangler.toml](https://developers.cloudflare.com/workers/configuration/routing/routes/#set-up-a-route-in-wranglertoml) before running `npm run deploy`.
1. Navigate to your website in a browser, and see your experiments in action!
## Implementing in an existing Worker
You can install the Optimizely Edge Delivery SDK in any existing Cloudflare Worker, whether you already route your incoming traffic through a Cloudflare Worker, or you'd prefer to start from scratch using Cloudflare's [getting started guide](https://developers.cloudflare.com/workers/get-started/guide/).
### Installing the Edge Delivery SDK
To install the Edge Delivery library, download and install the latest version of the [edge-delivery npm package](https://www.npmjs.com/package/@optimizely/edge-delivery):
```bash
npm install @optimizely/edge-delivery@latest
```
### Implementing and executing experiments
The SDK requires a Snippet ID (`snippetId`) to know which configuration file to retrieve to execute your experiments.
#### Basic configuration options
It's recommended to set a Development URL (`devUrl`) for the SDK to use as a target when testing locally or at your worker site directly.
```typescript
const options = {
"snippetId": "29061560280",
"devUrl": "https://example.com/"
};
```
#### applyExperiments
The `applyExperiments` method is used to execute experiments. This method uses the request information to make experiment bucketing decisions and apply active experiment variations to the control. Any decisions or changes that cannot be made on the edge are packaged together and added to the `` element for execution on the browser.
```typescript
import { applyExperiments } from '@optimizely/edge-delivery';
...
await applyExperiments(request, ctx, options);
```
#### Other configuration options
Optionally, you may pass a Response object as the control in the `options` parameter. This can be useful if you already have an existing Cloudflare Worker that, for example, makes modifications to the control outside of Optimizely experiments.
```typescript
let control = await fetch(request);
...
const options = {
// Other options
"control": control
};
```