Cloudflare Developers•13mo ago

Recommended way of registering a Durable Object

hey people! what's the recommended way of registering a Durable Object when deploying an application (Remix) using Cloudflare Pages. Do I need to create a separate project just to deploy that? or can it be wihtin the Cloudflare Pages repo? I've seen an example using /durable_objects to register a Durable Object within a Pages repo but I'm unable to get it listed in the Cloudflare Dashboard. What am I missing?

9 Replies

niconiahiOP•13mo ago

this is what I have in my wrangler.toml

[[durable_objects.bindings]]
name = "BROADCASTER"
class_name = "Broadcaster"
script_name = "durable_objects/broadcaster.ts"

[[migrations]]
tag = "v1"
new_classes = ["Broadcaster"]

[[durable_objects.bindings]]
name = "BROADCASTER"
class_name = "Broadcaster"
script_name = "durable_objects/broadcaster.ts"

[[migrations]]
tag = "v1"
new_classes = ["Broadcaster"]

DaniFoldi•13mo ago

hey! you're quite close - there's just one limitation of Pages that you've run into So Pages doesn't actually read your wrangler.toml, and Pages projects can't "define" Durable Objects, you need a separate worker. Examples that have it in a subfolder deploy /durable_objects as a separate Worker and bind to its DO from the Pages dashboard

niconiahiOP•13mo ago

how I'm I supposed to deploy this /durable_objects directory? with wrangler deploy command? maybe some link I can read about what I'm missing, would be excellent thanks for this! It's already very explanatory I found this one. Is it up to date? https://blog.cloudflare.com/building-full-stack-with-pages/

ASchmidIT•13mo ago

Hang on, isn't pages supposed to have "functions" which are the equivalent of workers? It was my understanding that in Remix code what is declared as loader and action functions will be converted to functions and will behave as a worker would. Is this not the case?

DaniFoldi•13mo ago

It is the case, in 99.9% of the cases. Pages Functions can't declare queue consumers or define Durable Object classes. Everything else should work (assuming it has support in Pages, which is the case for most bindings, other than 1-2 newer ones)

ASchmidIT•13mo ago

Thanks, glad to hear that. I think it's a bit less than 99.9%. The big issue I run into is that Pages functions don't have a global context like Workers do. Hence accessing context via environment variables, as in KV, Durable Objects, etc. becomes an issue.

niconiahiOP•13mo ago

is it true that's being developed a way of unifying how to consume Cloudflare services? this is just curiousity following up with the question, I was able to deploy my Durable Object. I'll give you my full information because I can't seem to find the solution this is the standalone Worker I created to be able to upload the Durable Object

import { Broadcaster } from "./durable_objects/broadcaster";

export interface Env {
  BROADCASTER: DurableObjectNamespace;
}

export default {
  async fetch(request: Request, env: Env) {
    return new Response("success");
  },
};

export { Broadcaster };

import { Broadcaster } from "./durable_objects/broadcaster";

export interface Env {
  BROADCASTER: DurableObjectNamespace;
}

export default {
  async fetch(request: Request, env: Env) {
    return new Response("success");
  },
};

export { Broadcaster };

I leave an image of the structure of the Worker, it's completely isolated from my Remix app these are the scripts I'm testing locally

  "scripts": {
    "dev:worker": "wrangler dev --compatibility-date=2023-06-21 --config=src/wrangler.toml src/worker.ts",
    "dev:remix": "remix dev --manual -c \"wrangler pages dev --do BROADCASTER=Broadcaster@src/worker.ts --compatibility-date=2023-06-21 ./public\"" ,
  },

  "scripts": {
    "dev:worker": "wrangler dev --compatibility-date=2023-06-21 --config=src/wrangler.toml src/worker.ts",
    "dev:remix": "remix dev --manual -c \"wrangler pages dev --do BROADCASTER=Broadcaster@src/worker.ts --compatibility-date=2023-06-21 ./public\"" ,
  },

and I'm getting this error

[wrangler] Couldn't find `wrangler dev` session for class "Broadcaster" to proxy to

[wrangler] Couldn't find `wrangler dev` session for class "Broadcaster" to proxy to

niconiahiOP•13mo ago

this is the complete Durable Object, which I wasn't able to paste in the last message

import { z } from "zod";
export type PongEvent = z.infer<typeof pongEventSchema>;

export interface Env {
  BROADCASTER: DurableObjectNamespace;
}

type State = {
  connections: WebSocket[];
};

function generateHash() {
  return (Math.random() + 1).toString(36).substring(7);
}

export class Broadcaster {
  public state: State;
  private env: Env;

  constructor(state: State, env: Env) {
    this.state = state;
    this.env = env;
  }

  async fetch(request: Request) {
    if (request.method !== "POST") {
      return new Response("method not allowed =>", { status: 405 });
    }
    const event = pongEventSchema.parse({
      sender: "server",
      type: "pong",
      value: generateHash(),
    } as PongEvent);
    return new Response(JSON.stringify(event));
  }
}

import { z } from "zod";
export type PongEvent = z.infer<typeof pongEventSchema>;

export interface Env {
  BROADCASTER: DurableObjectNamespace;
}

type State = {
  connections: WebSocket[];
};

function generateHash() {
  return (Math.random() + 1).toString(36).substring(7);
}

export class Broadcaster {
  public state: State;
  private env: Env;

  constructor(state: State, env: Env) {
    this.state = state;
    this.env = env;
  }

  async fetch(request: Request) {
    if (request.method !== "POST") {
      return new Response("method not allowed =>", { status: 405 });
    }
    const event = pongEventSchema.parse({
      sender: "server",
      type: "pong",
      value: generateHash(),
    } as PongEvent);
    return new Response(JSON.stringify(event));
  }
}

sorry for the long message, but here is all the information. What am I missing? update: it works on production. It's just the local development that's NOT working so close

daniel•2d ago

Thanks for asking this. Came here for similar reason as I created a Remix Cloudflare Pages project and now want to create a Durable Object to use with it, but can't find that example in the docs, hitting a lot of errors trying to make it work

Gaming

Programming

Recommended way of registering a Durable Object