DwarfNinja
DwarfNinja
PostsComments
CDCloudflare Developers
Created by DwarfNinja on 2/19/2025 in #workers-help
Receiving webhook in a worker and sending it to the frontend?
May I ask why it is better for the DO to handle the connection? How would I migratie the functionality into the DO? Can I just pretty much copy paste the app.post and app.get code? (ps. im using hono) Thank you in advance!
9 replies
CDCloudflare Developers
Created by DwarfNinja on 2/19/2025 in #workers-help
Receiving webhook in a worker and sending it to the frontend?
EDIT SOLVED ✅: Got it to work by using Durable Object Storage to store the received webhook data during the /mollie-webhook call and later retrieve it in /mollie-payment-sse. I assume it's due to that the Durable Object is destroyed after it is used in /mollie-webhook which means it loses it's state, but I'll need someone to confirm that.
9 replies
CDCloudflare Developers
Created by DwarfNinja on 2/19/2025 in #workers-help
Receiving webhook in a worker and sending it to the frontend?
//durable-webhook.ts
import { DurableObject } from "cloudflare:workers";
import {Env} from "hono";

export class DurableWebhook extends DurableObject {
    webhookData: string | null = null;

    constructor(state: DurableObjectState, env: Env) {
        super(state, env);
    }

    // Stores incoming webhook data
    async storeWebhookData(webhookData: string): Promise<string> {
        this.webhookData = webhookData;
        return "Webhook data stored";
    }

    // Returns the stored webhook data (if any)
    async getWebhookData(): Promise<string | null> {
        return this.webhookData;
    }

    // Clears the stored webhook data
    async clearWebhookData(): Promise<void> {
        this.webhookData = null;
    }
}
//durable-webhook.ts
import { DurableObject } from "cloudflare:workers";
import {Env} from "hono";

export class DurableWebhook extends DurableObject {
    webhookData: string | null = null;

    constructor(state: DurableObjectState, env: Env) {
        super(state, env);
    }

    // Stores incoming webhook data
    async storeWebhookData(webhookData: string): Promise<string> {
        this.webhookData = webhookData;
        return "Webhook data stored";
    }

    // Returns the stored webhook data (if any)
    async getWebhookData(): Promise<string | null> {
        return this.webhookData;
    }

    // Clears the stored webhook data
    async clearWebhookData(): Promise<void> {
        this.webhookData = null;
    }
}
9 replies
CDCloudflare Developers
Created by DwarfNinja on 2/19/2025 in #workers-help
Receiving webhook in a worker and sending it to the frontend?
@Leo & @Hard@Work thank you for your responses. You have one me over and I started with Durable Objects today. Im trying to learn how they work and currently got this implementation. The problem im now facing is is that the webhookdata is null when retrieved in the stream. Stub WebhookData: null What am I missing here? Is the Durable Object disposed in between /mollie-webhook and /mollie-payment-sse? Thanks in advance! 
//index.ts
app.post('/mollie-webhook', async (context, env) => {
    const payload = await context.req.text()
    console.log('Received webhook data:', payload)

    const id = context.env.DURABLE_WEBHOOK.idFromName("durable_webhook");
    const stub =  context.env.DURABLE_WEBHOOK.get(id);

    const rpcResponse = await stub.storeWebhookData(payload);
    console.log(rpcResponse);

    return context.text('Webhook received')
})

app.get('/mollie-payment-sse', async (c) => {

    return streamSSE(c, async (stream: SSEStreamingApi) => {
        const id = c.env.DURABLE_WEBHOOK.idFromName("durable_webhook");
        const stub = c.env.DURABLE_WEBHOOK.get(id);

        while (true) {
            await stream.sleep(1000);

            const webhookData = await stub.getWebhookData();
            console.log(`Stub WebhookData: ${webhookData}`);

            if (webhookData) {
                await stream.writeSSE({
                    event: "new-payment-update",
                    data: webhookData
                });

                await stub.clearWebhookData();
            }
        }
    });
});
//index.ts
app.post('/mollie-webhook', async (context, env) => {
    const payload = await context.req.text()
    console.log('Received webhook data:', payload)

    const id = context.env.DURABLE_WEBHOOK.idFromName("durable_webhook");
    const stub =  context.env.DURABLE_WEBHOOK.get(id);

    const rpcResponse = await stub.storeWebhookData(payload);
    console.log(rpcResponse);

    return context.text('Webhook received')
})

app.get('/mollie-payment-sse', async (c) => {

    return streamSSE(c, async (stream: SSEStreamingApi) => {
        const id = c.env.DURABLE_WEBHOOK.idFromName("durable_webhook");
        const stub = c.env.DURABLE_WEBHOOK.get(id);

        while (true) {
            await stream.sleep(1000);

            const webhookData = await stub.getWebhookData();
            console.log(`Stub WebhookData: ${webhookData}`);

            if (webhookData) {
                await stream.writeSSE({
                    event: "new-payment-update",
                    data: webhookData
                });

                await stub.clearWebhookData();
            }
        }
    });
});
9 replies
CDCloudflare Developers
Created by DwarfNinja on 2/19/2025 in #workers-help
Receiving webhook in a worker and sending it to the frontend?
For the current scope of the project yes, while it seems the're should be an alternative or is Durable Objects the only solution?
9 replies
CDCloudflare Developers
Created by DwarfNinja on 2/19/2025 in #workers-help
Receiving webhook in a worker and sending it to the frontend?
@Leo As mentioned I'd rather use an alternative if possible as it seems that purchasing Workers Pro seems overkill for this problem? Do you have any other suggestions?
9 replies