How to build a Real-Time Messaging App using Diffusion

Real-Time Messaging

Introduction to Diffusion Real-Time Messaging through a simple application using Diffusion Cloud.
A set of simple projects, illustrating production and consumption of messages to and from a Diffusion Cloud instance.
These JavaScript code examples enable users to interact in real-time across various rooms or topics. You can also use other programming languages from our SDKs, including iOS, Android, C, .NET, and more.


Lesson 1: Publish and Subscribe to Topics

Lesson 1 code example introduces the concept of Publish and Subscribe to ‘Topics’ (data structures). In Diffusion, data is stored and distributed through Topics.

Lesson 2: Time Series Topics

Lesson 2 code example introduces the concept of Time Series topic to hold a historical sequence of events. Time series topics are useful for collaborative applications such as chat rooms. Multiple users can concurrently update a time series topic.

Lesson 3: Security

Lesson 3 code example introduces the concept of Security by requiring sessions to authenticate and use role-based authorization to define the actions that a client can perform.


Pre-requisites

  • Download our code examples or clone them to your local environment:
git clone https://github.com/diffusiondata/tutorials/
  • A Diffusion service (Cloud or On-Premise), version 6.5.0 or greater. Create a service here.

Create Service

Setup

Make sure to add Diffusion library to your code. For JavaScript, we have added the following line in our public/chat.html:

src=’https://download.diffusiondata.com/clients/6.5.1/js/diffusion-6.5.1.js’

Set lines 44-46 of public/js/app.js to the hostname of your Diffusion Cloud service, which you can find in your service dashboard. You can also leave the default values and connect to our sandbox service:

  • host: host (“diffusionchatapp.eu.diffusion.cloud” by default)
  • user: ‘user’
  • password: ‘password’

Execution

Really easy, just open the index.html file locally and off you go!


The code in action

(Click to watch the video)

Video Tutorial


Lesson 1: Publish and Subscribe

In Diffusion, data is stored and distributed through ‘Topics’ (data structures). Session can subscribe to a topic to receive notifications when the topic value changes and can also update the value. When a topic is updated, all its subscribers are notified of the new value. Diffusion takes care of efficiently broadcasting value changes, even if there are hundreds of thousands of subscribers.

Step 1: Connect to Diffusion

diffusion.connect > create your host
diffusion.connect({
	host : host, // Use your Diffusion service or connect to our sandbox "diffusionchatapp.eu.diffusion.cloud"
	principal : "user",
	credentials : "password"})

Step 2: Create a Topic

session.topics.add
session.topics.add(_roomTopic, diffusion.topics.TopicType.JSON);

Step 3: Create a Topic Listener

session.addStream
session.addStream(_roomTopic, diffusion.datatypes.json());

Step 4: Subscribe to a Topic

session.select
session.select(_roomTopic);

Step 5: Update a Topic

session.topicUpdate.set
session.topicUpdate.set(_roomTopic, diffusion.datatypes.json(),
	{
		text: msg,
		name: name,
		timestamp: new Date().toLocaleTimeString()
	});



Lesson 2: Time Series

Introduce the concept of a Time Series topic to hold a sequence of events. Time series topics are useful for collaborative applications such as chat rooms. Multiple users can concurrently update a time series topic.

Step 1: Topic Types and Specifications

diffusion.topics.TopicSpecification : TopicType.TIME_SERIES

diffusion.topics.TopicSpecification(diffusion.topics.TopicType.TIME_SERIES, 
	{
		TIME_SERIES_EVENT_VALUE_TYPE : "json",
		TIME_SERIES_RETAINED_RANGE: "limit 100",
		TIME_SERIES_SUBSCRIPTION_RANGE: "limit 100"
	});

Step 2: Append/Update Time Series

session.timeseries.append
session.timeseries.append(_roomTopic,
	{
		text: msg 
		name: name,
		timestamp: new Date().toLocaleTimeString()
	},
	diffusion.datatypes.json());


Lesson 3: Security

Introduce the concept of Security by requiring sessions to authenticate and use role-based authorization to define the actions that a client can perform.

Step 1: Using Auth script builder

session.security.authenticationScriptBuilder()
session.security.authenticationScriptBuilder();

Step 2: Create a new user with a user name, password and roles

addPrincipal() – build()
authenticationScriptBuilder
		.addPrincipal(name, password, ['CLIENT','TOPIC_CONTROL'])
		.build();

Step 3: Update the Auth store

session.security.updateAuthenticationStore()
session.security.updateAuthenticationStore(addUserScript);


Challenge for you

Now that you have a fully functional messaging app, try building a “moderator” app, to monitor the conversation for explicit/inappropriate messages. When specific text is identified in a conversation, the message value can be bleeped out, or access/permission to the room can be dynamically updated based on the user’s behavior.

Watch our Webinar

Tuned our webinar introducing the basic concept of your Diffusion dashboard and console.

Thank you!


Further reading

The Diffusion Data logo

BLOG

Creating a WebSocket Server for PubSub

June 28, 2024

Read More about Creating a WebSocket Server for PubSub/span>

The Diffusion Data logo

BLOG

React PubSub using Diffusion Websocket Server

July 08, 2024

Read More about React PubSub using Diffusion Websocket Server/span>

BLOG

Exploring Generative AI: Opportunity or Potential Headache?

March 25, 2024

Read More about Exploring Generative AI: Opportunity or Potential Headache?/span>