跳至主要内容

1 篇文章 含有標籤「Next.js」

檢視所有標籤

· 閱讀時間約 6 分鐘
YingYi Chen

This is a side project which is an Online ARPG like Diablo and POE. Because I enjoy playing POE, that's why I want to make something like it. But I am a programmer, not a designer or artist. So currently there is not much game content in this prototype.

This project includes website, launcher, server and game client. The programing language used in this project are C++, Go, javascript, HTML and CSS. Let's talk about details separetly.

Player Authentication

I used Firebase Authentication to achieve authentication. Why Firebase? There are 2 reasons.

  1. I used it while working at Xinfuyi. The only difference is integrating with web application in this project.
  2. Firebase is easy to suppport multiple login methods. Currently, this project only supports the email/password method.

Website

The webiste is for displaying announcement and account managment. Official Website: https://mymmo-386903.web.app/

The web framework used is Next.js. Why Next.js? It's easy to integrate with Firebase and the website can be hosted on Firebase Hosting. The website generally just combines the tutorial and Firebase sample. For this prototype, I don't want to waste time here. So the website doesn't look so fancy. Sorry about hurting your eyes. :(

Launcher

The launcher is develpoed using Electron. Why Electron? Cross-platfrom, Web-based developemnt, Looks fancy :) .

There are two main functions in the launcher.
First is authentication, I use Electron to show a login web page. After the player login, the launcher retrieves the Firebase login token and sends it to the game client.
Second is updating game client, the launcher will download a text file from Google Cloud Storage. The text file contains a list of files and MD5. The launcher uses the MD5 to check whether it needs to download the new files.

Unreal Game Client And Server

I choose to use Unreal Engine to develop the game. Learning new things is alwayes excited to me. So I think it's a good opportunity to learn Unreal during my free time.
I use both C++ and blueprint in the project. I think the linked video explains C++ and blueprint very well. If you are interesting in C++ VS Blueprint, take a look: https://www.youtube.com/watch?v=VMZftEVDuCE.
There are three features that I have to use C++.

  1. gRPC in the client build.
    The gRPC is used for the game client to communicate with my Golang server.
    There are some issues we can discuss.
  • The gRPC uses Protocol Buffer to define the data transmitted between client and server. Not like JSON where you can modify the data structure whenever the developer wants. So if I change the .protoc file on the server side, the client side also needs to be rebuilt. It sounds like not very scalable, but I think it's OK to use in my scenario. For example, when the player tries to log in, the client sends a string to the server. This login process won't easily be changed in the future. So I don't have to worry about that.
  • I need to build the C++ library by myself. There are some open-source projects that I refer to.
    https://github.com/chungphb/grpc-cpp
    https://github.com/WSStudios/UE4ProtobufExample
    https://github.com/thejinchao/libprotobuf
  1. Agones in the server build.
    Agones is for dedicated game servers. I developed the MaJang game server using Agones before. And I am surprised to see it supports the Unreal Engine. That's why this project became an online game. I just want to give it a try. I will talk more about the server architecture in the server paragraph.
  2. Redis in the server build.
    The Unreal game server needs retrieve player data from the redis server. So I need a Reids client library built in Unreal server. The library I used is hiredis.

Another important plugin used in the project is GameplayAbilitySystem(GAS) plugin. The biggest reason why using GAS is it handles the network synchronization for the developer. The best documentation of GAS is an open-source project: https://github.com/tranek/GASDocumentation. There are only two abilities in the prototype. One is the fireball used by the player, another is the melee attack used by the monster.
There is an advanced topic can be discussed: predicting projectiles. I don't solve this prediction problem. You might see weird behavior about the fireball if you have high latency. I believe there should be some mechanism to let the projectiles fire more smoothly on the client side.

Server - Architecture

There are four kinds of applicaiotn run on the server. All the applications run in GKE. All the applications except the Unreal part are written in Go.

  1. Auth Service

The auth service is responsible for player authentication. It reads the Firebase token from the player request and check it with the Firebase server. If the token is valid, the auth service will push the player's UID to the login queue which is a queue on Reids. Also, it generates a JWT token for the authenticated player to check whether he is allowed to log in.
The token contains some information to prevent invalid access.

  • ip: Prevent the token is stolen by hackers.
  • login time: Prevent an out-dated log in request.
  • Maybe need More?
    To handle a large number of players logging at the same time, I use the load balancer and the horizontal pod autoscaler to achieve dynamic scalability.
  1. Login Queue Manager

This is the application that the player can't connect to. It periodically checks two things. First is the login queue from the Redis. Second is the available servers from Agones. The login queue manager allocates the game server and writes the data to Redis when the player can log in.

  1. Game Lobby Server

I am not sure if it's good or not to call this application as game lobby server. But I'll leave it there right now. The main function that runs in the game lobby server is the read/write Spanner database. Here are some game features that should provided by the game lobby server. Not all of them are implemented in the current prototype.

  • Create / Delete Character
  • Map Travel
  • Chat
  • Party
  • Trade
  • Kick Player
    Basically, it handles all the things not related to the Unreal server.
  1. Unreal Game Server

The Unreal game server is simply built from Unreal but Linux version.

Agones is an important library used in the game lobby and Unreal game server. The dedicated server is a way to allow multiplayer playing at the same time. The server actually runs multiple instances of the game lobby and the Unreal game server. One benefit of using dedicated server is that if one of the servers crashes, it won't affect the others. Also, Agones provided rolling update which allow us to updating server without downtime.

Due to the server resource limitation, you might see the error dialog which tells you no available server right now.

Here is the graph describing the process of the player log-in. Server Architecture Graph

Thanks for reading

I'll continue developing this project during my free time. Keeping learning while developing. Thanks for reading this.