Cocos Creator3D:发布到 Web 平台

2023-11-03

推荐:将 NSDT场景编辑器 加入你的3D工具链

 

3D工具集: NSDT简石数字孪生

发布到 Web 平台

打开主菜单的 项目 -> 构建发布,打开构建发布面板。

Cocos Creator 3D 提供了两种 Web 平台的页面模板,可以通过 发布平台 的下拉菜单选择 Web Mobile 或 Web Desktop,他们的区别主要在于 Web Mobile 会默认将游戏视图撑满整个浏览器窗口,而 Web Desktop 允许在发布时指定一个游戏视图的分辨率,而且之后游戏视图也不会随着浏览器窗口大小变化而变化。

构建选项介绍

一些通用的构建通用参数介绍,请参考 通用构建参数介绍。

Web Desktop

参数名 可选 默认值 说明
polyfills 选填 { asyncFunctions: true } 自 v1.0.3 版本起,构建支持一些新特性的 polyfills,主要是在打包脚本时会做对应处理,开发者可以根据实际需求选择需要的 polyfills,这组选项暂时只有 异步函数,后续将会开放更多功能。
designWidth 必填 1280 游戏视图分辨率宽度
designHeight 必填 960 游戏视图分辨率高度

Web Mobile

参数名 可选 默认值 说明
polyfills 选填 { asyncFunctions: true } 自 v1.0.3 版本起,构建支持一些新特性的 polyfills,主要是在打包脚本时会做对应处理,开发者可以根据实际需求选择需要的 polyfills,这组选项暂时只有 异步函数,后续将会开放更多功能。
embedWebDebugger 选填 false 是否使用 vConsole,vConsole 类似 DevTools 的迷你版,用于辅助调试。
orientation 必填 'auto' 设备方向,可选值为 'auto'、'landscape'、'portrait'

预览 URL

自 v1.0.3 版本起,构建支持同时预览多个 web 项目,因而构建的预览 URL 不再是统一的而是每个构建任务都会有一个单独的预览 URL 互不干扰。点击 URL 即可自动打开浏览器进行预览。具体的预览 URL 拼接规则为 ${偏好设置中的预览 IP 地址}:${编辑器预览端口号}/${构建平台}/${构建任务名}/index.html

构建和预览

配置好构建参数后,点击 构建 按钮,开始 Web 平台版本构建。面板上会出现一个进度条,当进度条达到 100% 时,构建就完成了。

接下来可以点击 运行 按钮,在浏览器中打开构建后的游戏版本进行预览和调试。

上图所示就是 Web Mobile 平台的预览,可以看到游戏视图会占满整个窗口,而 Web Desktop 则不会撑满屏幕,如下图。

浏览器兼容性

Cocos Creator 3D 开发过程中测试的桌面浏览器包括: Chrome、Firefox(火狐)、Safari(Mac)、QQ 浏览器、360 浏览器。其他浏览器只要内核版本够高也可以正常使用,对部分浏览器来说请勿开启 IE6 兼容模式。

移动设备上测试的浏览器包括:Safari(iOS)、Chrome、QQ 浏览器、UC 浏览器和微信内置 WebView。

Retina 设置

可以在脚本中通过 view.enableRetina(true) 设置是否使用高分辨率,构建到 Web 平台时默认会开启 Retina 显示。

发布到 Web 服务器

要在互联网上发布或分享您的游戏,只要点击 发布路径 旁边的 打开 按钮,打开发布路径之后,按照当前构建任务名称,将构建出的对应文件夹里的内容整个复制到您的 Web 服务器上就可以通过相应的地址访问了。

关于 Web 服务器的架设,可以自行搜索 Apache、Nginx、IIS、Express 等相关解决方案。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Cocos Creator3D:发布到 Web 平台 的相关文章

随机推荐

  • minio基础知识介绍

    minio基础知识介绍 文章目录 minio基础知识介绍 1 概述 1 1 特性 1 2 部署运行模式 2 存储机制 2 1 纠错码 2 2 RS code编码数据恢复原理 2 3 校验和 3 minio多租户和多用户 3 1 多租户 3
  • tomcat 9 编码问题导致乱码问题(web程序乱码)

    tomcat编码设置问题 由于刚更换tomcat 9 没有修改配置文件 致使项目运行之后 web端出现个别乱码的情况 接下来将配置文件中的设置一一调整 catalina bat文件 catalina bat配置文件中需要添加内容 catal
  • 企业在APP开发时一定要注意的几方面

    随着移动互联网的不断发展 市面上的需求也随着发生了一些改变 而最初的微信小程序已满足不了解一些企业发展的需求 因此 一部分企业开始着手于APP开发 在进行APP开发时 一定要考虑以下几个方面 请点击输入图片描述 最多18字 1 确立应用程序
  • 单片机毕业设计 STM32天气预报系统设计与实现 - 嵌入式 物联网

    文章目录 0 前言 1 简介 2 主要器件 3 实现效果 4 设计原理 5 部分核心代码 6 最后 0 前言 这两年开始毕业设计和毕业答辩的要求和难度不断提升 传统的毕设题目缺少创新和亮点 往往达不到毕业答辩的要求 这两年不断有学弟学妹告诉
  • 模拟实现atoi函数(将数字字符串转换为整型)附加leetcode练习题

    各位朋友们 大家好啊 今天我为大家分享的知识是如何模拟实现atoi函数 相信大家如果能够理解这个知识 对大家以后的刷题是有帮助的 文章目录 什么是atoi函数 atoi函数的作用 先直接使用库函数看看这个函数是什么作用 都是正整数字符的字符
  • [Python知识图谱] 三.Jieba工具中文分词、添加自定义词典及词性标注详解

    本系列文章主要结合Python语言实现知识图谱构建相关工程 具有一定创新性和实用性 非常希望各位博友交流讨论 相互促进成长 前面两篇文章详细讲解了哈工大Pyltp工具 包括中文分词 词性标注 实体识别 依存句法分析和语义角色标注等 但是其中
  • 多级指针和静动态内存的跨函数访问

    参考 多级指针 静动态内存的跨函数访问 作者 枕上 发布时间 2021 07 15 00 27 17 网址 https blog csdn net jinchi boke article details 118724993 spm 1001
  • RAC安装与维护遇到的几个问题

    author skatetime 2009 05 26 rac安装还是比较顺利的 弄了一天 下面是我在安装和使用中遇到的问题 参考文档 http www oracle com technology pub articles hunter r
  • prisma 开发遇到https://xxx failed, reason: read ECONNRESET

    在使用nodejs prisma 开发时使用如下命令遇到错误 npx prisma db pull 设置proxy和https proxy问题依旧 最后使用 f 参数解决问题 npx prisma db pull f
  • ngModel:numfmt

    angularJS 报 ngModel numfmt angularJS 前台报错 Error ngModel numfmt Model is not of type number 错误 ngModel numfmt模型的类型是 numbe
  • PMD规则

    Design Rules UseSingleton If you have a class that has nothing but static methods consider making it a Singleton Note th
  • Unity常见问题集(待续)

    1 error CS0101 The namespace global already cont 分析 关于global 错误 我们不能打开两个同一名称的scripts在你的工程里 解决 如果在你的工程里有另一个 Activate Trig
  • 傅里叶变换:周期、非周期 与连续、离散

    也是之前总结的 但是感觉很重要 分享出来 也方便自己不带本子的时候能快速找到 傅里叶变化过程中 在两个域 周期和非周期 连续和离散问题
  • chatGPT本地部署

    chatGPT是一种使用自然语言生成 NLG 技术的聊天机器人 可以使用生成对话模型 GPT 训练出来的模型来回答用户的提问或对话 要在本地部署chatGPT 您需要 安装Python环境 并使用pip安装chatGPT所需的依赖包 下载并
  • spring boot 自动构造模拟数据

    spring boot 自动构造模拟数据 引言 Spring boot代码 实体类对象 pom xml 控制器代码 Swagger测试效果 jar包下载地址 引言 现如今基于微服务架构技术开发的项目 一般会采用前后端分离的模式 该模式的好处
  • #3文献学习总结--边缘计算资源分配与任务调度优化

    文献 边缘计算资源分配与任务调度优化综述 1 系统模型 云 边 端 第 1 层是物联网层 传感器 处理器根据应用需求感知 测量和收集原始数据 在本地处理大量数据或将其上传至计算节点 第 2 层是边缘计算层 位于互联网边缘 靠近数据源 边缘计
  • TensorFlow Seq2Seq Model笔记

    0 tf跑起来一直没有用GPU 尴尬 跑起来发现GPU没用起来 CPU满了 发现装错了 应该装tensorflow gpu 代码测试是否用的是GPU https stackoverflow com questions 38009682 ho
  • 正确选择云服务器的带宽教程

    由于云服务器具有弹性的扩容机制 安全的云端集群分布式存储等 云服务器的优势逐渐凸现出来 我们越来越多的人开始选择云服务器 那么如何选择云服务器配置呢 怎样的云服务器配置才能不浪费呢 计算机数据的最小单位是bit 称之为位 其他还有B KB
  • 1114 计算营业额

    题目描述 编程统计营业员一天的营业额 输入要求 输入若干个数据代表交易金额 由于营业员一天完成的交易次数是不确定的 因此最后附加输入一笔0作为交易金额已全部输入结束的标志 输出要求 输出一天的营业额 保留2位小数 输入样例 100 5 12
  • Cocos Creator3D:发布到 Web 平台

    推荐 将 NSDT场景编辑器 加入你的3D工具链 3D工具集 NSDT简石数字孪生 发布到 Web 平台 打开主菜单的 项目 gt 构建发布 打开构建发布面板 Cocos Creator 3D 提供了两种 Web 平台的页面模板 可以通过