使用trapi js第2部分为您的游戏设置一个简单的服务器端应用程序

📎 source code to this tutorial at github

github上本教程的源代码

In the previous part, we successfully installed and ran a Strapi application. Now it is time to build the API. But first let’s take a close look at what a game server like this can provide us:

上一部分中 ,我们成功安装并运行了Strapi应用程序。 现在该构建API。 但是首先让我们仔细看看这样的游戏服务器可以为我们提供什么:

  • It can authenticate users.

    它可以验证用户。
  • We can implement game logics.

    我们可以实现游戏逻辑。
  • Users can see leaderboads.

    用户可以看到排行榜。
  • We can change some of the game elements through the server.

    我们可以通过服务器更改某些游戏元素。
  • and lots of other functionalities.

    以及许多其他功能。

控制器,服务和路线 (Controllers, Services and Routes)

For building an API in Strapi, you need to understand 3 main concepts.

为了在Strapi中构建API,您需要了解3个主要概念。

Services: Services serve as global methods which you can use everywhere in your application. Their main job is to reduce the use of some repeatable functions by being available globally.

服务:服务是一种全局方法,您可以在应用程序中的任何地方使用它。 他们的主要工作是通过全局可用来减少对某些可重复功能的使用。

Controllers: Controllers are the main part of your API. The main functions go here.

控制器:控制器是API的主要部分。 主要功能在这里。

Routes: Routes are bounded to controller methods. They are actually Urls which are pointing to a specific method, so each time you call that Url the method gets executed.

路由:路由受控制器方法限制。 实际上,它们是指向特定方法的Urls,因此每次调用该Url都会执行该方法。

Know that you’re familiar with these 3 concepts, we are ready to create a remote config system for our game.

知道您熟悉这3个概念后,我们就可以为我们的游戏创建一个远程配置系统。

远程配置 (Remote Config)

建立模型 (Creating Model)

Let’s say we have an RPG game with different heroes, hero types, buildings, maps, items and etc. Each hero has its own specifications such as damage power (if it is melee), range (if it’s of range type), health, mana and so many other parameters. These things need to be balanced and tweaked by game designers frequently. So it is not a good idea to put them inside the client. The best solution is to get all of those data from your server at the very beginning of the game and keep them for later use.

假设我们有一个角色扮演游戏,角色,英雄类型,建筑物,地图,物品等都不尽相同。每个英雄都有自己的规格,例如伤害力(如果是近战),射程(如果是射程类型),生命值,魔法和许多其他参数。 这些事情需要游戏设计师经常加以平衡和调整。 因此,将它们放入客户端不是一个好主意。 最好的解决方案是在游戏一开始就从服务器中获取所有这些数据,并保留以备后用。

For creating such a functionality, the very first step is to create a model of data. It should be one single model to cover everything that need a config in the game, such as heroes, hero types, items and etc. So we need these fields:

为了创建这样的功能,第一步是创建数据模型。 它应该是一个单一模型,可以涵盖游戏中所有需要配置的内容,例如英雄,英雄类型,物品等。因此,我们需要以下字段:

  • Name (it defines to what specific part of the game, this object belongs)

    名称 (定义对象属于游戏的哪个特定部分)

  • Type (it tells us the type of this object)

    类型 (它告诉我们该对象的类型)

  • Data (the main data that we want to tweak or adjust later)

    数据 (我们要稍后调整或调整的主要数据)

Now that we have a model in mind, we open the Strapi’s admin panel:

现在我们已经有了一个模型,我们打开Strapi的管理面板:

Image for post
Strapi admin panel
Strapi管理面板

here you can see that Strapi has already made a collection (or content-type) called Users. We need something like that for our Remote Config. A collection that stores our config data.

在这里,您可以看到Strapi已经制作了一个名为Users的集合(或内容类型)。 对于我们的远程配置,我们需要类似的东西。 存储我们的配置数据的集合。

open the Content-Types Builder:

打开内容类型生成器:

Image for post

under the Collection Types in the grey column, you can see the blue text saying Create new collection type. Click on it:

在灰色列的集合类型下,您可以看到蓝色文字,表示创建新的集合类型 。 点击它:

Image for post

a window pops open. In the Display name write Remote Config and press Continue. Now you can see this window:

弹出一个窗口。 在显示名称中,写入Remote Config ,然后按Continue 。 现在您可以看到以下窗口:

Image for post

here you should create those 3 fields that we talked about. Name,Type and Data. For name you can choose Text or UID. I recommend you to select UID because it guarantees that the content of that field is unique in entire collection. So I select the UID:

在这里,您应该创建我们所讨论的3个字段。 名称类型数据 。 对于名称,您可以选择TextUID 。 我建议您选择UID,因为它可以确保该字段的内容在整个集合中是唯一的。 所以我选择UID

Image for post

inside the Name field write name (with small letter because it’s better :) )

在“名称”字段中输入名称(用小写字母,因为它更好:))

and click on +Add another field, For our Type field you can select Text:

然后点击+添加另一个字段 ,对于我们的类型字段,您可以选择文本

Image for post
Image for post

in the Name field write type and keep the Short text checked. Because the type of every object should not be so long. Then click on+Add another field:

在名称字段中输入类型,并保持选中短文本 。 因为每个对象的类型都不能那么长。 然后点击+添加其他字段

now for the most important field, Data, we choose JSON:

现在对于最重要的字段Data,我们选择JSON

Image for post

type data in lower case and click on Finish.

以小写形式输入数据 ,然后单击Finish

Image for post

you can see that your model for the new Remote Config collection is ready. Click on the green Save button and wait until the application restarts:

您会看到新的Remote Config集合的模型已准备就绪。 单击绿色的保存按钮,然后等待应用程序重新启动:

Image for post

after a moment, you can see a new collection appeared above the Users collection:

片刻之后,您会看到一个新集合出现在Users集合上方:

Image for post

good. Now lets add a bunch of data in it. Click on Add New Remote Config:

好。 现在让我们在其中添加一堆数据。 单击添加新的远程配置

Image for post

here we want to add the data for a melee hero called Darius — a tough one :)

在这里,我们要添加一个名为Darius的近战英雄的数据-一个艰难的人:)

Image for post

for its type, I write hero because that’s the key to get all heroes data by just one API call.

对于它的类型,我写了hero,因为这是仅通过一个API调用即可获取所有hero数据的关键。

the data field is something like this:

数据字段是这样的:

{
"health": 200,
"healthPerLevel": 2.5,
"damage": 160,
"damagePerLevel": 3.5
}

just a simple json object. Now that we are done, I Click on the Save button.

只是一个简单的json对象。 现在我们完成了,我单击“ 保存”按钮。

I added a bunch of heroes here:

我在这里添加了一堆英雄:

Image for post

you can add other types of objects like this, and put different data inside it. And that’s the power of the JSON fields. Although it is the same collection, Data fields can be different.

您可以添加其他类型的对象,并将不同的数据放入其中。 这就是JSON字段的功能。 尽管它是同一集合,但“数据”字段可以不同。

Now how can we get all of these objects in client?

现在我们如何在客户端中获取所有这些对象?

There’s two ways:

有两种方法:

  • Strapi’s built-in API Endpoints

    Strapi的内置API端点

  • Custom API Endpoints

    自定义API端点

Let’s start with the first and the easier one:

让我们从第一个和更简单的一个开始:

Let’s say we want to get the config data for all the heroes. Navigate to Roles and Permissions under the plugins:

假设我们要获取所有英雄的配置数据。 导航至插件下的“ 角色和权限 ”:

Image for post

click on the pen icon in front of the Public section:

单击“ 公共”部分前面的笔图标:

Image for post

at the bottom of the page you can see Remote Config with a bunch of options below it. Check the find option.

在页面底部,您可以看到“ 远程配置”及其下方的许多选项。 检查查找选项。

In the right hand side this information appears:

该信息在右侧显示:

Image for post

it tells you how to access the remote-config.find method. Remember the GET endpoint.

它告诉您如何访问remote-config.find方法。 记住GET端点。

press Save. Now open a new tab in your browser and type this:

保存。 现在在浏览器中打开一个新选项卡,并输入以下内容:

http://localhost:1337/remote-configs

you can see that the Strapi return the list of all elements present in the Remote Config collection. But we don’t need all of them. We want to specify which type of data we want, because the way we treat them in client side would be different. so by typing this in browser:

您会看到Strapi返回了Remote Config集合中存在的所有元素的列表。 但是我们不需要所有这些。 我们要指定所需的数据类型,因为在客户端处理数据的方式会有所不同。 因此,请在浏览器中输入以下内容:

http://localhost:1337/remote-configs?type=hero
Image for post

you only receive objects of type hero. That’s it! It’s ready to be used inside the game. But as you can see, these array is so huge and if we make so many of those heroes, It can take a while for our client to get them! and after all, why should I send the objects createdDate or created_by and all those useless information? We can definitely change that.

您只会收到hero类型的对象。 而已! 准备在游戏内使用。 但是如您所见,这些阵列非常庞大,如果我们造出了这么多英雄,我们的客户可能需要一段时间才能获得它们! 毕竟,为什么要发送对象createdDatecreated_by以及所有这些无用的信息? 我们绝对可以改变它。

open the main directory to your project:

打开项目的主目录:

Image for post

open api folder and then remote-config:

打开api文件夹,然后remote-config

Image for post

here you need to recall the concepts I mentioned earlier. You need to write a method inside the controller (and in services maybe. only if you need to do something repeatedly). And bound a route to the method. Let’s do all of those things really quick!

在这里,您需要回顾我之前提到的概念。 您需要在控制器内部(也许在服务中)编写一种方法,仅当您需要重复执行某些操作时。 并绑定一条方法。 让我们真正快速地完成所有这些事情!

go inside the controllers folder and open remote-config.js with a code editor. I’m using vscode here:

进入controllers文件夹,并使用代码编辑器打开remote-config.js 。 我在这里使用vscode:

Image for post

we should put all of our methods inside the modules.exports. So it will be exposed to Strapi. Now we want a method to return only desired fields of every hero object. Here is the code:

我们应该将所有方法都放在modules.exports中。 因此它将暴露于Strapi。 现在,我们需要一种仅返回每个英雄对象所需字段的方法。 这是代码:

I defined the method getAllHeroes and received all objects of type hero, kept them in an array called heroes and then extracted only 3 main fields from them and added the modified objects to a new array. And finally I returned the modified array. There is of course better ways to do this but I’m not a fantastic JS programmer so I’m satisfied with this one:)

我所定义的方法和getAllHeroes接收类型主人公所有对象,使它们处于阵列所谓英雄 ,然后萃取从中仅3个主要的字段,并且增加了修改的对象到一个新的数组。 最后我退回了 修改后的数组。 当然,有更好的方法可以做到这一点,但是我不是一个出色的JS程序员,所以我对此感到满意:)

Now that we have our method, we set a route to it. Navigate to config folder and open routes.json :

现在有了我们的方法,我们为其设定了一条路线。 导航到config文件夹并打开routes.json

Image for post
Image for post

you can see bunch of Json objects that bound specific methods to their routes. add this to the top of the list:

您会看到一堆将特定方​​法绑定到其路由的Json对象。 将其添加到列表的顶部:

{
"method": "GET",
"path": "/remote-configs/heroes",
"handler": "remote-config.getAllHeroes",
"config": {
"policies": []
}
}

now save both remote-config.js and routes.json files. Your server will restart to apply changes and after that you have to do the same thing that you did to the find method in Roles and Permissions. Here is a quick snapshot:

现在同时保存remote-config.jsroute.json文件。 服务器将重新启动以应用更改,然后,您必须对Roles and Permissions中find方法执行相同的操作。 这是一个快速快照:

Image for post
Image for post
Image for post

we check the getallheroes method and now it is accessible from a simple url:

我们检查了getallheroes方法,现在可以从一个简单的url访问它:

http://localhost:1337/remote-configs/heroes

the result is:

结果是:

Image for post

you can clearly see the difference between this result and the previous one!

您可以清楚地看到此结果与上一个结果之间的区别!

So now that we have our API and our endpoints, it’s time to go for tweaking our game client in the next part!

因此,既然我们有了API和端点,就该在下一部分中调整游戏客户端了!

翻译自: https://medium.com/swlh/setup-a-simple-server-side-application-for-your-game-using-strapi-js-part-2-baa8df94804e

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值