From b41c4edc2e4bf1da11ebff98c38f92f8057d5c59 Mon Sep 17 00:00:00 2001 From: Josh Howard Date: Thu, 18 Apr 2024 15:09:26 -0400 Subject: [PATCH] Change Durable Objects "Hello, World!" template to use RPC methods (#5637) * Change Durable Objects "Hello, World!" template to use RPC methods * Update .changeset/serious-socks-grab.md Co-authored-by: Pete Bacon Darwin --------- Co-authored-by: Pete Bacon Darwin --- .changeset/serious-socks-grab.md | 5 ++ .../js/src/index.js | 32 ++++++----- .../ts/package.json | 1 - .../ts/src/index.ts | 55 ++++++++++++++----- 4 files changed, 63 insertions(+), 30 deletions(-) create mode 100644 .changeset/serious-socks-grab.md diff --git a/.changeset/serious-socks-grab.md b/.changeset/serious-socks-grab.md new file mode 100644 index 000000000000..3d31a3f0996a --- /dev/null +++ b/.changeset/serious-socks-grab.md @@ -0,0 +1,5 @@ +--- +"create-cloudflare": minor +--- + +feat: change Durable Objects "Hello, World!" template to use RPC methods diff --git a/packages/create-cloudflare/templates/hello-world-durable-object/js/src/index.js b/packages/create-cloudflare/templates/hello-world-durable-object/js/src/index.js index aed5450764e0..de225c5b7098 100644 --- a/packages/create-cloudflare/templates/hello-world-durable-object/js/src/index.js +++ b/packages/create-cloudflare/templates/hello-world-durable-object/js/src/index.js @@ -1,3 +1,5 @@ +import { DurableObject } from "cloudflare:workers"; + /** * Welcome to Cloudflare Workers! This is your first Durable Objects application. * @@ -16,25 +18,27 @@ */ /** A Durable Object's behavior is defined in an exported Javascript class */ -export class MyDurableObject { +export class MyDurableObject extends DurableObject { /** * The constructor is invoked once upon creation of the Durable Object, i.e. the first call to - * `DurableObjectStub::get` for a given identifier + * `DurableObjectStub::get` for a given identifier (no-op constructors can be omitted) * - * @param {DurableObjectState} state - The interface for interacting with Durable Object state + * @param {DurableObjectState} ctx - The interface for interacting with Durable Object state * @param {Env} env - The interface to reference bindings declared in wrangler.toml */ - constructor(state, env) {} + constructor(ctx, env) { + super(ctx, env); + } /** - * The Durable Object fetch handler will be invoked when a Durable Object instance receives a - * request from a Worker via an associated stub + * The Durable Object exposes an RPC method sayHello which will be invoked when when a Durable + * Object instance receives a request from a Worker via the same method invokation on the stub * - * @param {Request} request - The request submitted to a Durable Object instance from a Worker - * @returns {Promise} The response to be sent back to the Worker + * @param {string} name - The name provided to a Durable Object instance from a Worker + * @returns {Promise} The greeting to be sent back to the Worker */ - async fetch(request) { - return new Response('Hello World'); + async sayHello(name) { + return `Hello, ${name}!`; } } @@ -56,10 +60,10 @@ export default { // The Durable Object constructor will be invoked upon the first call for a given id let stub = env.MY_DURABLE_OBJECT.get(id); - // We call `fetch()` on the stub to send a request to the Durable Object instance - // The Durable Object instance will invoke its fetch handler to handle the request - let response = await stub.fetch(request); + // We call the `sayHello()` RPC method on the stub to invoke the method on the remote + // Durable Object instance + let greeting = await stub.sayHello("world"); - return response; + return new Response(greeting); }, }; diff --git a/packages/create-cloudflare/templates/hello-world-durable-object/ts/package.json b/packages/create-cloudflare/templates/hello-world-durable-object/ts/package.json index bb4c496556dd..32f380e7ba9c 100644 --- a/packages/create-cloudflare/templates/hello-world-durable-object/ts/package.json +++ b/packages/create-cloudflare/templates/hello-world-durable-object/ts/package.json @@ -9,7 +9,6 @@ "cf-typegen": "wrangler types" }, "devDependencies": { - "@cloudflare/workers-types": "^4.20231218.0", "typescript": "^5.0.4", "wrangler": "^3.0.0" } diff --git a/packages/create-cloudflare/templates/hello-world-durable-object/ts/src/index.ts b/packages/create-cloudflare/templates/hello-world-durable-object/ts/src/index.ts index c7f0508df346..9d1c5d6e23c5 100644 --- a/packages/create-cloudflare/templates/hello-world-durable-object/ts/src/index.ts +++ b/packages/create-cloudflare/templates/hello-world-durable-object/ts/src/index.ts @@ -1,3 +1,5 @@ +import { DurableObject } from "cloudflare:workers"; + /** * Welcome to Cloudflare Workers! This is your first Durable Objects application. * @@ -11,26 +13,49 @@ * Learn more at https://developers.cloudflare.com/durable-objects */ + +/** + * Associate bindings declared in wrangler.toml with the TypeScript type system + */ +export interface Env { + // Example binding to KV. Learn more at https://developers.cloudflare.com/workers/runtime-apis/kv/ + // MY_KV_NAMESPACE: KVNamespace; + // + // Example binding to Durable Object. Learn more at https://developers.cloudflare.com/workers/runtime-apis/durable-objects/ + MY_DURABLE_OBJECT: DurableObjectNamespace; + // + // Example binding to R2. Learn more at https://developers.cloudflare.com/workers/runtime-apis/r2/ + // MY_BUCKET: R2Bucket; + // + // Example binding to a Service. Learn more at https://developers.cloudflare.com/workers/runtime-apis/service-bindings/ + // MY_SERVICE: Fetcher; + // + // Example binding to a Queue. Learn more at https://developers.cloudflare.com/queues/javascript-apis/ + // MY_QUEUE: Queue; +} + /** A Durable Object's behavior is defined in an exported Javascript class */ -export class MyDurableObject { +export class MyDurableObject extends DurableObject { /** * The constructor is invoked once upon creation of the Durable Object, i.e. the first call to - * `DurableObjectStub::get` for a given identifier + * `DurableObjectStub::get` for a given identifier (no-op constructors can be omitted) * - * @param state - The interface for interacting with Durable Object state + * @param ctx - The interface for interacting with Durable Object state * @param env - The interface to reference bindings declared in wrangler.toml */ - constructor(state: DurableObjectState, env: Env) {} + constructor(ctx: DurableObjectState, env: Env) { + super(ctx, env); + } /** - * The Durable Object fetch handler will be invoked when a Durable Object instance receives a - * request from a Worker via an associated stub + * The Durable Object exposes an RPC method sayHello which will be invoked when when a Durable + * Object instance receives a request from a Worker via the same method invokation on the stub * - * @param request - The request submitted to a Durable Object instance from a Worker - * @returns The response to be sent back to the Worker + * @param name - The name provided to a Durable Object instance from a Worker + * @returns The greeting to be sent back to the Worker */ - async fetch(request: Request): Promise { - return new Response('Hello World'); + async sayHello(name: string): Promise { + return `Hello, ${name}!`; } } @@ -50,12 +75,12 @@ export default { // This stub creates a communication channel with the Durable Object instance // The Durable Object constructor will be invoked upon the first call for a given id - let stub: DurableObjectStub = env.MY_DURABLE_OBJECT.get(id); + let stub = env.MY_DURABLE_OBJECT.get(id); - // We call `fetch()` on the stub to send a request to the Durable Object instance - // The Durable Object instance will invoke its fetch handler to handle the request - let response = await stub.fetch(request); + // We call the `sayHello()` RPC method on the stub to invoke the method on the remote + // Durable Object instance + let greeting = await stub.sayHello("world"); - return response; + return new Response(greeting); }, };