现在从浏览器启动服务器上的游戏的时候,是cocos creator 的LOGO和进度条、黑色背景。网页标题也是cocos creator-xxx.
在项目的跟目录下创建一个build-templates文件 里面放对应的需要替换的内容 比如是移动平台 就建一个web-mobile文件夹里面放HTML文件和css文件
如果只是要修改一下 title 启动动画或者css, 直接在build-templates里面做就可以了, 如果要的功能比较多就乖乖自己写脚本吧
贴一段现在在用的脚本, 这个脚本是在打包之后执行的,就是根据运行环境(测试版, 正式版)把cocos导出来的html额外加一些内容进去, 比如修改title,增加base标签, 压缩html, 插入一段js用来根据url直接加载指定场景
// 用来修改web-mobile 版本的
import { ENV_VERSION_TYPE, VersionType } from '../../game/assets/scripts/env'
import { VERSION } from '../../game/assets/scripts/cfg'
import { CDN } from '../../web-app/src/config'
import * as fs from 'fs'
import * as path from 'path'
import * as fsExtra from 'fs-extra'
import * as uglify from 'uglify-js'
import * as htmlminfier from 'html-minifier'
import { getIp } from '../utils/ip';
export const ip = getIp()
const script = fs.readFileSync(path.join(__dirname, "script.js"), { encoding: "utf8" })
const scriptMin = uglify.minify(script)
if (scriptMin.error) {
console.error(scriptMin.error)
process.exit(1)
}
const launchScene = `<script>${scriptMin.code}</script>\n`
const write = (title: string, head: string, out: string) => {
fsExtra.mkdirpSync(path.join(__dirname, '../../public/build/h5/'))
let html = fs.readFileSync(path.join(__dirname, '../../game/build/web-mobile/index.html'), { encoding: 'utf8' })
.replace(/<title>.*<\/title>/, `<title>${title}</title>\n${head}`)
.replace("<script", '<script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>\n<script')
.replace(`<script src="main`, `${launchScene}<script src="main`)
html = htmlminfier.minify(html, { removeComments: true, collapseWhitespace: true })
fs.writeFileSync(path.join(__dirname, '../../public/build/h5/', out), html, { encoding: 'utf8' })
}
switch (ENV_VERSION_TYPE) {
case VersionType.SNAPSHOT: {
write(
`xxxx-${VERSION}.snapshot`,
`<base href="http://${ip}:11811/build/web-mobile-snapshot/">`,
"web-mobile-snapshot.html")
break
}
case VersionType.BETA: {
write(
`xxxx-${VERSION}.beta`,
`<base href="${CDN}/build/web-mobile-beta/">`,
"web-mobile-beta.html")
break
}
case VersionType.RELEASE: {
write(
`xxxx-网页版`,
`<base href="${CDN}/build/web-mobile-release/">
<script src="//xxxxx.oss-cn-hangzhou.aliyuncs.com/assets/bower_components/babel-polyfill/browser-polyfill.js"></script>`,
"web-mobile-release.html")
break
}
}
/** 脚本运行于, 被web-mobile.ts引用 */
+function (_CCSettings, localStorage, search) {
var roomType
var params = {}
for (var i = 0; i < search.length; i++) {
var values = search[i].split('=')
params[values[0]] = values[1]
}
roomType = params.roomType || "0"
switch (roomType) {
case '1':
case '2':
_CCSettings.launchScene = "db://assets/game1.fire"
break
case '3':
_CCSettings.launchScene = "db://assets/game2.fire"
break
case '4':
_CCSettings.launchScene = "db://assets/game3.fire"
break
default:
_CCSettings.launchScene = "db://assets/hall.fire"
}
}(window._CCSettings, localStorage, (location.href.split("?")[1] || "").split("&"))