前言
玩转掘金 系列，对掘金扩展一些有意思的功能，比如：
今天我们实现的是可视化智能抽奖， 还是先看效果！！！
效果演示
因本人矿石太少，所以效果不明显，见谅！！！！
源码
掘金智能抽奖源码： JJSignAndLD
需要安装游猴脚本，或者FEHelper插件，贴入相关代码即可！！
数据分析
API的请求中有两个通用参数， 一个aid一个uuid， 有用嘛，估计有，不用行不行，行！！！！
获取奖池信息
请求地址：https://api.juejin.cn/growth_api/v1/lottery_config/get?aid=[aid]&uuid=[uuid]
请求方式： GET
请求参数： QueryString aid和uuid
返回结果：
就是奖池的信息，之后做展示用！
{ "data": { "lottery": [{ "lottery_id": "6981716980386496552", // 奖ID "lottery_name": "66矿石", // 奖名称 "lottery_type": 1, "lottery_image": "https://xxxx.image", // 奖品图片 "unlock_count": 0 }, ...... ] } } 复制代码
抽奖
请求地址：https://api.juejin.cn/growth_api/v1/lottery/draw?aid=[aid]8&uuid=[uuid]
请求方式： POST
请求参数： QueryString aid和uuid
返回结果
{ data: { history_id: "6997575438109261838", id: 19, lottery_id: "6981716980386496552", lottery_image: "", lottery_name: "66矿石", // 中奖名 lottery_type: 1, } } 复制代码
思路
思路往往比代码本身更重要！
游猴脚本 | FeHelper + JS脚本， 非常简单！
- 获取奖池信息
- 执行抽奖
- 根据执行结果状态码，执行响应操作
代码实现
样式注入
动态创建style标签，注入到head节点下
const styleContent = ` ._jj_draw_container { position:fixed; top: 80px; right: 0; z-index: 9999; background-color: rgba(0,0,0,0.6); padding: 20px; }` function appendStyle(text) { const styleEl = document.createElement('style'); styleEl.textContent = text; document.head.appendChild(styleEl); } appendStyle(styleContent); 复制代码
循环请求与终止
双重判断
isDrawing代表在抽奖- 返回结果
err_no不等于代表失败，err_msg代表错误消息，这里最可能失败的原因就是矿石不足
async function onDraw(ev) { if (isDrawing) { return; } isDrawing = true; try { let errNo = 0; do { if(!isDrawing){ break; } const res = await doDraw(); errNo = res.err_no; if (errNo !== 0) { alert(res.err_msg); isDrawing = false; break; } // 增加奖励 addPrize(res.data) // 渲染 renderPrizes(); // 暂停16ms await delay(undefined, 16).run(); // 单次调试用 //isDrawing = false; //break; } while (errNo == 0) } catch (err) { isDrawing = false alert(err.message); } } 复制代码
更多代码请参见 JJSignAndLD， css + js 约250行代码。
写在最后
3-5分钟，500-1000字，有所得，而不为所累，如果你觉得不错，你的一赞一评就是我前行的最大动力。
技术交流群请到 这里来。 或者添加我的微信 dirge-cloud，一起学习。
