Rusty Chatroom on Cloudflare

Sample application demonstrating using Rust alongside the full suite of Cloudflare serverless technologies.

Usage

The front-end application exposes two pages:

/: The chatroom interface
/chats: Create new chats, join existing chats

All chats are password protected. Chat metadata (name, password etc) are stored in a D1 database.

Once you have created a chat, you will be redirected to the / interface. The relevant chat_id is set in your browser local storage. Enter a username, and the correct password, and you will be connected to the chat. Perform this action in multiple different browser windows to use the chat.

Prerequisites

Local Development

Wrangler, the Cloudflare CLI, packages the ability to run local development environments. To run the chat application locally, you'll need two seperate terminal windows, and the below CLI commands.

Local Postgres DB

The users backend uses Postgres as it's database provider. When deployed to Cloudflare, the Hyperdrive service is used. Hyperdrive cannot be used locally, so a local Postgres instance is used instead.

docker run -p 5432:5432 --name postgres -e POSTGRES_PASSWORD=mysecretpassword -d postgres
docker exec postgres psql -U postgres -c "CREATE DATABASE users;"
docker exec postgres psql -U postgres -d users -c "CREATE TABLE users (id SERIAL PRIMARY KEY,username TEXT NOT NULL UNIQUE,password_hash TEXT NOT NULL,created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP);"
docker exec postgres psql -U postgres -d users -c "CREATE INDEX idx_username ON users(username);"

The localConnectionString property in wrangler.toml overrides the connection when running locally.

Terminal Window 1

In the first terminal window, you will start up the local instance of the chat application backend. The backend uses Workers, D1, KV and Durable Objects to provide chatroom functionality.

cd src/backend
npx wrangler d1 migrations apply rusty-serverless-chat-metadata --local
npx wrangler dev

Terminal Window 2

In the second terminal window, you will start up the front-end application.

cd src
npm run dev

The dev script starts up a local instance of Cloudflare pages on port 8080. It also passes in the --service flag which bings the worker inside the pages, to your backend worker that is also running locally.

Navigate to http://localhost:8080 to interact with the chat application.

Deploy to Cloudflare

This sample application uses Durable Objects, which are only available in a Workers paid plan. Ensure you have at least a paid plan before continuing.

The KV namespace and D1 database are deployed using Terraform. You will first need to create a file named dev.tfvars inside the src/infra directory. Populate with your Cloudflare API key and account id.

cloudflare_api_token=""
cloudflare_account_id = ""

Then run the below commands to deploy your infrastructure

cd src/infra
terraform apply

Once created, the KV binding ID and D1 database ID will be output to your console. The final step, is to update the wrangler.toml file with the database_id and kv_namespace id.

[[d1_databases]]
binding = "CHAT_METADATA"
database_id = "" # Database ID goes here
database_name = "rusty-serverless-chat-metadata"

[[kv_namespaces]]
binding = "CHAT_HISTORY"
id = "" # KV namespace ID goes here

Then run the below commands

cd src backend
npx wrangler d1 migrations apply rusty-serverless-chat-metadata --remote
npx wrangler deploy
cd ..
npx wrangler pages deploy

Troubleshooting

Unable to build for wasm32-unknown-unknown

Apple Clang is a forked version of Clang specific to the Apple ecosystem. It does not provide support for wasm32-unknown-unknown. To compile, you need to install llvm.org Clang instead of the Apple package one. Instructions can be found in this GitHub issue.

jeastham1993/serverless-cloudflare