AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

Linux系统之部署2048网页小游戏

2024-05-08 151
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
本文涉及的产品
RDS MySQL Serverless 基础系列，0.5-2RCU 50GB
推荐场景：
学生管理系统数据库设计 搭建个人博客
云数据库 RDS MySQL，集群系列 2核4GB
推荐场景：
搭建个人博客
云数据库 RDS PostgreSQL，集群系列 2核4GB
简介： 【5月更文挑战第5天】Linux系统之部署2048网页小游戏

一、2048小游戏介绍

1.1 2048小游戏简介

2048是一款数字拼接的益智游戏。游戏的目标是通过在一个4x4的方格中移动和合并不同数字的方块，最终组合出一个数字是2048的方块。游戏规则很简单，玩家可以通过滑动方向键（上、下、左、右）来移动所有方块。每次滑动时，所有的方块都会向滑动的方向移动一格，相同数字的方块会合并成一个数字更大的方块。每次移动之后，系统会在空白的方格中随机生成一个2或者4的方块。当滑动之后的方块中有一个方块的数字达到2048时，游戏胜利。游戏的挑战在于玩家需要合理地移动方块，使得方块能够合并更大的数字，并且尽量不让方格填满。如果方格填满了并且无法再移动方块，游戏结束。2048是一款简单易懂但又很考验玩家策略和规划能力的游戏，非常适合消磨时间和锻炼大脑。无论是在手机上还是电脑上，你都可以轻松地享受到这款有趣的益智游戏。

1.2 项目预览

  • 可以看下部署好的项目预览

在这里插入图片描述

二、本次实践介绍

2.1 本地环境规划

本次实践为个人测试环境，操作系统版本为centos7.6。

hostname IP地址 操作系统版本 内核版本
jeven 192.168.3.166 centos 7.6 3.10.0-957.el7.x86_64

2.2 本次实践介绍

1.本次实践环境为个人测试环境，生产环境请谨慎；
2.在centos7.6环境下部署2048网页小游戏。

三、安装httpd软件

3.1 检查yum仓库

如果没有镜像源，可以使用阿里云的镜像源。

curl -o /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-7.repo
sed -i -e '/mirrors.cloud.aliyuncs.com/d' -e '/mirrors.aliyuncs.com/d' /etc/yum.repos.d/CentOS-Base.repo

检查yum仓库状态，确保各镜像源正常。

[root@jeven ~]# yum repolist enabled
Loaded plugins: fastestmirror, langpacks
Determining fastest mirrors
 * epel: mirrors.bestthaihost.com
repo id                                                                       repo name                                                                                  status
!base/7/x86_64                                                                CentOS-7 - Base - mirrors.aliyun.com                                                       10,072
!epel/x86_64                                                                  Extra Packages for Enterprise Linux 7 - x86_64                                             13,767
!extras/7/x86_64                                                              CentOS-7 - Extras - mirrors.aliyun.com                                                        518
!mongodb-org                                                                  MongoDB Repository                                                                            342
!mysql-connectors-community/x86_64                                            MySQL Connectors Community                                                                    227
!mysql-tools-community/x86_64                                                 MySQL Tools Community                                                                         100
!mysql57-community/x86_64                                                     MySQL 5.7 Community Server                                                                    678
!updates/7/x86_64                                                             CentOS-7 - Updates - mirrors.aliyun.com                                                     5,176
repolist: 30,880

3.2 安装httpd软件

直接使用yum安装httpd软件。

yum -y install  httpd

在这里插入图片描述

3.3 启动httpd服务

启动httpd服务，并使开机自启。

systemctl start httpd && systemctl enable  httpd

3.4 查看httpd服务

查看httpd服务状态，确保httpd服务正常。

[root@jeven ~]# systemctl status httpd
● httpd.service - The Apache HTTP Server
   Loaded: loaded (/usr/lib/systemd/system/httpd.service; enabled; vendor preset: disabled)
   Active: active (running) since Fri 2024-04-12 04:41:29 CST; 1h 31min ago
     Docs: man:httpd(8)
           man:apachectl(8)
 Main PID: 37892 (httpd)
   Status: "Total requests: 49; Current requests/sec: 0; Current traffic:   0 B/sec"
    Tasks: 11
   Memory: 4.8M
   CGroup: /system.slice/httpd.service
           ├─37892 /usr/sbin/httpd -DFOREGROUND
           ├─37895 /usr/sbin/httpd -DFOREGROUND
           ├─37897 /usr/sbin/httpd -DFOREGROUND
           ├─37898 /usr/sbin/httpd -DFOREGROUND
           ├─37899 /usr/sbin/httpd -DFOREGROUND
           ├─37926 /usr/sbin/httpd -DFOREGROUND
           ├─37929 /usr/sbin/httpd -DFOREGROUND
           ├─37931 /usr/sbin/httpd -DFOREGROUND
           ├─37932 /usr/sbin/httpd -DFOREGROUND
           ├─38118 /usr/sbin/httpd -DFOREGROUND
           └─41149 /usr/sbin/httpd -DFOREGROUND

Apr 12 04:41:29 jeven systemd[1]: Starting The Apache HTTP Server...
Apr 12 04:41:29 jeven systemd[1]: Started The Apache HTTP Server.

3.5 防火墙和selinux设置

  • 设置selinux
sed -i 's/SELINUX=enforcing/SELINUX=disabled/' /etc/selinux/config
setenforce 0
  • 关闭防火墙，如果想要开启防火墙，需放行80端口。
systemctl stop firewalld && systemctl disable firewalld

3.6 浏览器测试web服务

浏览器打开：http://192.168.3.166，将IP替换为自己服务器IP地址。

在这里插入图片描述

四、部署2048网页小游戏

4.1 下载小游戏源码

进入网页根目录

[root@jeven ~]# cd /var/www/html/
[root@jeven html]#

在github拉取2048网页小游戏源码

 git clone https://github.com/gabrielecirulli/2048.git

在这里插入图片描述

4.2 查看项目源码目录

查看项目源码目录

[root@jeven html]# tree -L 2 ./2048/
./2048/
├── CONTRIBUTING.md
├── favicon.ico
├── index.html
├── js
│   ├── animframe_polyfill.js
│   ├── application.js
│   ├── bind_polyfill.js
│   ├── classlist_polyfill.js
│   ├── game_manager.js
│   ├── grid.js
│   ├── html_actuator.js
│   ├── keyboard_input_manager.js
│   ├── local_storage_manager.js
│   └── tile.js
├── LICENSE.txt
├── meta
│   ├── apple-touch-icon.png
│   ├── apple-touch-startup-image-640x1096.png
│   └── apple-touch-startup-image-640x920.png
├── Rakefile
├── README.md
└── style
    ├── fonts
    ├── helpers.scss
    ├── main.css
    └── main.scss

4 directories, 22 files

给以下目录授权

chown -R apache:apache /var/www/html/2048

4.3 重启httpd服务

重启httpd服务

systemctl restart httpd

4.4 访问网页小游戏

访问地址：http://服务器IP地址/2048，进入到2048网页小游戏主页。

在这里插入图片描述

五、试玩2048网页小游戏

点击页面中的“New Game”，开始新游戏。

在这里插入图片描述

2048是一款数字类益智游戏，玩家需要在一个4x4的方格中移动数字方块，通过合并相同数字的方块来得到更高的数字，最终目标是得到一个2048的方块。

游戏规则如下：

  • 游戏开始时，方格中会随机生成两个数字方块，数字为2或4。

  • 玩家可以通过上下左右四个方向的滑动来移动数字方块，所有方块会沿着滑动方向移动，直到遇到墙壁或其他方块。

  • 当两个相同数字的方块在移动过程中相邻接触时，它们会合并成一个新的方块，数字为原来两个方块的数字之和。

  • 每次滑动后，系统会在空白的方格中随机生成一个新的数字方块，数字为2或4。

  • 游戏结束条件有两个：一是方格填满无法再移动任何方块时，二是成功得到一个2048的方块。

  • 在游戏过程中，玩家可以选择重新开始游戏或者悔棋。

文章标签：
云数据库 RDS MySQL 版
Linux
网络安全
测试技术
关键词：
Linux系统
Linux部署
Linux网页
Linux系统小游戏
Linux小游戏
相关实践学习
如何快速连接云数据库RDS MySQL
本场景介绍如何通过阿里云数据管理服务DMS快速连接云数据库RDS MySQL，然后进行数据表的CRUD操作。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心，利用清洁计算为万物互联的新世界提供源源不断的能源动力，目前开服的区域包括中国（华北、华东、华南、香港）、新加坡、美国（美东、美西）、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程，来了解阿里云能够为你的业务带来哪些帮助     相关的阿里云产品：云服务器ECS 云服务器 ECS（Elastic Compute Service）是一种弹性可伸缩的计算服务，助您降低 IT 成本，提升运维效率，使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
江湖有缘
目录
相关文章
江湖有缘
|
1月前
|
Linux
Linux系统之whereis命令的基本使用
Linux系统之whereis命令的基本使用
江湖有缘
77 24
Linux系统之whereis命令的基本使用
久绊A
|
3天前
|
存储 缓存 Linux
Linux系统中如何查看CPU信息
本文介绍了查看CPU核心信息的方法，包括使用`lscpu`命令和读取`/proc/cpuinfo`文件。`lscpu`能快速提供逻辑CPU数量、物理核心数、插槽数等基本信息；而`/proc/cpuinfo`则包含更详细的配置数据，如核心ID和处理器编号。此外，还介绍了如何通过`lscpu`和`dmidecode`命令获取CPU型号、制造商及序列号，并解释了CPU频率与缓存大小的相关信息。最后，详细解析了`lscpu`命令输出的各项参数含义，帮助用户更好地理解CPU的具体配置。
久绊A
30 8
神秘泣男子
|
3天前
|
存储 运维 监控
深度体验阿里云系统控制台：SysOM 让 Linux 服务器监控变得如此简单
作为一名经历过无数个凌晨三点被服务器报警电话惊醒的运维工程师，我对监控工具有着近乎苛刻的要求。记得去年那次大型活动，我们的主站流量暴增，服务器内存莫名其妙地飙升到90%以上，却找不到原因。如果当时有一款像阿里云 SysOM 这样直观的监控工具，也许我就不用熬通宵排查问题了。今天，我想分享一下我使用 SysOM 的亲身体验，特别是它那令人印象深刻的内存诊断功能。
神秘泣男子
21 1
流水刀客6
|
8天前
|
Linux 虚拟化 Docker
Linux服务器部署docker windows
在当今软件开发中，Docker成为流行的虚拟化技术，支持在Linux服务器上运行Windows容器。流程包括：1) 安装Docker；2) 配置支持Windows容器；3) 获取Windows镜像；4) 运行Windows容器；5) 验证容器状态。通过这些步骤，你可以在Linux环境中顺利部署和管理Windows应用，提高开发和运维效率。
流水刀客6
54 1
bruce_xiaowei
|
2月前
|
缓存 安全 Linux
Linux系统查看操作系统版本信息、CPU信息、模块信息
在Linux系统中，常用命令可帮助用户查看操作系统版本、CPU信息和模块信息
bruce_xiaowei
166 23
蓝染-惣右介
|
3月前
|
消息中间件 Java Kafka
【手把手教你Linux环境下快速搭建Kafka集群】内含脚本分发教程，实现一键部署多个Kafka节点
本文介绍了Kafka集群的搭建过程，涵盖从虚拟机安装到集群测试的详细步骤。首先规划了集群架构，包括三台Kafka Broker节点，并说明了分布式环境下的服务进程配置。接着，通过VMware导入模板机并克隆出三台虚拟机（kafka-broker1、kafka-broker2、kafka-broker3），分别设置IP地址和主机名。随后，依次安装JDK、ZooKeeper和Kafka，并配置相应的环境变量与启动脚本，确保各组件能正常运行。最后，通过编写启停脚本简化集群的操作流程，并对集群进行测试，验证其功能完整性。整个过程强调了自动化脚本的应用，提高了部署效率。
蓝染-惣右介
605 1
【手把手教你Linux环境下快速搭建Kafka集群】内含脚本分发教程，实现一键部署多个Kafka节点
蓝易云
|
3月前
|
Ubuntu 网络协议 Linux
快速部署WSL（Windows Subsystem for Linux）
WSL提供了一种轻量级的方法，使开发者能够在Windows上无缝运行Linux环境。通过本文介绍的步骤，可以快速安装、配置和使用WSL，以满足开发和测试的需求。
蓝易云
307 8
蓝易云
|
3月前
|
存储 监控 Linux
嵌入式Linux系统编程 — 5.3 times、clock函数获取进程时间
在嵌入式Linux系统编程中，`times`和 `clock`函数是获取进程时间的两个重要工具。`times`函数提供了更详细的进程和子进程时间信息，而 `clock`函数则提供了更简单的处理器时间获取方法。根据具体需求选择合适的函数，可以更有效地进行性能分析和资源管理。通过本文的介绍，希望能帮助您更好地理解和使用这两个函数，提高嵌入式系统编程的效率和效果。
蓝易云
138 13
久绊A
|
2天前
|
Linux
Linux 常用文件查看命令
`cat` 命令用于连接文件并打印到标准输出，适用于快速查看和合并文本文件内容。常用示例包括：`cat file1.txt` 查看单个文件，`cat file1.txt file2.txt` 合并多个文件，`cat > filename` 创建新文件，`cat >> filename` 追加内容。`more` 和 `less` 命令用于分页查看文件，`tail` 命令则用于查看文件末尾内容，支持实时追踪日志更新，如 `tail -f file.log`。
久绊A
20 5
Linux 常用文件查看命令
蓝易云
|
8天前
|
Linux
Linux od命令
本文详细介绍了Linux中的 `od`命令，包括其基本语法、常用选项和示例。通过这些内容，你可以灵活地使用 `od`命令查看文件内容，提高分析和调试效率。确保理解每一个选项和示例的实现细节，应用到实际工作中时能有效地处理各种文件查看需求。
蓝易云
43 19

热门文章

最新文章

  • 1
    Linux 操作系统
  • 2
    OS Copilot-操作系统智能助手-Linux新手小白的福音
  • 3
    linux下交叉编译licensecc
  • 4
    linux中的目录操作函数
  • 5
    Linux中yum、rpm、apt-get、wget的区别，yum、rpm、apt-get常用命令，CentOS、Ubuntu中安装wget
  • 6
    【linux】Shell脚本中basename和dirname的详细用法教程
  • 7
    linux怎么把文件传到docker里面
  • 8
    Linux下搭建本地deepseek(附文档下载)
  • 9
    【Linux】进程IO|系统调用|open|write|文件描述符fd|封装|理解一切皆文件
  • 10
    Linux 主要应用领域的归纳
  • 1
    CrossOver 25.0 for macOS & Linux - 领先的 Wine 解决方案
    15
  • 2
    Linux目录删除指南：彻底解决“Is a directory”错误
    13
  • 3
    Linux 面板推荐：Websoft9
    17
  • 4
    Linux常见根目录详释
    25
  • 5
    Linux 文件权限详解
    25
  • 6
    Linux 软链接与硬链接的创建及区别
    26
  • 7
    Linux 常用文件查看命令
    20
  • 8
    深度体验阿里云系统控制台：SysOM 让 Linux 服务器监控变得如此简单
    21
  • 9
    Linux系统中如何查看CPU信息
    30
  • 10
    零基础保姆级教程！手把手教你免费玩转Linux CentOS安装+学习环境搭建（附避坑指南）
    51

    • 相关课程

    更多
  • Linux MySQL服务器搭建与应用
  • Linux用户和组管理
  • Linux基本命令
  • Linux企业运维实战 - 入门及常用命令
  • Linux Shell 编程入门与实战
  • Linux网络进阶 - TCP/IP协议及OSI七层模型

    • 相关电子书

    更多
  • Alibaba Cloud Linux 3 发布
  • ECS系统指南之Linux系统诊断
  • ECS运维指南 之 Linux系统诊断

    • 相关实验场景

    更多
  • Linux指令入门-文件与权限
  • Linux系统的文本处理
  • Linux指令入门-系统管理
  • 使用计算巢企业应用，一键获取专属的Linux服务器管理软件
  • Alibaba Cloud Linux操作系统的安装及使用
  • Alibaba Cloud Linux操作系统Shell程序

    • 推荐镜像

    更多
  • mxlinux-iso
  • archlinuxarm
  • archlinuxcn
    • 下一篇
    获取百炼API-KEY