Realtime API over cloudflare tunnels
Hello. Is it possible to use the realtime subscriptions, when the self-hosted instance is exposed via cloudflare tunnels? There is no additional proxy. I am using latest SDK for next.js and when i try to subscribe to a particular table:
const subString = Channel.tablesdb("<db_id>").table("<table_id>");
const sub = realtime.subscribe(subString, response => {
console.log(response.payload);
});
seems like it does not receive any updates. The state, when logged to console, is 'pending', and no operations in that table can trigger the sub. I tried setting the
.setEndpointRealtime("wss://myappwriteinstance.com/v1/realtime")
but this did not work either.
actually i spotted that I did not await the subscribe() but even with that done - still no results
Same issue here.
Below a react component I created to test the realtime connection. What I found is that only the old way of writing subscriptions works (see attached image which show the logs i receive). The legacy subscription does come through. When i test this same setup, but then with an Appwrite cloud client, it does work. So I assume it has something to do with the self-hosting or setup of it. The current way I host Appwrite is though Coolify, in which I started with the default template, and upgraded from 1.7.4. > 1.7.5 > 1.8.0 > 1.8.1. On each updagrade did a migration if necessary, but still no luck.
Would be great if someone could help!
"use client";
import { useEffect } from "react";
import { Channel } from "appwrite";
import { Client, Realtime } from "appwrite";
export function RealtimeTest() {
useEffect(() => {
const client = new Client()
.setEndpoint(process.env.NEXT_PUBLIC_APPWRITE_ENDPOINT!)
.setProject(process.env.NEXT_PUBLIC_APPWRITE_PROJECT_ID!);
const realtime = new Realtime(client);
client.subscribe("rows", (response) => {
console.log("Legacy row event:", response);
});
const startSubscription = async () => {
try {
console.log("Subscribing to realtime events...");
const subscription = await realtime.subscribe(
Channel.rows(),
(response) => {
console.log("New async Realtime event:", response);
},
);
console.log("Subscription created: ", subscription);
} catch (err) {
console.error("Realtime subscribe failed:", err);
}
};
startSubscription();
}, []);
return <></>;
}
