【参赛经验分享】分析js代码开启游玩新世界与Pierre Dellacherie算法本地验证

2021-08-13 18:06:40 浏览数 (1)

腾讯极客挑战赛第四期:鹅罗斯方块

以下仅是我对于这个比赛的思考过程,可能是拿高分的技巧,但我并没有因此拿高分,本人算法水平有限大佬勿喷,对文章中的问题欢迎指出。

接触到赛题的一刻,我玩了几把,总结出以下几种规则

(1)方块顺序是固定的

(2)与其他俄罗斯方块相比多出悬停功能

(3)赛事标签为:算法题(主办方给出)

1.抓包分析部分

后面我想看看能不能钻分数上传的漏洞,对网页进行抓包

我们发现一串record和一个分数

我接着又玩了一把,并修改了分数进行上传

收到返回的结果是传入分数与计算不一致,我立马想到这个record可能是一个计算分数的依据

我尝试去获取record的含义是什么,结果真的好家伙,不找不知道,一找新世界的大门向我敞开

我使用浏览器F12的开发者工具搜索功能,搜索record这个单词,搜索到很多东西,我挨个查看,这个过程就不详细描述了,以下是我发现的几个比较好玩的东西

通过搜索,发现页面有很多注释,那么这些功能也可以进行利用,直接使用浏览器控制台即可

回放操作序列:game.pause();game.playRecord('N,D19,N,D17,N,D16,N,D14,N,D11,N,D9,N,D6,N,D4,N,D3,N,D1'.split(','));

提交上传成绩(会消耗提交次数):axios.post(api/upload, { record: 'N,D19,N,D17,N,D16,N,D14,N,D11,N,D9,N,D6,N,D4,N,D3,N,D1', score: 0 }).then(({ data }) => { console.log('提交结果', data); if(data.info) {console.log(data.info)} });

功能我不过多赘述,可以自行体验

到此我还没明白record到底是什么含义,所以我翻阅搜索到的文件(上图提示很明确,js文件代表的用途都写的很清楚,代码也不多翻一下也可以找到)

我找到一段控制台报错提示,我直接明白的record的含义

record:是一段用户的操作过程,包含移动旋转,生成新方块

我没看到悬停功能指向的代码,我根据这些提示,进一步尝试悬停在record中的体现方式,得出一个结论:下降没到底端直接New一个新方块则视为悬停,例如:D2,N,则视为下降2格悬停,并生成新方块

理解了上传数据的含义,那就不用手动玩这个俄罗斯方块了,并且可以利用record序列进行俄罗斯方块的排布,而且通过回放序列功能,也可以在网页上查看自己写的序列有没有问题(完全无视了速度增加导致手速反应不过来的问题)

大部分的游戏规则可以从tetris.game.min.js中获取(以下规则从此js文件中获取)

/*

•@Author: geek

•@LastEditors: geek

•@Description: 【俄罗斯方块游戏主文件】依赖 tetris.core

•@Src: https://geek.qq.com/tetris/js/tetris.game.js (编译前的源文件) *

•游戏介绍:

•1、将 10000 块按固定顺序出现的方块堆叠,有消除行即得分,看谁得分高

•2、游戏分正式模式和回放模式,正式模式用于 PK 打榜,回放模式(playRecord)目前仅提供用于 debug 操作记录和对应的分数(暂未开放使用)

•3、方块下落速度会随着出现的方块数量加快,每 100 个方块后,速度递减 100ms,原始速度 1000ms,最快 100ms

•4、画布垂直方向满屏后,结束游戏

•5、方块出现的总数最大为 10000 个,超过后结束游戏

•6、每个方块的类型(已有:I,L,J,T,O,S,Z 型方块)、形态(各类型每旋转90度后的形态)会从配置中按照统一顺序、限定概率地读取出来,保证所有人遇到的方块顺序和方块概率都一致

•7、积分规则:当前方块的消除得分 = 画布中已有的格子数 * 当前方块落定后所消除行数的系数,每消除 1、2、3、4 行的得分系数依次为:1、3、6、10(例:画布当前一共有 n 个格子,当前消除行数为2,则得分为:n * 3)

•8、游戏结束触发规则:1)、方块落定后触顶;2)、新建方块无法放置(画布上用于放置方块的格子中有已被占用的)

*

•注:游戏中优先判定是否结束游戏再计分。如:极限情况下,当前方块落定后产生了可消除行,但触顶或者超过最大方块数了,此轮不计分,直接结束游戏

•注:游戏使用的坐标系为 canvas 坐标系(坐标原点在左上角)详见:https://developer.mozilla.org/zh-CN/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes

* */

我认为重要的规则经过加粗显示,规则6说过,方块的顺序是固定的,因为每次游戏开始总是出现相同的,所以我进一步搜索方块的生成规则,以便透析10000个方块的具体类型与旋转角度。

规则6给出了方块顺序与角度顺序,所以我调整了本地pygame代码,以便调整做本地分数校验。

ps:之前也想出一个一个记录,但实在是太麻烦了

1.1 提前算出10000个方块类型和旋转角度

过程就不详细描述,我的方法是在新生成方块的地方进行断点,然后进行逐步分析结论如下:

从tetris.core.min.js中获取到一些重要的生成信息(200行附近代码)

var defaultBrickCenterPos = [4, 0]; //作为定值,不进行计算

var randomConfig = { a: 27073, M: 32749, C: 17713, v: 12358 };

key: "getBrickInfo", value: function getBrickInfo(randomNum, brickCount, brickCenterPos, mute) { var brickRawInfo = this.getRawBrick(randomNum, brickCount, mute); var _this$getBrickPos = this.getBrickPos(brickRawInfo, brickCenterPos, true) , isValid = _this$getBrickPos.isValid , brickInfo = _this$getBrickPos.brickInfo; return { isValid: isValid, brickRawInfo: brickRawInfo, brickInfo: brickInfo } }

key: "getShapeInfo", value: function getShapeInfo(randomNum, brickCount) { var shapes = this.shapes , colors = this.colors; var weightIndex = randomNum % 29; var stateIndex = brickCount % shapes[0].length; var colorIndex = brickCount % colors.length; var shapeIndex = 0; if (weightIndex >= 0 && weightIndex <= 1) { shapeIndex = 0 } else if (weightIndex > 1 && weightIndex <= 4) { shapeIndex = 1 } else if (weightIndex > 4 && weightIndex <= 7) { shapeIndex = 2 } else if (weightIndex > 7 && weightIndex <= 11) { shapeIndex = 3 } else if (weightIndex > 11 && weightIndex <= 16) { shapeIndex = 4 } else if (weightIndex > 16 && weightIndex <= 22) { shapeIndex = 5 } else if (weightIndex > 22) { shapeIndex = 6 } return { shapeIndex: shapeIndex, stateIndex: stateIndex, colorIndex: colorIndex }

key: "getRandomNum", value: function getRandomNum(v) { var a = randomConfig.a , C = randomConfig.C , M = randomConfig.M; return (v * a C) % M }

以下是我进行优化后的JS代码,以便进行10000个方块的运算

//随机数种子

var randomConfig = { a: 27073, M: 32749, C: 17713, v: 12358 };

//计算下一个随机数v

function getRandomNum(v) { var a = randomConfig.a, C = randomConfig.C, M = randomConfig.M; return (v * a C) % M };

//根据随机数、方块生成数进行新方块的信息生成

function getShapeInfo(randomNum, brickCount) { var shapes = new Array(); var weightIndex = randomNum % 29;

var stateIndex = brickCount % 4;//需要通过计算出来的方块,和他的形态数量进行取余,JS文件中不做此项操作

var shapeIndex = 0; if (weightIndex >= 0 && weightIndex <= 1) { shapeIndex = 0 } else if (weightIndex > 1 && weightIndex <= 4) { shapeIndex = 1 } else if (weightIndex > 4 && weightIndex <= 7) { shapeIndex = 2 } else if (weightIndex > 7 && weightIndex <= 11) { shapeIndex = 3 } else if (weightIndex > 11 && weightIndex <= 16) { shapeIndex = 4 } else if (weightIndex > 16 && weightIndex <= 22) { shapeIndex = 5 } else if (weightIndex > 22) { shapeIndex = 6 } return [shapeIndex , stateIndex] };

//运算过程:getRandomNum(12358)获取第一个随机数,getShapeInfo(随机数,生成的方块数)获得第一个方块信息,为6,0

//排列顺序:(已有:I,L,J,T,O,S,Z 型方块)、形态(各类型每旋转90度后的形态)规则6给出

//所以第一个是Z(数组是从0开始的,所以6是第7个Z),形态是0,所以是没有经过旋转,以此类推1为90度,2为180度(只有两种变换形态通过取余方式变成0或者1)

2.算法实现(Pierre Dellacherie算法)

查询资料,我发现最具代表性的AI算法为Pierre Dellacherie算法,所以我对github中分享的pygame游戏其中有Pierre Dellacherie算法,进行修改,用来对活动中的俄罗斯方块进行模拟。发现效果并不理想,可能没有考虑进悬停因素造成的。

我想有了10000个方块和形态,然后又有过程代码可以省去人工操作(广大极客网友可以自行建立算法,Pierre Dellacherie算法我已经踩坑了,算法参数调整并不能带来高分),或许可以慢慢将10000个方块手动搭起来获得高分?

仿制游戏:https://github.com/xiaochen-1/TXTetris(内置AI算法,pygame游戏)

不会输出序列答案,仅提供分数参考(校验分数仅代表本地游戏成绩,与线上计分方式有所不同)

游戏作者为:Charming2015(Github名称)

本人仅修改:游戏高度、宽度、方块生成顺序、生成形态、算法权重

0 人点赞