DEV Community: Imai Jiro

How to Implement Socket Communication in Unreal Engine and Node.js

Imai Jiro — Wed, 19 Feb 2025 09:04:44 +0000

In this tutorial, we'll explore how to implement socket communication between a Node.js server and both Unreal Engine 5 (UE5) and Unity using WebSockets. While both Unreal Engine and Unity are excellent platforms for creating real-time applications, they each have unique ways of handling socket communication. Think of Unreal Engine as a teacher that encourages a more high-fidelity, visually immersive approach, while Unity tends to be a bit more straightforward and accessible for rapid development.

Let’s dive into how you can set up socket communication in both engines and see how their unique teaching styles come into play.

Prerequisites

Before we begin, ensure you have the following installed:

Node.js and npm:Install Node.js
Unreal Engine 5 (UE5)
Unity (for comparison)
Visual Studio (for Unreal Engine development)

1. Setting Up the Node.js WebSocket Server

Let's first create a simple WebSocket server using ws, a popular WebSocket library for Node.js. This will act as our "teacher" in this analogy, delivering lessons (messages) to both Unreal Engine and Unity students.

Install the ws library:

npm init -y
npm install ws

Create the WebSocket server (server.js):

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', ws => {
  console.log('New connection established');

  ws.on('message', message => {
    console.log(`Received message: ${message}`);
    // Send back a response to the client
    ws.send('Message received by Node.js server!');
  });

  ws.on('close', () => {
    console.log('Connection closed');
  });
});

// Handle server errors
wss.on('error', err => {
  console.error('WebSocket Server Error:', err);
});

console.log('WebSocket server running on ws://localhost:8080');

Run the WebSocket server:

node server.js

Your server is now ready and capable of receiving and responding to messages from both Unreal Engine and Unity clients.

2. Unreal Engine 5 WebSocket Client

Now let’s look at how Unreal Engine would set up as a "student," ready to receive the lesson (messages) and act on them with its unique flair for high-quality graphics and immersive interactions.

Step 1: Enable WebSocket Support in UE5

To enable WebSocket support, add WebSockets to the PublicDependencyModuleNames in your YourProject.Build.cs:

PublicDependencyModuleNames.AddRange(new string[] { "Core", "CoreUObject", "Engine", "WebSockets" });

Step 2: Create a WebSocket Client Actor in Unreal

Now, let’s create a WebSocket client in Unreal Engine that will connect to our Node.js server.

WebSocketClientActor.h:

#pragma once

#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "WebSocketsModule.h"
#include "IWebSocket.h"
#include "WebSocketClientActor.generated.h"

UCLASS()
class YOURPROJECT_API AWebSocketClientActor : public AActor
{
    GENERATED_BODY()

public:
    AWebSocketClientActor();

protected:
    virtual void BeginPlay() override;
    virtual void Tick(float DeltaTime) override;

private:
    TSharedPtr<IWebSocket> WebSocket;

    void SetupWebSocket();
    void OnWebSocketMessageReceived(const FString& Message);
};

WebSocketClientActor.cpp:

#include "WebSocketClientActor.h"
#include "Engine/Engine.h"

AWebSocketClientActor::AWebSocketClientActor()
{
    PrimaryActorTick.bCanEverTick = true;
}

void AWebSocketClientActor::BeginPlay()
{
    Super::BeginPlay();
    SetupWebSocket();
}

void AWebSocketClientActor::SetupWebSocket()
{
    if (!FModuleManager::Get().IsModuleLoaded("WebSockets"))
    {
        FModuleManager::Get().LoadModule("WebSockets");
    }

    WebSocket = FWebSocketsModule::Get().CreateWebSocket(TEXT("ws://localhost:8080"));

    WebSocket->OnConnected().AddLambda([]()
    {
        UE_LOG(LogTemp, Log, TEXT("Successfully connected to WebSocket server"));
    });

    WebSocket->OnConnectionError().AddLambda([](const FString& Error)
    {
        UE_LOG(LogTemp, Error, TEXT("WebSocket Connection Failed: %s"), *Error);
    });

    WebSocket->OnClosed().AddLambda([](int32 StatusCode, const FString& Reason, bool bWasClean)
    {
        UE_LOG(LogTemp, Log, TEXT("WebSocket Closed: %s"), *Reason);
    });

    WebSocket->OnMessage().AddLambda([this](const FString& Message)
    {
        UE_LOG(LogTemp, Log, TEXT("Received WebSocket Message: %s"), *Message);
        OnWebSocketMessageReceived(Message);
    });

    WebSocket->Connect();
}

void AWebSocketClientActor::OnWebSocketMessageReceived(const FString& Message)
{
    if (Message.Contains("color"))
    {
        // Change the color of the actor based on the message
        UStaticMeshComponent* MeshComp = FindComponentByClass<UStaticMeshComponent>();
        if (MeshComp)
        {
            FLinearColor Color = FLinearColor::Red;
            UMaterialInstanceDynamic* DynMaterial = MeshComp->CreateAndSetMaterialInstanceDynamic(0);
            if (DynMaterial)
            {
                DynMaterial->SetVectorParameterValue(TEXT("BaseColor"), Color);
            }
        }
    }
}

void AWebSocketClientActor::Tick(float DeltaTime)
{
    Super::Tick(DeltaTime);

    if (WebSocket && WebSocket->IsConnected())
    {
        WebSocket->Send(TEXT("Hello from Unreal Engine!"));
    }
}

3. Unity WebSocket Client (For Comparison)

Unity, in comparison to Unreal, tends to take a simpler approach, making it a great tool for those looking for a lightweight but effective solution. Here's how we would implement the same functionality in Unity:

Install the WebSocketSharp package via NuGet or import a WebSocket plugin.

Create a WebSocket Client script:

using System.Collections;
using UnityEngine;
using WebSocketSharp;

public class WebSocketClient : MonoBehaviour
{
    private WebSocket ws;

    void Start()
    {
        ws = new WebSocket("ws://localhost:8080");

        ws.OnOpen += (sender, e) => {
            Debug.Log("WebSocket connected.");
        };

        ws.OnMessage += (sender, e) => {
            Debug.Log("Received: " + e.Data);
            // Handle the message
            HandleMessage(e.Data);
        };

        ws.Connect();
    }

    void HandleMessage(string message)
    {
        if (message.Contains("color"))
        {
            GetComponent<Renderer>().material.color = Color.red; // Example for Unity
        }
    }

    void Update()
    {
        if (ws != null && ws.IsAlive)
        {
            ws.Send("Hello from Unity!");
        }
    }

    void OnApplicationQuit()
    {
        if (ws != null)
        {
            ws.Close();
        }
    }
}

4. Comparing Unreal Engine and Unity: Two Teachers with Different Styles

Unreal Engine, with its robust C++ system and highly detailed asset handling, is like a teacher who guides students through complex lessons with deep immersion. You might find yourself learning advanced concepts more quickly, but the complexity can be a challenge at times.

Unity, on the other hand, offers a more accessible approach. It’s like a teacher who simplifies concepts, helping students to get their hands dirty with real-world projects more quickly. If you’re looking to develop a simpler WebSocket-based application, Unity’s environment may be more suitable for rapid prototyping.

Despite these differences, both engines excel in real-time communication, making them great choices for interactive applications. The choice between Unity and Unreal Engine comes down to your project’s needs—whether you need the high fidelity of Unreal or the rapid iteration and flexibility of Unity.

5. Conclusion

By using WebSockets, both Unreal Engine 5 and Unity can effectively communicate with a Node.js WebSocket server, enabling real-time interactions in a variety of applications. Whether you're using Unreal Engine's immersive world-building tools or Unity’s fast-paced development cycle, WebSocket communication is a powerful tool for creating interactive, dynamic experiences.

How to Implement Socket Communication in Unity and Node.js

Imai Jiro — Fri, 23 Aug 2024 14:52:46 +0000

Introduction

In modern multiplayer games, real-time communication between the server and clients is crucial for a seamless gaming experience. One effective way to achieve this is through socket communication, which allows for low-latency and bidirectional data transfer. In this article, we'll walk you through the process of setting up socket communication between a Unity game client and a Node.js server. By the end, you'll have a basic understanding of how to establish a socket connection, send and receive messages, and handle real-time interactions in your game.

1. Prerequisites

Before we dive in, make sure you have the following tools and knowledge:

Node.js: A JavaScript runtime that allows you to build server-side applications.
Unity: A game engine used for developing 2D, 3D, VR, and AR games.
Socket.IO: A library that enables real-time, bidirectional communication between clients and servers.
Basic Programming Knowledge: Familiarity with JavaScript and C# is essential.

2. Setting Up the Node.js Server

Let's start by setting up our Node.js server, which will handle incoming connections and broadcast messages to connected clients.

Installing Dependencies

First, create a new Node.js project and install the necessary packages:

mkdir socket-server
cd socket-server
npm init -y
npm install express socket.io

Writing the Server Code

Create a new file called 'index.js' and add the following code:

const express = require('express');
const http = require('http');
const socketIo = require('socket.io');

const app = express();
const server = http.createServer(app);
const io = socketIo(server);

io.on('connection', (socket) => {
    console.log('A user connected');

    // Handle incoming messages from the client
    socket.on('message', (msg) => {
        console.log('Message received: ', msg);
        // Broadcast the message to all clients
        io.emit('message', msg);
    });

    socket.on('disconnect', () => {
        console.log('A user disconnected');
    });
});

server.listen(3000, () => {
    console.log('Server is running on port 3000');
});

Testing the Server

You can test if the server is running correctly by executing:

node index.js

Open your browser and navigate to 'http://localhost:3000' to see if the server is live.

3. Setting Up Unity

Now, let's move to the Unity side of things. We'll establish a connection to the Node.js server using the Socket.IO package for Unity.

Importing Required Packages

In Unity, you'll need to import the 'Socket.IO' package. You can get it from the Unity Asset Store or GitHub.

Writing the Client Code

In Unity, create a new script called 'SocketClient.cs' and add the following code:

using UnityEngine;
using SocketIO;

public class SocketClient : MonoBehaviour
{
    private SocketIOComponent socket;

    void Start()
    {
        GameObject go = GameObject.Find("SocketIO");
        socket = go.GetComponent<SocketIOComponent>();

        socket.On("open", OnConnected);
        socket.On("message", OnMessageReceived);
        socket.On("close", OnDisconnected);

        socket.Connect();
    }

    void OnConnected(SocketIOEvent e)
    {
        Debug.Log("Connected to server");
    }

    void OnMessageReceived(SocketIOEvent e)
    {
        Debug.Log("Message received: " + e.data);
    }

    void OnDisconnected(SocketIOEvent e)
    {
        Debug.Log("Disconnected from server");
    }

    public void SendMessageToServer(string message)
    {
        socket.Emit("message", new JSONObject(message));
    }
}

4. Sending and Receiving Messages

With the connection established, you can now send and receive messages between Unity and the Node.js server.

Sending Data from Unity to Node.js

To send a message from Unity to the server, call the 'SendMessageToServer' method in the 'SocketClient' script:

SendMessageToServer("Hello from Unity!");

Receiving Data from Node.js in Unity

The 'OnMessageReceived' method in the 'SocketClient' script handles incoming messages from the server.

5. Handling Disconnections and Reconnects

To ensure a smooth user experience, you'll need to manage socket events like disconnections and implement reconnect logic.

6. Testing and Debugging

Use tools like 'Postman' or browser developer tools to simulate connections and messages. Ensure that your game can handle multiple clients and that messages are delivered reliably.

7. Conclusion

Socket communication is a powerful tool for real-time multiplayer games. By following this guide, you should now have a basic setup for socket communication between Unity and Node.js. This setup can be expanded and adapted to fit the needs of your specific game, allowing for real-time interactions and a seamless multiplayer experience.

How to call javascript functions from Unity C# class in unity?

Imai Jiro — Wed, 21 Aug 2024 15:35:17 +0000

Calling JavaScript functions from a Unity C# class in Unity can be achieved when you're working with a WebGL build, where Unity allows interaction between the Unity environment and the surrounding browser JavaScript. Below are the steps to do this:

1. Using ExternalEval (Deprecated)

In older versions of Unity, you could use Application.ExternalEval. However, this is deprecated, and you should use Application.ExternalCall or Application.ExternalEval.

2. Using Application.ExternalCall (Deprecated)

This was also deprecated but worked similarly to ExternalEval.

3. Using JavaScriptInterface (Recommended)

Unity introduced a more robust way to interact with JavaScript using the JavaScriptInterface for WebGL. The approach is to define a JavaScript function in your web page and call it from your Unity C# script.

4. Using WebGLPlugin (Recommended)

This is the most current and preferred method. Unity provides a way to call JavaScript functions directly from C# using WebGL plugins.

Step-by-Step Guide:

1. Create Your JavaScript File:

First, create a JavaScript file with the functions you want to call. For example, let's create a file called unityFunctions.js:

function ShowAlert(message) {
    alert(message);
}

function AddNumbers(a, b) {
    return a + b;
}

2. Include the JavaScript in Your WebGL Template:

When building for WebGL, include this JavaScript file in your WebGL template or HTML file. Make sure that the JavaScript file is correctly referenced:

<script src="unityFunctions.js"></script>

3. Create a C# Wrapper in Unity:

In Unity, create a C# class that will call these JavaScript functions:

using UnityEngine;
using System.Runtime.InteropServices;

public class WebGLInteraction : MonoBehaviour
{
    // Import the JavaScript functions using DLLImport
    [DllImport("__Internal")]
    private static extern void ShowAlert(string message);

    [DllImport("__Internal")]
    private static extern int AddNumbers(int a, int b);

    // Method to call the JavaScript ShowAlert function
    public void CallShowAlert()
    {
        ShowAlert("Hello from Unity!");
    }

    // Method to call the JavaScript AddNumbers function
    public void CallAddNumbers()
    {
        int result = AddNumbers(5, 3);
        Debug.Log("Result from JavaScript: " + result);
    }
}

4. Call the Functions from Your C# Script:

You can now call these methods in your Unity scripts just like any other C# method:

public class GameManager : MonoBehaviour
{
    void Start()
    {
        WebGLInteraction webGLInteraction = new WebGLInteraction();
        webGLInteraction.CallShowAlert();
        webGLInteraction.CallAddNumbers();
    }
}

Important Notes:

Only for WebGL Builds: This method works only in Unity WebGL builds. If you try to call these methods in the Unity editor or in a non-WebGL build, it will throw errors.
JavaScript Functions Must Be Global: The JavaScript functions that you want to call from Unity must be globally accessible in the web page where your Unity WebGL content is running.
DllImport("__Internal"): This attribute is used to indicate that the methods are external JavaScript functions when targeting WebGL.

How to Use Solana Web3 in Unity

Imai Jiro — Mon, 19 Aug 2024 03:54:46 +0000

The rise of blockchain technology has opened new frontiers for game developers, enabling decentralized applications (dApps) and in-game economies that were previously impossible. Solana, with its high throughput and low transaction fees, has emerged as a leading platform for blockchain development. Integrating Solana Web3 into Unity allows developers to create immersive blockchain-based games, offering players unique experiences with real ownership of in-game assets. In this article, we'll guide you through the process of integrating Solana Web3 into your Unity project.

Why Choose Solana for Your Game?

Before diving into the technical steps, it's important to understand why Solana is an excellent choice for game development:

High Throughput: Solana can process thousands of transactions per second, ensuring smooth gameplay even in high-traffic scenarios.
Low Fees: Solana’s low transaction costs make it feasible to implement microtransactions, a common feature in modern games.
Growing Ecosystem: Solana's ecosystem is rapidly expanding, providing developers with a wealth of tools and libraries.

Prerequisites

Before you begin, ensure you have the following:

Unity Installed: Download and install Unity from the official website.
Solana Wallet: Set up a Solana wallet, such as Phantom, to interact with the blockchain.
Solana SDK for Unity: Install the Solana Web3 SDK, which can be found on GitHub or through Unity's package manager.

Step 1: Setting Up Your Unity Project

Start by creating a new Unity project:
Open Unity Hub and click on "New Project." Choose a 3D template, name your project, and select a location to save it.
Click "Create" to set up your project.

Once your project is set up:

Open the Package Manager in Unity (Window > Package Manager).
Click on the "+" icon and select "Add package from git URL."
Enter the URL of the Solana Web3 SDK for Unity and click "Add."

This will import the necessary Solana libraries into your project.

Step 2: Connecting to Solana

Next, you'll need to establish a connection to the Solana blockchain:

Initialize Web3: In your Unity script, start by initializing Web3 to connect to the Solana network.

using Solana.Unity;
using Solana.Unity.Rpc;
using Solana.Unity.Wallet;

public class SolanaConnection : MonoBehaviour
{
    private void Start()
    {
        var rpcClient = ClientFactory.GetClient(Cluster.MainNet);
        var wallet = new Wallet();
        Debug.Log("Connected to Solana: " + rpcClient.NodeAddress);
    }
}

Choose a Network: Solana offers different networks (MainNet, TestNet, DevNet). For testing purposes, use DevNet or TestNet.
Testing the Connection: Run your Unity project and check the console to verify that you're connected to the Solana blockchain.

Step 3: Creating and Managing Wallets

Interacting with the blockchain requires a wallet to manage transactions:

Create a New Wallet: You can generate a new wallet within Unity:

Wallet wallet = new Wallet();
Debug.Log("New Wallet Address: " + wallet.Account.PublicKey);

Importing an Existing Wallet: If you have an existing wallet, you can import it using the mnemonic or private key.

Wallet wallet = new Wallet("your-mnemonic-phrase-here");

Interacting with the Wallet: Display the wallet balance or initiate transactions directly from Unity.

var balance = await rpcClient.GetBalanceAsync(wallet.Account.PublicKey);
Debug.Log("Wallet Balance: " + balance);

Step 4: Implementing In-Game Transactions

One of the key features of blockchain integration in games is the ability to handle in-game transactions securely:

Creating a Token: First, create a token on the Solana blockchain that represents your in-game currency or assets.
Transferring Tokens: Implement functionality in Unity to transfer tokens between players:

var transaction = new TransactionBuilder().AddInstruction(
    TokenProgram.Transfer(
        wallet.Account.PublicKey,
        recipientAddress,
        amount
    )
).Build(wallet.Account);

var result = await rpcClient.SendTransactionAsync(transaction);
Debug.Log("Transaction Result: " + result);

Verifying Transactions: Ensure all transactions are confirmed on the blockchain before updating the game state.

Step 5: Integrating NFTs

Non-fungible tokens (NFTs) can be used to represent unique in-game items, characters, or collectibles:

Minting NFTs: Mint new NFTs directly from your Unity game, assigning unique properties to each token.
Displaying NFTs: Fetch and display NFTs owned by the player within the game, allowing them to interact with their assets.
Trading NFTs: Implement a marketplace where players can trade NFTs securely within your game.

Conclusion

Integrating Solana Web3 into Unity opens up exciting possibilities for game developers, enabling decentralized economies, true ownership of in-game assets, and secure, transparent transactions. By following the steps outlined in this article, you can start building blockchain-based games that leverage the power of Solana.

As the blockchain and gaming industries continue to evolve, staying ahead of the curve with tools like Solana Web3 will ensure your games are innovative and engaging. Happy developing!