How to create channels in order to make permissions, so people from specific channels can receive message but others can’t receive these messages.
i am trying something like this.
let ws = new websocketConnection(backend_canister_id, gateway_address, url, local_test);
await ws.onMessage(async (event) => {
console.log({event})
})
await ws.onOpen(async (event) => {
let m = await ws.make_message("text" + "-pong")
console.log({m})
})
await ws.onMessage(async (event) => {
let m = await ws.make_message("text" + "-pong")
console.log({m})
})
document.getElementById("send_message").onclick = async () => {
ws.sendMessage({message: "text", channel: 1})
};
Not a direct answer, but @massimoalbarello recently published a more recent WebSocket initiative based on this work. So you might want to check it out.
Hello @massimoalbarello , I just browsed through the tutorial and noticed the set up if for a rust project, so I just want to ask if it’s possible yet to integrate this web sockets emplemantation in an existing motoko project, with a react frontend?
yes for now the CDK is just for Rust… Eventually we will write it also in Motoko but not anytime soon.
We are now working on a Rust canister which embeds the IC WebSocket CDK and acts as an additional relay between the Motoko canisters and the WS Gateway. This way you can import the WASM of the Rust canister in your Motoko project, similar to what you would do when using the Internet Identity canister locally.
However, this solution is far from ideal as it introduces a lot of latency and cost due to the x-net calls from the Motoko canister to the one in Rust.
The frontend SDK instead is compatible with both JS and TS projects so you should be able to use it in your React application right away. You can instantiate the IcWebSocket class in a file outside of the React components, export the instance and then import it into all the files you need to use it.
If you would like to start working on the Motoko CDK implementation yourself, we would gladly provide all the help you need to get started. However, the WS Gateway is not stable yet so the CDK will have breaking changes quite often for now.
As @iamenochchirima suggested, I think the solution is to delete the src/ic_websocket_example_frontend/dist directory, because files are not automatically removed from the dist folder if you delete them from the source code.
Also, I see from the error log that you’re trying to connect to wss://0.0.0.0:8080/ but, if you’re running the gateway locally, it won’t likely have TLS enabled and 0.0.0.0 is just the address on which the gateway listens to for new connections. You should rather use ws://127.0.0.1:8080/ to connect to the gateway from the frontend.
@iamenochchirima@ilbert the error is gone now but I am getting this in the gateway after runing cargo run then reload the frontend.
2023-08-28T06:28:00.094668Z ERROR ic_websocket_gateway::gateway_server: Connection handler terminated with an error: Initialization("Client did not follow IC WebSocket establishment protocol: \"open message is not of type RelayedClientMessage\"")
at src/ic-websocket-gateway/src/gateway_server.rs:403
in ic_websocket_gateway::gateway_server::ws_connection_error
This should fix the errors that you’re getting. I’ve also updated the tutorial with this additional command, let me know if it works.
We’re in the process of re-designing the protocol, so we’ll update the tutorial once we have something stable. This will simplify how things work for client, gateway and canister and will for sure break the existing gateway and SDKs versions, but we’ll keep the community posted.