如何在服务器中托管多个 html5 游戏?

How can multiple html5 games be hosted in a server?

要求

我正在寻找一个包含多个html5游戏的网站。 类似于Poki Games,或任何其他网页游戏平台。

我的理解

我浏览了他们的 (Poki Games) 网站,发现网站上以网格形式列出了多个 html5 游戏图标。单击任何一个游戏图标后,网站就会开始从 iframe.

内的 外部源加载该特定游戏

我需要什么回答

我想知道他们如何为来自另一个域的多个 html5 游戏提供服务。由于每个游戏都加载到 iFrame 中,我知道它们都有自己的 index.html

如何达到同样的效果,我应该采取什么方法?所以如果我这样做

<iframe src="//another.domain.com/randomHtml5Game_1">  // will load randomHtml5Game1 game
<iframe src="//another.domain.com/randomHtml5Game_2">  // will load randomHtml5Game2 game

我的技能

我主要是一名前端开发人员,有在 heroku 中托管的经验。也有一些使用 firebase 的经验。我将使用 React 和 Phaser 进行开发。

根据我对你问题的理解,答案很简单。

只需使用代码拆分和不同的渲染点。

我们的主页会有各种指向其他页面的链接(图像网格)。当我们点击图片时,它会改变路线。

www.domain.com/game1
www.domain.com/game2
www.domain.com/game3

您将需要使用各种不同的方式对路由进行代码拆分。您可以使用 webpack 或 NextJS(更简单的框架),或者如果您只是使用 create-react-app,只需使用 suspend 和 lazyload。

在特定路线上,它将加载您的 html 和 javascript 和 运行 游戏。

我猜这不是您要寻找的答案,而是一个开始?

告诉我你的想法?

丹尼尔

Firebase 支持使用单个项目托管多个 sites/domains。 您可以将每个游戏分离到一个文件夹中,并使用不同的域分别托管每个游戏。

您可以找到更多相关信息 here

我在部署 Web 应用程序时使用它作为示例。一个域是 app.appname.com 之类的应用程序,然后另一个域 www.appname.com 是登录页面,如果项目是 REST API,我将其托管在 api.appname.com 下。在我的例子中,我只是使用不同的前缀,但整个域和 url 可以不同。

好处是,如果您使用其他 Firebase 功能,您可以在所有这些项目之间共享它们。例如身份验证或数据库。