原生js html5 canvas制作flappy bird压扁小鸟游戏
可以以电脑浏览器的手机模式打开，也可以在手机浏览器中直接打开
游戏运用了Canvas的drawImage，translate，rotate，save，restore，fillRect等API。 采用中介者模式，Game类统领全局，负责读取资源，设置定时器，维护各个物体实例，所有的演员都是Game类new 出来的， 游戏项目外部的语句就一条：
- 碰撞检测
因此小鸟的图片其实是一个长方形，而且角度又不断变化导致中心点难于掌握，因此很难判断小鸟与管子的碰撞。 这里画了张图帮助自己理解
- 小鸟下落的速度
需要模拟小鸟的重力，高中物理没有白学
- 分数的计算
分数的计算与碰撞检测类似，设置一个开关，当管子重新出现时，设置为true。当分值加1时，设置为false。小鸟的最左边的x坐标如果超出了管子的x+width，就认为成功通过。
- 场景管理器
场景管理器有4个方法enter,update,render，bindEvent。其中定时器在每帧执行update方法和render方法。enter方法由业务来调用，比如用户点击了按钮，此时就进入场景2，鸟撞到了管子，就进入场景3。 这样就把游戏的各个不同阶段分离出来，方便处理。
演示下载地址：https://www.erdangjiade.com/js/7968.html
源码实例如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>flappy bird压扁小鸟小游戏</title><meta property="og:type" content="website">
<meta property="og:title" content="Squishy Bird">
<meta property="og:site_name" content="Squishy Birds">
<meta property="og:image" content="src/wav/fbthumb.jpg">
<meta name="viewport" content="user-scalable=no, initial-scale=0.5, width=610, height=1024"><link rel="image_src" href="src/wav/fbthumb.jpg"></head>
<body style="margin: 0px; overflow: hidden;-moz-user-select: none;-webkit-user-select: none;user-select: none;" ><div id="lgd" style="width: 300px; height: 64px; position: absolute; left: 533px; top: 301px; font-family: Verdana; font-size: 16px; font-weight: bold; text-align: center;">Loading...</div><script type="text/javascript" src="src/squishybird.js"></script><div style="overflow: hidden; position: relative; width: 1366px; height: 620px;"><canvas width="1366" height="620"></canvas><img src="src/wav/pipe1.png" width="148" height="1664" style="position: absolute; left: 609px; top: -1533px; z-index: 420;"><img src="src/wav/pipe2.png" width="148" height="1664" style="position: absolute; left: 609px; top: 400.9999999999999px; z-index: 420;"><canvas width="1366" height="88" style="position: absolute; z-index: 31337; left: 0px; top: 532px;"></canvas><canvas width="1366" height="256" style="position: absolute; z-index: 60; left: 0px; top: 276px;"></canvas><canvas width="1366" height="216" style="position: absolute; z-index: 61; left: 0px; top: 316px;"></canvas><img src="src/wav/logo.png" style="position: absolute; opacity: 0; z-index: 42069; left: 370px; top: 174px; display: none;"><img src="src/wav/gameover.png" style="position: absolute; opacity: 1; z-index: 42069; left: 370px; top: 93px; display: inline;"><img src="src/wav/clicktostart.png" style="position: absolute; opacity: 0; z-index: 42070; left: 514px; top: 435px; display: none;"><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 536px; top: 17px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 535px; top: 17px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 534px; top: 17px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 533px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 533px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 533px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(255, 255, 255); z-index: 88888; -webkit-user-select: none; left: 533px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 533px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 533px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 533px; top: 17px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 532px; top: 17px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 531px; top: 17px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 23px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 22px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 21px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 20px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 19px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 18px;">0</div><div style="width: 300px; height: 50px; position: absolute; text-align: center; font-family: Verdana; font-weight: bold; font-size: 30px; color: rgb(0, 0, 0); z-index: 88887; -webkit-user-select: none; left: 530px; top: 17px;">0</div><canvas width="150" height="150" style="z-index: 69; position: absolute; left: 880.7973799593747px; top: 288.1699138371274px;"></canvas><canvas width="150" height="150" style="z-index: 69; position: absolute; left: 94.18296936130267px; top: 175.22475277371694px;"></canvas><canvas width="150" height="150" style="z-index: 69; position: absolute; left: 147.39346598794316px; top: 196.6628938429057px;"></canvas><canvas width="150" height="150" style="z-index: 69; position: absolute; left: -235.79706690685066px; top: -486.7269952782424px;"></canvas>
</div><audio src="src/wav/flap.wav"></audio>
<audio src="src/wav/flap.wav"></audio>
<audio src="src/wav/flap.wav"></audio>
<audio src="src/wav/flap.wav"></audio>
<audio src="src/wav/flap.wav"></audio>
<audio src="src/wav/slide.wav"></audio>
<audio src="src/wav/slide.wav"></audio>
<audio src="src/wav/slide.wav"></audio>
<audio src="src/wav/clang.wav"></audio>
<audio src="src/wav/clang.wav"></audio>
<audio src="src/wav/clang.wav"></audio>
<audio src="src/wav/coin.wav"></audio>
<audio src="src/wav/coin.wav"></audio>
<audio src="src/wav/coin.wav"></audio>
<audio src="src/wav/coin2.wav"></audio>
<audio src="src/wav/coin2.wav"></audio>
<audio src="src/wav/coin2.wav"></audio>
<audio src="src/wav/coin3.wav"></audio>
<audio src="src/wav/coin3.wav"></audio>
<audio src="src/wav/coin3.wav"></audio>
<audio src="src/wav/coin4.wav"></audio>
<audio src="src/wav/coin4.wav"></audio>
<audio src="src/wav/coin4.wav"></audio>
<audio src="src/wav/kick.wav"></audio>
<audio src="src/wav/kick.wav"></audio>
<audio src="src/wav/kick.wav"></audio>
<audio src="src/wav/kick.wav"></audio>
<audio src="src/wav/kick.wav"></audio>
<audio src="src/wav/kick2.wav"></audio>
<audio src="src/wav/kick2.wav"></audio>
<audio src="src/wav/kick2.wav"></audio>
<audio src="src/wav/kick2.wav"></audio>
<audio src="src/wav/kick2.wav"></audio>
<audio src="src/wav/kick3.wav"></audio>
<audio src="src/wav/kick3.wav"></audio>
<audio src="src/wav/kick3.wav"></audio>
<audio src="src/wav/kick3.wav"></audio>
<audio src="src/wav/kick3.wav"></audio>
<audio src="src/wav/kick4.wav"></audio>
<audio src="src/wav/kick4.wav"></audio>
<audio src="src/wav/kick4.wav"></audio>
<audio src="src/wav/kick4.wav"></audio>
<audio src="src/wav/kick4.wav"></audio>
<audio src="src/wav/kick5.wav"></audio>
<audio src="src/wav/kick5.wav"></audio>
<audio src="src/wav/kick5.wav"></audio>
<audio src="src/wav/kick5.wav"></audio>
<audio src="src/wav/kick5.wav"></audio>
<audio src="src/wav/squish1.wav"></audio>
<audio src="src/wav/squish1.wav"></audio>
<audio src="src/wav/squish1.wav"></audio>
<audio src="src/wav/squish2.wav"></audio>
<audio src="src/wav/squish2.wav"></audio></body>
</html>相关文章：
原生js html5 canvas制作flappy bird压扁小鸟游戏
可以以电脑浏览器的手机模式打开，也可以在手机浏览器中直接打开 游戏运用了Canvas的drawImage，translate，rotate，save，restore，fillRect等API。 采用中介者模式，Game类统领全局，负责…...
服务器集群 -- nginx配置tcp负载均衡
当面临高流量、高可用性、水平扩展、会话保持或跨地域流量分发等需求时，单台服务器受限于硬件资源、性能有限不能满足应用场景的并发需求量时，引入负载均衡器部署多个服务器共同处理客户端的并发请求，可以帮助优化系统架构，提高系…...
现代DevOps如何改变软件开发格局
在软件开发的早期，该过程通常是开发人员编写代码，再将其交给质量保证（QA）进行测试。这种瀑布开发方法可能会导致质量问题和延迟，因为问题是在周期后期发现的。 一、了解DevOps和测试左移 DevOps是Development和Opera…...
如何在WordPress网站上设置多语言展示
在今天的全球化世界中，拥有多语言网站对于吸引更广泛的受众至关重要。前不就我们遇到Hostease的客户咨询我们的在线客服，他想要对他的wordpress网站支持多语言。我们提供给客户可以尝试以下的插件来支持多语言。 在本教程中，我们将逐步介绍如…...
Pinia和Vuex有什么区别？
API设计： Pinia的API设计更加简洁和直观。它采用了类似于Vue Composition API的风格，使用了更加现代化的语法和概念。相比之下，Vuex的API设计较为传统，使用了基于对象和字符串的方式来定义和访问状态。 TypeScript支持ÿ…...
普林斯顿算法讲义（二）
原文：普林斯顿大学算法课程 译者：飞龙 协议：CC BY-NC-SA 4.0 2.2 归并排序 原文：algs4.cs.princeton.edu/22mergesort 译者：飞龙 协议：CC BY-NC-SA 4.0 我们在本节中考虑的算法基于一种简单的操作ÿ…...
JVM 面试——G1和ZGC的区别
ZGC是一款JDK 11中新加入的具有实验性质的低延迟垃圾收集器ZGC的目标主要有4个 支持TB量级的堆。我们生产环境的硬盘还没有上TB呢，这应该可以满足未来十年内，所有JAVA应用的需求了吧。最大GC停顿时间不超10ms。目前一般线上环境运行良好的JAVA应用Minor …...
当“新质生产力”遇上“CAE仿真”，将激起什么样的火花？
在刚刚闭幕的全国两会上，新质生产力无疑是最为“滚烫”的热词。发展新质生产力是推动高质量发展的内在要求和重要着力点，此次更被列为2024年政府重点任务的第一条。 新质生产力是创新起主导作用，摆脱传统经济增长方式、生产力发展路径&#…...
使用 ChatGPT 写高考作文
写作文，很简单，但写一篇好的作文，是非常有难度的。 想要写一篇高分作文，需要对作文题目有正确的理解，需要展现独到的观点和深入的思考，需要具备清晰的逻辑结构，需要准确而得体的语言表达。 正…...
mac输入su命令报错如何重置密码
diannao1xiejiandeMacBook-Air ~ % su Password: su: Sorry输入 sudo passwd 命令重置密码即可。...
KY211 特殊排序
描述： 输入一系列整数，将其中最大的数挑出(如果有多个，则挑出一个即可)，并将剩下的数进行排序，如果无剩余的数，则输出-1。 输入描述： 输入第一行包括1个整数N，1<N<1000&#x…...
设计模式八：观察者模式
文章目录 1、观察者模式2、示例3、spring中的观察者模式3.1 spring观察者模式的使用3.2 spring观察者模式原理解析 1、观察者模式 观察者模式（Observer Design Pattern）,也叫做发布订阅模式（Publish-Subscribe Design Pattern）、模…...
黑马程序员java部分笔记（持续更新）十点二：封装
面向对象的三大特征：封装，继承，多态 告诉我们正确的属性与方法 例1：需求：定义一个类：人 属性：姓名，年龄 行为：吃饭，睡觉 代码： public class Pe…...
ChatGPT-Next-Web SSRF漏洞+XSS漏洞复现(CVE-2023-49785)
0x01 产品简介 ChatGPT-Next-Web 是一种基于 OpenAI 的 GPT-3.5 、GPT-4.0语言模型的产品。它是设计用于 Web 环境中的聊天机器人，旨在为用户提供自然语言交互和智能对话的能力。 0x02 漏洞概述 2024年3月，互联网上披露CVE-2023-49785 ChatGPT-Next-Web SSRF/XSS 漏洞,未经…...
【小黑嵌入式系统第十九课】结课总结（三）——操作系统部分（RTOSμC/OS-Ⅲ程序设计基础（任务函数时间临界区通信））
上一课： 【小黑嵌入式系统第十八课】结课总结（二）——软件部分（系统架构&调试&测试&运行&系统软件设计） 前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默࿰…...
C# Onnx C2PNet 图像去雾 室内场景
目录 介绍 效果 模型信息 项目 代码 下载 C# Onnx C2PNet 图像去雾 室内场景 介绍 github地址：GitHub - YuZheng9/C2PNet: [CVPR 2023] Curricular Contrastive Regularization for Physics-aware Single Image Dehazing [CVPR 2023] Curricular Contrasti…...
工作中Git如何切换远程仓库地址
工作中Git如何切换远程仓库地址 部门之前的仓库不用了，重新建了一个仓库，但是上传代码还是上传到了之前的仓库里面了，所以得进行修改，下面将修改地址的方法进行操作。 方法一、直接修改远程仓库地址 查看当前远程仓库地址 git …...
香港理工大学主办！2024年第八届电力能源系统与应用国际会议（ICoPESA 2024）即将召开！
2024年第八届电力能源系统与应用国际会议（ICoPESA 2024） 2024年6月24日-26日 中国香港 ICoPESA 2024-Hong Kong (icpesa.org)https://icpesa.org/index.html 会议组织单位 会议出版及检索： 会议录用并注册的论文将由IEEE出版，…...
【微服务-Nacos】Nacos集群的工作原理及集群间数据同步过程
上篇文章我们介绍了Nacos集群的搭建方法及步骤，下面我们来看一下Nacos集群的工作原理，一共有两部分：Leader节点选举及各节点数据同步。 1、Nacos集群中Leader节点是如何产生的 Nacos集群采用了Raft算法实现。它是一种比较简单的选举算法&am…...
LeetCode202.快乐数
202快乐数 编写一个算法来判断一个数 n 是不是快乐数。 「快乐数」 定义为： 对于一个正整数，每一次将该数替换为它每个位置上的数字的平方和。 然后重复这个过程直到这个数变为 1，也可能是 无限循环 但始终变不到 1。 如果这个过程 结果为 1&…...
conda相比python好处
Conda 作为 Python 的环境和包管理工具，相比原生 Python 生态（如 pip 虚拟环境）有许多独特优势，尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处： 一、一站式环境管理：…...
大数据学习栈记——Neo4j的安装与使用
本文介绍图数据库Neofj的安装与使用，操作系统：Ubuntu24.04，Neofj版本：2025.04.0。 Apt安装 Neofj可以进行官网安装：Neo4j Deployment Center - Graph Database & Analytics 我这里安装是添加软件源的方法 最新版…...
P3 QT项目----记事本（3.8）
3.8 记事本项目总结 项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...
HBuilderX安装（uni-app和小程序开发）
下载HBuilderX 访问官方网站：https://www.dcloud.io/hbuilderx.html 根据您的操作系统选择合适版本： Windows版（推荐下载标准版） Windows系统安装步骤 运行安装程序： 双击下载的.exe安装文件 如果出现安全提示&…...
如何在最短时间内提升打ctf（web)的水平？
刚刚刷完2遍 bugku 的 web 题，前来答题。 每个人对刷题理解是不同，有的人是看了writeup就等于刷了，有的人是收藏了writeup就等于刷了，有的人是跟着writeup做了一遍就等于刷了，还有的人是独立思考做了一遍就等于刷了。…...
【碎碎念】宝可梦 Mesh GO : 基于MESH网络的口袋妖怪 宝可梦GO游戏自组网系统
目录 游戏说明《宝可梦 Mesh GO》 —— 局域宝可梦探索Pokmon GO 类游戏核心理念应用场景Mesh 特性 宝可梦玩法融合设计游戏构想要素1. 地图探索（基于物理空间 广播范围）2. 野生宝可梦生成与广播3. 对战系统4. 道具与通信5. 延伸玩法 安全性设计 技术选…...
c++第七天 继承与派生2
这一篇文章主要内容是 派生类构造函数与析构函数 在派生类中重写基类成员 以及多继承 第一部分：派生类构造函数与析构函数 当创建一个派生类对象时，基类成员是如何初始化的？ 1.当派生类对象创建的时候，基类成员的初始化顺序 …...
Cilium动手实验室: 精通之旅---13.Cilium LoadBalancer IPAM and L2 Service Announcement
Cilium动手实验室: 精通之旅---13.Cilium LoadBalancer IPAM and L2 Service Announcement 1. LAB环境2. L2公告策略2.1 部署Death Star2.2 访问服务2.3 部署L2公告策略2.4 服务宣告 3. 可视化 ARP 流量3.1 部署新服务3.2 准备可视化3.3 再次请求 4. 自动IPAM4.1 IPAM Pool4.2 …...
uniapp 实现腾讯云IM群文件上传下载功能
UniApp 集成腾讯云IM实现群文件上传下载功能全攻略 一、功能背景与技术选型 在团队协作场景中，群文件共享是核心需求之一。本文将介绍如何基于腾讯云IMCOS，在uniapp中实现： 群内文件上传/下载文件元数据管理下载进度追踪跨平台文件预览 二…...
认识CMake并使用CMake构建自己的第一个项目
1.CMake的作用和优势 跨平台支持：CMake支持多种操作系统和编译器，使用同一份构建配置可以在不同的环境中使用 简化配置：通过CMakeLists.txt文件，用户可以定义项目结构、依赖项、编译选项等，无需手动编写复杂的构建脚本…...