Project1

标题: 如何在.ZIP跑index.html(跑RMMV游戏) ? [打印本页]
作者: play337    时间: 2022-10-29 21:35
标题: 如何在.ZIP跑index.html(跑RMMV游戏) ?
本帖最后由 play337 于 2022-10-29 23:51 编辑

如何在.ZIP跑index.html(跑RMMV游戏) ?

你开始玩游戏的时候 会有一个 [ RUN GAME ]
按下去之后
01.会先下载你的 .ZIP 文档
02.解压缩 .ZIP 文档到你的浏览器暂存目录
03.然后开始以超快的速度运行你的游戏. 都不需要在下载任何文档
04.也就是不会玩到一半一直下载图片.JSON.声音档等等

就是一个前导....

可以在WEB里面跑 .ZIP (包含index.html 文档) 的 js 前导 !!!!

这样我就可以把我的 RPG MAKER MV 的项目
01.压缩成一个 .ZIP(文档变小/降低游戏传输时间)
02.把游戏通通放在浏览器暂存下面跑.都不需要再下载游戏了

请问各位大神.... 你们有看过这样的前导JS FOR WEB 可以下载吗?

==============================================
这两种比较象....

01.
https://rowadz.github.io/caskbrewer/

02
https://yomotsu.github.io/ZipLoader/examples/index.html

不过竟然除了演示....甚麽都不能跑..



作者: fux2    时间: 2022-10-30 13:58
不压缩的目的就是按需下载，压缩之后必须全部下载才能进行游戏，显然不是更好的选择
作者: 小怪兽奇奇侠    时间: 2022-10-30 18:32
fux2 发表于 2022-10-30 13:58
不压缩的目的就是按需下载，压缩之后必须全部下载才能进行游戏，显然不是更好的选择 ...

话说这种服务器端只留一个压缩包，客户端把压缩包加载过来并解压，然后游戏所有资源就都加载好了的方法真的可行吗？（js实现的话

浅想一下，我认为这个过程存在一个问题：浏览器下载解压肯定可以做到，把解压出来的index.html呈现到浏览器上也没问题，问题就是index.html作为入口文件，它所关联的外链文件（如各种js、css等）虽然也都随着压缩包解压了，但是是在客户端而不在服务器端，这就会导致客户端的index.html在运行时关联不到文件，毕竟服务器上只有一个压缩包不是吗。

还是说是有什么办法可以应用解压出来的那些资源？
作者: fux2    时间: 2022-10-30 18:59
小怪兽奇奇侠 发表于 2022-10-30 18:32
话说这种服务器端只留一个压缩包，客户端把压缩包加载过来并解压，然后游戏所有资源就都加载好了的方法真 ...

连楼主的问题一起回答了

硬要做到可以，搜一下zip.js引入就可以了，我在其他地方（h5mota.com)这样的在线H5魔塔网站玩的时候他们就用的这种方法，但这是因为魔塔一般体量比较小，下载不需要太长时间。

RM这种动辄几百M起步的我认为用户不是很能等得起

zip.js地址
https://github.com/gildas-lormeau/zip.js
作者: loveinyou200    时间: 2022-11-4 17:29
好问题，一同参与学习。。。
作者: rfvtgbzxc    时间: 2022-11-8 11:55
本帖最后由 rfvtgbzxc 于 2022-11-8 14:07 编辑

结论：可行，部分内容已自己实现过，部分内容有待实践。最终结果和你的问题的目标略有出入，即玩家还是必须要有最初的index.html，但是其他文件都可以放在数据包里。

方案：
1.利用IndexedDB作为存储方案
2.利用jszip直接管理读入的数据包
3.重写所有相关的访问api，改走jszip

详解：
1.浏览器这边没有读写用户文件系统的api，因此下载的zip不能像其他客户端程序那样被直接解压并放在文件系统里。但是浏览器是有让大文件持久化存储的api的——IndexedDB。MZ处理浏览器端存档的方案localforage就是使用了IndexedDB，理论上整个硬盘的空间都能用于IndexedDB存储，500MB的游戏不在话下。直接复用系统自带的localforage库即可轻松完成对IndexedDB的读写操作（直接用IndexedDB的api还是挺麻烦的）。但是单项Item似乎有大小限制，一个文件好像不能超过20+Mb，如果是Blob存储方式会大很多，我当时碰到存储限制后，把数据改用Blob存储了，就没有碰到超出的问题，不知道更大，大到500mb的一整个文件都放在条目里会不会有问题。但是这个问题不算大，大不了手动分块。所以整个游戏数据的存取就没有问题了。

2.现在读出了zip到内存中（以ArrayBuffer形式存在），要将其像平时打开zip文件那样使用它，我推荐使用jszip库。jszip库读取完这个zip后会生成一个像文件系统的对象，可以很容易获取里面的文件夹和文件，于是内部的文件也可以很容易被获取到。在没有压缩和加密的情况下，访问包内任意数据的速度基本上和从内存中访问源数据是一致的；有压缩的情况下，可能需要在下载数据后再多一步解压数据，再用无压缩的方式打包成压缩包才能保证运行速度。
这里有分歧，也可以不再压缩回去，而是直接用目录作为localforage的key进行存储和读取，这个方案的优劣有待讨论，如果localforage运行时有缓存差异就不大，没有的话，反复读取硬盘文件，性能可能会稍微差一点。

3.最后修改游戏内部读写文件的api，虽然要改的地方比较多，但是因为直接使用jszip的api，自己再封装一下promise请求，修改后的代码甚至可以比原来的更清爽，比如这是关于Data部分的存取代码：（其中Game.data就是一个jszip对象，包含了data目录下的所有内容）

  1. DataManager.loadDataFile = function (name, src) {
  2.     Game.data.file(src + ".json")
  3.       .async("string")
  4.       .then(dataJson => {
  5.         const obj = JSON.parse(dataJson);
  6.         window[name] = obj;
  7.         this.onLoad(obj);
  8.       })
  9.       .catch(e => {
  10.         this.onDataFetchError(name, src);
  11.       });
  12.   };
复制代码
作者: 橙子润喉糖    时间: 2024-6-14 21:48
这个话题没有后续了嘛
作者: utunnels    时间: 2024-6-15 13:36
我觉着与其如此不如找个缓存的插件把重要的图片音效资源都缓存了，这样下载的时候直接读取浏览器缓存了。图片啥的基本都是png，zip也压缩不了多少。
之前写过一个用jszip的小页游，不过那个尺寸比较小，只有几M，我把所有的资源都读到内存，文本用字符串，图片直接转成base64字符串，音乐用uint8array或者arraybuffer存储，用AudioContex播放……
作者: l_y    时间: 2024-6-15 18:50
我觉得你的需求是实现 MV 游戏的离线缓存,使玩家可以像本地一样地体验游戏。

这里我推荐使用 Service Worker 和 Appcache （旧浏览器回退）技术。不过要求网站必须启用 HTTPS 安全协议才能使用。

直接用 zip 文件的方式可能不太合适,因为手机浏览器加载超过 275MB 的文件可能会出现问题。还有就是网页上解压 zip 的速度并不是很快。

有一个可以通过 HTML5 的 File API 实现读取用户本地 zip 或 apk 文件 , 从而运行 RMMV 游戏的实现。如果有兴趣的话可以私聊我！（免费的）
作者: 505681468    时间: 2024-6-15 19:54
看着像是小程序那种，先打开一个页面做下载器，更新下载游戏文件，下载完毕后再进入游戏
作者: l_y    时间: 2024-6-16 18:09
哎呀,本来想给你发个私信,没想到发现等级不够。话说楼主是不是希望这样打包的类型

https://www.mediafire.com/file/ce54ennxspzloys/测试.zip/file

相比打包成 Zip 或者其他类型文件 ,我更推荐你考虑使用 Service Worker 技术。
作者: l_y    时间: 2024-6-16 22:27
本帖最后由 l_y 于 2024-6-17 10:42 编辑

不打包 .js.gz 应该也是行的
作者: l_y    时间: 2024-6-16 22:51
本帖最后由 l_y 于 2024-6-17 10:32 编辑

话说楼主的网站支持 HTTPS 吗？
如果支持的话只需要 2 行代码，1 个 js 文件和1 个appcache文件就可以了，甚至不需要打包。
作者: l_y    时间: 2024-6-17 10:38
你是否有一些已经开发好的RPG Maker MV游戏,可以方便地发布到网上?如果有现成的资源,实现起来会比较容易。
作者: l_y    时间: 2024-6-17 10:55
l_y 发表于 2024-6-16 22:51
话说楼主的网站支持 HTTPS 吗？
如果支持的话只需要 2 行代码，1 个 js 文件和1 个appcache文件就可以了， ...

有道理！
作者: l_y    时间: 2024-6-17 12:07
网站其实本身并没有被打包成 gzip 格式,而是服务器在传输某些文件时(如 js、json 等文本类型文件)使用了 gzip 压缩,以减小传输数据量,从而加快加载速度。但是对于音频、图像等,gzip 压缩效果有限。我看了一下图像文件好像并没有 Content-Encoding:gzip 响应头

这个网站实际上是通过 iframe 引用了另一个真实网址。Iframe 允许在当前网页中嵌入其他页面。虽然从表面看不出区别,但引用的才是实际提供内容和功能的网页,当前页面只是起到了一个浏览的作用。

真实网址：
https://html-classic.itch.zone/html/10691443/run-js-gz/index.html




欢迎光临 Project1 (https://rpg.blue/) Powered by Discuz! X3.1