How to use environment variables in CloudFlare Worker in local development environment

Question

I have a CloudFlare Worker where I have environment variables set in the CF Settings..Environment Variables interface. I also have this wrangler.toml

In my worker's index.js I have code reading the variable REGISTRATION_API_URL. If the code is running in a deployed environment then it injects the value from the CF Settings into REGISTRATION_API_URL just fine.

But if I run wrangler dev or wrangler dev --env local then REGISTRATION_API_URL is undefined.

Originally I expected that the variable would be populated by the CF Settings values, but they aren't. So I tried the two vars setting in the wrangler.toml I show here but no difference. And I have spent a lot of time searching the docs and the greater web.

Are environment variables supported in a local dev environment? Any workarounds that people have come up with? Currently I am looking for undefined and defining the variable with a hard-coded value, but this is not a great answer.

Using wrangler 1.16.0

Thanks.

Heilungkiang

According to the Cloudflare docs what you're doing should work. I just tried this with Wrangler2 (currently in beta) but wasn't able to achieve what I wanted. Have you tried the newer version? – Rice

Thanks, no we decided it wasn't worth the problems we were having and moved to a different solution. – Heilungkiang

Answer 1

The docs could be more clear IMO but if you are using the newer module syntax, the variables will not be available as global variables.

Environmental variables with module workers

When deploying a Module Worker, any bindings will not be available as global runtime variables. Instead, they are passed to the handler as a parameter – refer to the FetchEvent documentation for further comparisons and examples .

Here's an example.

export default {
    async fetch(request, env, context) {
        return new Response(env.MY_VAR);
    }
};

KV namespaces are also available in the same object.

Fayum

It saves my day! Thanks a lot. CF definitely should update their documents. – Supranatural

OMG, I've lost two days trying to manage this issue. Cloudflare must update their poor documentation. – Millardmillboard

New way is through a .dev.vars file, see my answer below. – Translocate

Answer 2

The new way to do it is actually through .dev.vars file which should be written as any dotenv file.

https://developers.cloudflare.com/workers/configuration/secrets/

This will get picked up by the dev server, for prod push the secrets to the CF dashboard via the wrangler secret put SECRET_NAME command

Translocate

Answer 3

Maybe a bit late, but: no I don't think you can

But: you can always use self["YOUR_ENV_VARIABLE"] to get the value and then go from there (unfortunately the docs don't mention that)

Here is what I personally do in my Workers Site project to get the Release version (usually inserted via pipeline/action and then inserted via HtmlRewriter into the index.html):

const releaseVersion = self["RELEASE_VERSION"] || 'unknown'

Shool