How to block Google's FLoC tracking with Express

This post assumes you know what Google’s FLoC tracking is.

This post is meant for people who want to copy-paste something and be done. See the “Notes” section below for more details.

Google is rolling out an experimental and controversial ad targeting technology called FLoC, short for “Federated Learning of Cohorts”. If you want to block Google from doing this to the users of your Express application, read on.

Option 1: write a short middleware

You can block FLoC with a four-line middleware function. Here’s what it might look like in an Express app:

app.use((req, res, next) => {
  res.setHeader("Permissions-Policy", "interest-cohort=()");
  next();
});

As you can see, all you need to do is set the Permissions-Policy HTTP response header to a specific value and you’re done. (If you’re already setting the Permissions-Policy header, see the “Notes” section below.)

To make sure this header is set for all of your responses, put this right after creating the app with express(). (You can be more judicious about where you set this if you want. See the “Notes” section below.)

If you’re using TypeScript, here’s what that might look like:

import * as http from "http";

// ...

app.use(
  (
    _req: http.IncomingMessage,
    res: http.ServerResponse,
    next: () => void
  ) => {
    res.setHeader("Permissions-Policy", "interest-cohort=()");
    next();
  }
);

Option 2: use a package

Many JavaScript developers love to install packages even for the smallest tasks. If you’re one of these people, you can use the floc-block package (which I maintain).

First, install the package with npm install floc-block. Then, in your app:

const flocBlock = require("floc-block");

// ...

app.use(flocBlock());

Like the option above, I generally recommend putting this right after creating the app with express(). That ensures the value is set for all responses.

Also like above, this middleware sets the Permissions-Policy HTTP response header. In fact, the code is nearly identical to the option above.

This project works with TypeScript and JavaScript, and is basically identical to Option 1 except someone else (me) wrote those four lines.

Notes

• The real solution to FLoC is not for all webmasters to set some HTTP header. In practice, developers should push to squash ad tracking holistically. This is more a social and legal challenge than a technical one.

• FLoC is an experimental technology which may change. It’s possible that there will be different ways to block FLoC in the future, or that FLoC might be dropped entirely.

• If you’re already using the Permissions-Policy HTTP response header for something else, the options above will overwrite your work! Adding interest-cohort=() to your policy should do this.

  If you want to use an npm package to manage the Permissions-Policy header, check out permissions-policy.

• If you want the header to be set for all responses, I recommend putting the middleware right after you set up the app with express(). That ensures that the middleware will be called for every request.

  However, your application may have different needs. Because these solutions are just normal Express middlewares, you can use existing knowledge of Express middleware to figure out how to set the header more judiciously.

• You may not wish to set headers like this at the Express level. For example, if your app is behind nginx, you should probably use nginx to set these headers.