如何在GitHub Page上传H5试玩链接

本文链接：https://blog.csdn.net/qq_28644183/article/details/126716975

本文详细介绍了如何使用CocosCreator构建H5游戏，并将其上传至GitHubPage进行展示。首先在CocosCreator中打包H5版本，然后在GitHub创建公开项目，将打包后的文件上传。重点在于配置GitHubPage以显示游戏，最后通过GitHub提供的网址访问游戏。虽然可能因访问速度导致卡顿，但可以尝试使用国内的Gitee或付费的阿里云、腾讯云等解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题

之前试玩过别人的小游戏，不过不是通过微信或字节等其他平台，而是通过H5链接来访问的。当时就想着时如何实现的，现在研究了下，在此篇文章记录下。这里主要讨论如何将CocosCreator的H5版本上传到GitHub Page上试玩。

实现

步骤1：

首先需要在CocosCreator构建H5版本，打包后会在构建目录中存在web-mobile，如下图所示。
在这里插入图片描述

这里最好将打包好后的文件夹(web-mobile)改为项目名，因为可能存在多个项目上传GitHubPage.

步骤2：

在GitHub上创建项目，并将项目设为public。这一步可以参考官方文档。但是官方文档可能跟读者现在的GitHub有所差入。
目前作者的Github Page设置页面如下图所示：
在这里插入图片描述

注意：如果没有出现上图中文字描述出现的内容，那么请耐心等待，时不时的刷新下。等出现了红框中的内容时，此时才说明个人静态网站可以访问了。可以试着点击个人静态地址。

步骤3：

接下来也就是最重要的一步了。将第一步中构建好的web-mobile文件夹上传到Git。读者的本地文件结构应该如下所示：
在这里插入图片描述
GitHub上的结构应该如下所示：

最后我们就可以访问我们打包好后的index.html 了。如果读者按照上面的步骤操作的话，那么访问地址应该就是如下所示：
https://username.github.io/myTestProject/index.html
(username.github.io 应该替换成步骤二中红框中的地址)