cocosCreator + 阿里云服务器 + Apache(windows) 从h5打包到服务器部署全流程

提示:文章仅供学习参考,如有错误欢迎留言指出~

文章目录


前言

提示:心得体会。

最近想学一些新东西,但是又怕学过就忘,恰好想起博客很久都没更新了,于是就想把新学的一些知识分享出来,即能能作为巩固的地方,也可以和大家分析讨论,岂不美哉。


提示:以下是本篇文章正文内容,下面案例可供参考

一、搭建一个基础Demo如下:

场景简单略过。

二、构建项目(web Mobile平台)

1.构建(取消勾选MD5 --> 构建)

这里有个MD5 Cache选项(不建议勾选,他会改变文件名),这个选项作用如下:

缓存控制: 为了提高网站或游戏的性能,浏览器会缓存静态资源,包括 JavaScript 文件。为了防止浏览器永远使用旧版本的文件,开发者会在文件名中添加哈希或版本号。这样,当文件发生更改时,浏览器会认为它是一个新文件,而不会使用缓存的旧文件。

CDN 或静态文件服务器: 如果您将游戏或应用部署到一个 CDN(内容分发网络)或专门的静态文件服务器上,这些服务器通常会实施缓存策略,以便加速文件的分发。哈希文件名有助于确保新版本的文件能够顺利传送到 CDN 或服务器,并在浏览器中得到正确加载。

版本控制工具: 开发者通常使用版本控制工具(如 Git)来管理项目的代码。在构建过程中,构建工具可能会根据代码的版本或提交记录生成哈希,然后将其添加到文件名中。

2.打开构建好的项目 --> 上传服务器

点击打开即可跳转到构建目录

将web-mobile上传到服务器。

这里我采用的是阿里云服务器的远程桌面连接来传输的,比较方便,当然其他方式也可以。远程连接步骤如下:

这里需要下载阿里云用于连接的工具,可以放心下载。这里可能提示你需要进行一些其他步骤,根据提示完成即可。

这里还需要配置一下安全组,这里加上你需要访问的端口,否则其他步骤配置好了也无法访问。如下:


3.下载Apache服务安装并配置

进入官网下载:http://httpd.apache.org/

选择windows版本
再进入ApacheHaus页面

选择对应版本即可

下载完成后解压在所需目录即可,尽量层级不要太深,否则后面配置的路径比较长,容易出错。

进入conf文件夹,用编辑器打开httpd.conf文件,查找 Define SRVROOT ,将路径改为自己的路径即可。

自定义端口,注意不要端口冲突,不然执行会报错

安装Apache服务:到\Apache24\bin目录下打开控制台输入 httpd -k install -n Apache

该命令的意思是,安装Windows可托管的Apache服务,其中"-n"后面参数是自定义Windows服务名称,之后可使用Windows管理服务的命令来管理apache服务,如"net start/stop apache"(启动/停止服务)。

查看控制面板打印,如果有报错需要去查找错误解决后再次安装。

我安装的时候遇到这个问题 "由于找不到vcruntime140.dll,无法继续执行代码,重新安装程序可能会解决此问题" 原因是运行环境不匹配,解决办法如下:

在微软官网下载 最新的Microsoft Visual C++ 网址:https://learn.microsoft.com/zh-CN/cpp/windows/latest-supported-vc-redist?view=msvc-170

根据系统版本选择即可

下载完后安装再重启远程这个错误就解决了。

接下来配置站点,打开Apache24\conf文件夹,找到httpd.conf文件并编辑,

文中搜索Include conf/extra/httpd-vhosts.conf 去掉前面的 '#',这样就可以开启虚拟主机功能。

再找到 在后面加上如下,增加以下内容,赋予该web目录的访问权限,保存后退出

最后再打开Apache24\conf\extra下面的httpd-vhosts.conf文件打开并编辑

加上如下代码:

<VirtualHost *:81>
    DocumentRoot "C:/WebSite/resourceEncryption/web-mobile"
    <Directory "C:/WebSite/resourceEncryption/web-mobile">
        Options Indexes FollowSymLinks
        AllowOverride None
        Require all granted
    </Directory>
</VirtualHost>

这里的81就是上面自定义开启的端口,另外还有82,83也开启了,但没有分配,其中 C:/WebSite/resourceEncryption/web-mobile 指向了最开始构建上传的h5包。这里配置好了只差最后一步就可以域名/公网ip + 端口进行游戏访问了。

最后一步找到Apache24/bin目录,找到httpd.exe 右键以管理员身份启动。

启动成功后,远程会出下面图标

这样就可以访问你上传的h5游戏了!

效果图如下:

总结

如有不够详细或者疑虑、错误的地方,欢迎留言指正!!!

最后制作耗时,给个关注和小赞👍吧!

相关推荐
茶馆大橘8 分钟前
(黑马点评)八、实现签到统计和uv统计
数据库·redis·学习·阿里云·黑马点评
小O_好好学1 小时前
Linux帮助命令
linux·运维·服务器
莫泽Morze2 小时前
VMware安装rustdesk服务器
运维·服务器
卡戎-caryon2 小时前
【操作系统】01.冯·诺伊曼体系结构
服务器·笔记·操作系统·冯·诺伊曼体系结构
周湘zx2 小时前
k8s中的微服务
linux·运维·服务器·微服务·云原生·kubernetes
‍理我3 小时前
Linux系统编程(基础指令)上
linux·服务器
Linux猿4 小时前
828华为云征文 | 云服务器Flexus X实例:one-api 部署,支持众多大模型
服务器·大模型·llm·华为云·flexus云服务器x实例·华为云服务器·one-api
凯子坚持 c5 小时前
0基础带你入门Linux之使用
linux·运维·服务器
hgdlip5 小时前
电脑ip会因为换了网络改变吗
服务器·网络·tcp/ip·电脑
EterNity_TiMe_5 小时前
【Linux基础IO】深入Linux文件描述符与重定向:解锁高效IO操作的秘密
linux·运维·服务器·学习·性能优化·学习方法