如何制作一个局域网内的 HTML 游戏网站？

问题求助❓
1

收集了一些 RPG Maker 制作的游戏，由 MV 以后的引擎开发的游戏本质上是一个网页，用 python 之类的工具部署后可以在内网用浏览器游玩。

我想做一个网站链接到这些游戏，可以在局域网内用任意设备游玩。不仅可以节省设备空间不用传输游戏，而且对系统没有要求，在 Android 或 Linux 设备上不用装模拟器了。

实际尝试了一下遇到了几个问题：

  1. 存档不知道怎样同步。游戏的存档在浏览器中，位置如图
    图床
    需要将其与服务端的本地存档实现同步。能想到的方法是服务端开一个ftp，在客户端的浏览器里运行一个油猴脚本来同步。但这样不仅麻烦，许多浏览器也不能装油猴插件。

  2. 浏览游戏的网页不知道怎么写。我不会 HTML，目前让 GPT 写了一个简陋的页面把各个游戏的路径填进去。美观与否先不谈，想找到某个游戏都很困难。有没有一个类似以前的 flash 游戏网页模板，能显示游戏名、社团名以及一张预览图。最好在鼠标移上去时还能显示简介、游玩状态之类的元数据。
    图床

  3. 如何实现元数据管理以及在这之上的检索系统？最好能够导入 playnite 的数据。

  4. 有没有办法方便的添加游戏？

我只会一点 python，对网站相关的开发工作一无所知。有没有现有的自托管服务能满足我的需求？我查了一下，没有可以直接部署的 HTML 游戏服务端。查到 NextCloud 放上游戏可以直接游玩，但是不能实现存档同步也没什么用。

如果没有现成的服务，自己开发一个这样的网站需要哪些知识？用什么实现存档的同步管理以及游戏元数据的管理比较简单快捷？

2

这题我可以用我个人的经验勉强答一下：

  1. 直接一直和ai聊，用浮动布局堆div也能堆出好看的UI，但鼠标移上去显示相对麻烦
    1
    这是我搭在博客里的一个自用导航，全部内容都是靠三脚猫html知识和GPT帮助写的
    优点是自定义程度高，缺点就是费时费力

  2. 有很多现成的导航页模板可以用，直接搜“导航页模板”之类的关键词即可，也不用担心用不来，找无后台纯html的就可以了。

如果你最终实现方式还是上面这种html页面合集的话，可以找ai帮你写python脚本，把所有游戏信息(名字、链接什么的)放到excel表里，然后用python批量转化成html再塞到网页里就行了。

以上都是我个人摸索导航站时的经验，可能不是很好的解决方案，仅供参考了属于 :smiley:

3

想方便的添加游戏要么有个数据库和对应的操作界面，要么写在 json/yml 里，然后走静态构建。。

4

Jinja2 是一个现代的，设计者友好的，仿照 Django 模板的 Python 模板语言。 它速度快，被广泛使用，并且提供了可选的沙箱模板执行环境保证安全:

<title>{% block title %}{% endblock %}</title>
<ul>
{% for user in users %}
  <li><a href="{{ user.url }}">{{ user.username }}</a></li>
{% endfor %}
</ul>

yml 要更好；

yml 实现一个 games 列表，每一项包含名字，描述，预览图路径字段

games:
  - name: "The Legend of Zelda: Breath of the Wild"
    description: "Explore the wilds of Hyrule any way you like—anytime, anywhere. Discover and explore the vast kingdoms, meet and interact with memorable characters, and experience an epic adventure."
    preview_image_path: "/images/zelda-breath-of-the-wild.png"

  - name: "Super Mario Odyssey"
    description: "Join Mario on a massive, globe-trotting 3D adventure! Use his incredible new abilities to collect Moons so you can power up your airship, the Odyssey, and rescue Princess Peach from Bowser's wedding plans!"
    preview_image_path: "/images/super-mario-odyssey.png"

  - name: "Cyberpunk 2077"
    description: "Cyberpunk 2077 is an open-world, action-adventure story set in Night City, a megalopolis obsessed with power, glamour, and body modification. Assume the role of V, a mercenary outlaw going after a one-of-a-kind implant that is the key to immortality."
    preview_image_path: "/images/cyberpunk-2077.png"
1 个赞
5

或许你可以在RPG Marker 论坛提问。

管理数据，试试 vuepress/vitepress 这种？带搜索功能，数据用 markdown 维护。