1. 项目概述与核心价值最近在给一个休闲小游戏做抖音小游戏平台的适配其中一个绕不开的功能就是“侧边栏礼包系统”。这几乎是抖音小游戏生态里的一个标配玩法用户通过点击游戏界面边缘弹出的侧边栏入口可以领取每日登录奖励、看广告获取双倍奖励、或者完成一些简单的任务来获取游戏内资源。听起来简单但真要在Cocos Creator 3.8里把它做得稳定、流畅并且能顺利通过平台审核里面有不少门道。我踩过几个坑比如侧边栏按钮点了没反应、礼包数据没同步、还有最头疼的审核被拒问题。所以今天我就把自己从零搭建这个系统的完整过程以及那些官方文档里不会写的调试技巧和避坑指南一次性分享出来。这个系统本质上是一个“游戏内嵌网页”与“游戏逻辑”双向通信的混合体。抖音小游戏平台提供了标准的JavaScript API来打开侧边栏而我们的Cocos游戏通常是TypeScript/JavaScript逻辑需要监听侧边栏的事件并与之进行数据交换。核心价值在于它能有效提升用户留存和活跃度为游戏提供一个稳定的福利发放和轻度运营入口。无论你是刚接触抖音小游戏开发的新手还是已经做过但总在调试上费工夫的老手这套“5步法”和附带的调试技巧都能帮你快速理清思路高效完成集成。2. 系统架构与设计思路拆解2.1 抖音侧边栏的运行机制在动手写代码之前我们必须先理解抖音小游戏侧边栏通常指“更多游戏”或自定义功能面板是怎么工作的。它不是一个Cocos Creator的UI节点而是由抖音小游戏容器一个WebView或类似环境原生提供的一个Web页面容器。当我们在游戏里调用tt.showGameClub()或类似的API时抖音的底层容器会弹出一个覆盖在游戏画面上方的网页视图。这个网页视图加载的是一个你提前在抖音小游戏后台配置好的H5页面地址。你的礼包系统UI、按钮、图片等都是通过这个H5页面来呈现的。而你的Cocos游戏本体则运行在这个“底层”。两者之间通过抖音提供的tt对象进行通信。理解这一点至关重要这意味着视觉分离侧边栏的UI不能用Cocos的Widget、Sprite来画得用HTML/CSS/JS那一套。逻辑通信游戏逻辑Cocos和侧边栏逻辑H5是两套独立的JS上下文需要通过tt.postMessage和tt.onMessage进行异步消息传递。生命周期独立侧边栏页面的加载、显示、隐藏有其自己的生命周期需要和游戏状态同步。2.2 Cocos Creator侧的职责划分基于上述机制我们的Cocos Creator项目需要清晰地区分两部分工作桥接层Bridge这是核心。我们需要创建一个或多个TypeScript脚本专门负责与抖音tt对象交互。包括检测API可用性、打开/关闭侧边栏、向侧边栏发送消息如用户游戏数据、接收来自侧边栏的消息如用户点击了“领取”按钮。游戏逻辑层根据桥接层接收到的指令执行具体的游戏内操作。例如当收到“领取成功”消息后调用游戏内的背包系统增加道具并更新UI显示。设计上我推荐采用“事件驱动”的模式。桥接层在收到消息后不直接操作游戏对象而是派发一个自定义事件。游戏内的各个系统如资源管理器、UI管理器监听这些事件并做出响应。这样解耦清晰后期也容易维护。2.3 侧边栏H5页面的设计考量侧边栏的H5页面虽然技术栈独立但风格上最好与游戏内UI保持统一。你需要考虑响应式布局侧边栏的尺寸可能因设备而异你的H5页面需要能自适应。资源加载图片、字体等资源最好使用CDN链接确保加载速度。避免使用base64内嵌过大图片。通信协议设计和Cocos侧约定好消息格式。例如可以定义一个简单的JSON协议// Cocos - H5 { command: updateData, data: { coin: 1000, canReceive: true } } // H5 - Cocos { command: requestReward, rewardId: daily_login_1 }提前设计好command类型和data结构是后续调试顺利的基础。3. 五步实现核心流程3.1 第一步环境准备与API检测首先在Cocos Creator 3.8中创建一个新项目或打开你的现有项目。我们需要处理平台差异因为我们的代码在抖音环境和编辑器环境下都需要能运行至少不报错。创建一个名为GameClubBridge.ts的脚本作为我们的通信桥。// GameClubBridge.ts import { _decorator, Component, director } from cc; const { ccclass, property } _decorator; ccclass(GameClubBridge) export class GameClubBridge extends Component { // 单例模式方便全局访问 private static _instance: GameClubBridge null; public static get instance(): GameClubBridge { return this._instance; } // 用于判断是否在抖音小游戏环境中 private _isTTGame: boolean false; private _tt: any null; onLoad() { if (GameClubBridge._instance) { this.node.destroy(); return; } GameClubBridge._instance this; director.addPersistRootNode(this.node); // 常驻节点避免场景切换时丢失 this.checkEnvironment(); } private checkEnvironment() { // 方法1通过全局对象判断 if (typeof tt ! undefined) { this._tt tt; this._isTTGame true; console.log([GameClubBridge] 运行在抖音小游戏环境); } // 方法2Cocos Creator 自带的宏判断 (也需要配置) // else if (CC_DEBUG) { // console.log([GameClubBridge] 运行在编辑器或模拟环境); // } // 如果不在抖音环境我们可以模拟一个tt对象便于在编辑器中测试逻辑流 if (!this._isTTGame) { this.mockTTAPI(); console.warn([GameClubBridge] 非抖音环境已启用模拟API功能受限); } } private mockTTAPI() { // 创建一个模拟的tt对象实现最基本的方法防止调用报错 this._tt { showGameClub: (options: any) { console.log([Mock] 模拟打开侧边栏, options); // 这里可以触发一个模拟的H5页面打开事件用于本地测试 setTimeout(() { // 模拟H5页面发送回来一个消息 this.onMessage({ command: mockReward, rewardId: test_001 }); }, 1000); }, postMessage: (msg: any) { console.log([Mock] 模拟向侧边栏发送消息, msg); }, onMessage: (callback: Function) { // 将回调存起来供模拟的H5调用 this._mockMessageCallback callback; } }; this._isTTGame false; // 标记为模拟环境 } private _mockMessageCallback: Function null; private onMessage(msg: any) { if (this._mockMessageCallback) { this._mockMessageCallback(msg); } // 同时派发内部事件供游戏逻辑监听 director.emit(gameclub_message, msg); } }注意CC_DEBUG和CC_PREVIEW等宏需要在项目设置中定义。模拟环境下的实现非常关键它允许你在PC浏览器或模拟器中跑通整个逻辑流程而不必每次都真机调试。3.2 第二步实现打开与基础通信在桥接类中我们添加打开侧边栏和建立双向通信的方法。// 在 GameClubBridge.ts 中继续添加 export class GameClubBridge extends Component { // ... 之前的代码 ... /** * 打开抖音游戏侧边栏游戏圈 * param style 可配置侧边栏的样式如位置 */ public openGameClub(style?: any) { if (!this._tt || !this._tt.showGameClub) { console.error([GameClubBridge] tt.showGameClub API 不可用); return; } const defaultStyle { // 通常不需要特别设置使用默认即可 // position: left // 或 right }; const finalStyle { ...defaultStyle, ...style }; this._tt.showGameClub({ ...finalStyle, success: (res: any) { console.log([GameClubBridge] 侧边栏打开成功, res); // 打开成功后可以立即向侧边栏发送一次当前游戏数据 this.sendGameDataToClub(); }, fail: (err: any) { console.error([GameClubBridge] 侧边栏打开失败, err); } }); } /** * 向侧边栏H5页面发送游戏数据 */ private sendGameDataToClub() { // 1. 从游戏数据管理器获取当前用户数据 // 假设有一个 GameDataManager 的单例 const userData { coin: 1000, diamond: 50, todayHasLogged: false, // 今日是否已登录 tasks: [ // 任务列表 { id: task_1, name: 完成一局游戏, completed: true, reward: 100 }, { id: task_2, name: 分享游戏, completed: false, reward: 200 } ] }; // 2. 构建消息 const message { command: init, // 初始化数据 data: userData, timestamp: Date.now() }; // 3. 发送消息 this.postMessageToClub(message); } /** * 通用消息发送方法 * param msg 消息对象 */ public postMessageToClub(msg: any) { if (this._tt this._tt.postMessage) { // 注意msg 必须是可序列化的对象字符串、数字、布尔、数组、普通对象 this._tt.postMessage(msg); console.log([GameClubBridge] 消息已发送至侧边栏:, msg); } else { console.warn([GameClubBridge] postMessage 不可用当前环境可能不支持或未打开侧边栏); } } /** * 初始化消息监听 * 这个方法需要在合适的时机调用例如游戏启动后 */ public initMessageListener() { if (this._tt this._tt.onMessage) { this._tt.onMessage((message: any) { console.log([GameClubBridge] 收到侧边栏消息:, message); // 将消息通过导演系统的事件机制派发出去 director.emit(gameclub_message, message); // 也可以直接在这里处理特定命令 this.handleClubMessage(message); }); } else { console.log([GameClubBridge] 当前环境不支持 onMessage使用模拟监听); // 模拟环境下监听我们自己派发的事件 director.on(gameclub_message, this.handleClubMessage, this); } } private handleClubMessage(msg: any) { switch (msg.command) { case requestReward: this.onReceiveRewardRequest(msg.rewardId, msg.extraData); break; case close: console.log([GameClubBridge] 侧边栏请求关闭); // 可以在这里处理一些清理逻辑 break; default: console.log([GameClubBridge] 未知命令: ${msg.command}); } } private onReceiveRewardRequest(rewardId: string, extraData: any) { console.log([GameClubBridge] 处理领取奖励请求: ${rewardId}); // 这里应该调用游戏内的奖励发放逻辑 // 例如GameDataManager.instance.addReward(rewardId); // 发放成功后可以通知侧边栏更新状态 director.emit(reward_handled, { rewardId, success: true }); // 并同步新的游戏数据给侧边栏 setTimeout(() this.sendGameDataToClub(), 100); } start() { // 游戏启动后初始化监听 this.initMessageListener(); } }现在在你的游戏UI比如一个按钮上挂载一个脚本调用GameClubBridge.instance.openGameClub()就能打开侧边栏了。记得在游戏主场景加载时确保GameClubBridge节点被创建并初始化。3.3 第三步侧边栏H5页面开发这是独立于Cocos项目的一个网页项目。你可以用任何你熟悉的前端框架Vue、React或纯原生开发。这里给出一个极简的原生示例展示核心通信逻辑。!DOCTYPE html html langzh-CN head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0, maximum-scale1.0, user-scalableno title游戏福利站/title style body { margin: 0; padding: 20px; font-family: sans-serif; background: #f5f5f5; color: #333; } .reward-item { background: white; border-radius: 10px; padding: 15px; margin-bottom: 15px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); } .reward-title { font-weight: bold; margin-bottom: 5px; } .reward-desc { font-size: 0.9em; color: #666; margin-bottom: 10px; } .reward-btn { background: #ff5500; color: white; border: none; padding: 8px 20px; border-radius: 20px; cursor: pointer; } .reward-btn:disabled { background: #ccc; cursor: not-allowed; } /style /head body h2每日福利/h2 div idrewardList !-- 奖励列表由JS动态生成 -- /div script // 1. 监听来自Cocos游戏的消息 if (typeof tt ! undefined tt.onMessage) { tt.onMessage(function(message) { console.log([H5] 收到游戏消息:, message); handleGameMessage(message); }); } // 2. 处理游戏发来的数据 let gameData {}; function handleGameMessage(msg) { if (msg.command init) { gameData msg.data || {}; updateRewardListUI(); } // 可以处理其他命令如数据更新 update } // 3. 更新H5页面UI function updateRewardListUI() { const container document.getElementById(rewardList); container.innerHTML ; // 示例生成每日登录奖励 const dailyReward { id: daily_login, name: 每日登录, desc: gameData.todayHasLogged ? 今日已领取 : 登录即可领取100金币, canGet: !gameData.todayHasLogged }; createRewardItem(dailyReward, container); // 示例生成任务奖励 if (gameData.tasks) { gameData.tasks.forEach(task { const taskReward { id: task.id, name: task.name, desc: 奖励: ${task.reward}金币 (${task.completed ? 已完成 : 未完成}), canGet: task.completed }; createRewardItem(taskReward, container); }); } } function createRewardItem(reward, parent) { const div document.createElement(div); div.className reward-item; div.innerHTML div classreward-title${reward.name}/div div classreward-desc${reward.desc}/div button classreward-btn ${reward.canGet ? : disabled} onclickrequestReward(${reward.id}) ${reward.canGet ? 领取 : 已领取/未完成} /button ; parent.appendChild(div); } // 4. 向Cocos游戏发送消息领取奖励 function requestReward(rewardId) { const message { command: requestReward, rewardId: rewardId, timestamp: Date.now() }; if (typeof tt ! undefined tt.postMessage) { tt.postMessage(message); console.log([H5] 发送领取请求:, message); // 可选点击后立即禁用按钮防止重复点击 // 更好的做法是等待游戏确认后再更新UI } else { console.error(tt.postMessage 不可用); } } // 5. 页面加载完成后可以主动向游戏请求一次数据可选 window.addEventListener(load, function() { // 如果游戏已经发送过数据这里会触发handleGameMessage // 也可以主动发送一个‘ready’命令给游戏请求数据 setTimeout(() { if (typeof tt ! undefined tt.postMessage) { tt.postMessage({ command: ready }); } }, 500); }); /script /body /html将这个H5页面部署到你的服务器或CDN上并获取其可公开访问的URL。3.4 第四步抖音小游戏后台配置这是将H5页面和Cocos游戏关联起来的关键一步很多审核问题都出在这里。登录抖音小游戏开发者平台。进入你的游戏管理后台。找到“游戏设置”或“功能管理”相关菜单寻找“游戏圈”或“侧边栏”配置入口不同时期平台命名可能略有差异。在配置页面中启用功能勾选启用游戏圈/侧边栏。填写H5页面地址输入你上一步部署好的H5页面的完整URL必须是HTTPS。配置分享信息可选设置侧边栏分享时的标题和图片。仔细阅读平台规范对H5页面的内容、交互、隐私有明确要求例如不能自动播放音频、不能有外部链接等。保存并提交审核如果修改了配置。重要避坑点后台配置的H5页面地址必须和你在代码中调用tt.showGameClub()时预期打开的页面一致。平台可能会缓存配置修改后需要等待一段时间生效或者通过“测试”功能验证。确保你的H5页面在移动端浏览器直接打开也能正常显示和运行这是审核的基础。3.5 第五步游戏内集成与UI联动最后一步将桥接功能无缝集成到你的游戏UI流程中。创建侧边栏入口按钮在游戏主界面合适位置通常左上角或右上角放置一个按钮。为这个按钮添加点击事件调用GameClubBridge.instance.openGameClub()。游戏数据同步在游戏数据发生变更时如金币增加、任务完成主动调用GameClubBridge.instance.postMessageToClub()发送更新消息给侧边栏保持两侧状态一致。奖励发放逻辑在GameClubBridge的onReceiveRewardRequest方法中不要直接修改数据而是将其转发给游戏内稳定的数据管理器或服务器接口进行验证和发放。发放成功后通过事件或回调通知UI更新。处理侧边栏生命周期监听侧边栏的打开和关闭tt.onShow、tt.onHide可能不直接适用于侧边栏但游戏主逻辑可以监听页面焦点变化适时暂停游戏音效或逻辑。// 示例在某个UI管理器中监听奖励事件并更新界面 import { director } from cc; import { GameDataManager } from ./GameDataManager; // 假设的数据管理器 export class UIManager { constructor() { director.on(reward_handled, this.onRewardHandled, this); director.on(gameclub_message, this.onClubMessage, this); } private onRewardHandled(event: any) { if (event.success) { // 显示获得奖励的飘字或弹窗 this.showRewardToast(领取成功获得奖励ID: ${event.rewardId}); // 更新主UI上的金币/钻石显示 this.updateCurrencyDisplay(); } else { this.showRewardToast(领取失败请重试); } } private onClubMessage(msg: any) { // 可以根据需要处理其他消息比如侧边栏关闭了恢复游戏背景音乐 if (msg.command closed) { audioEngine.resumeMusic(); } } }4. 深度调试技巧与问题排查实录集成过程中调试是最耗时也最考验耐心的环节。以下是我总结的实战调试技巧。4.1 真机调试的两种核心方法方法一利用抖音开发者工具的真机调试功能这是最直接的方法。最新版本的抖音开发者工具通常集成了真机调试功能。用USB连接安卓手机打开USB调试。在开发者工具中选择“真机调试”。在手机上打开你的抖音小游戏开发版。开发者工具会捕获到游戏进程你可以看到Console日志、Network请求甚至可以对游戏页面和侧边栏H5页面进行单独的Elements审查和Sources调试。注意侧边栏H5页面作为一个独立的WebView可能需要你在开发者工具的“目标”下拉列表中单独选择才能调试其上下文。方法二远程Chrome DevTools调试适用于Android如果开发者工具调试不顺畅可以回归最原始的WebView调试。在手机抖音中打开你的小游戏。在PC Chrome浏览器地址栏输入chrome://inspect。确保手机和PC在同一网络并开启了USB调试。在“Remote Target”列表中你应该能看到一个类似com.ss.android.ugc.aweme抖音包名的WebView目标后面可能跟着你的游戏页面标题。点击“inspect”。这会打开一个DevTools窗口用于调试游戏主逻辑。要调试侧边栏H5可能需要反复打开关闭侧边栏并在DevTools的“目标”列表刷新找到新出现的WebView目标其标题可能是你的H5页面标题。4.2 常见问题与解决方案速查表问题现象可能原因排查步骤与解决方案点击按钮侧边栏无反应1.tt对象未定义。2.showGameClubAPI不可用。3. 后台未正确配置或未生效。1. 在点击事件里加console.log(typeof tt, tt)确认环境。2. 检查是否在正确的平台抖音运行。3. 登录开发者后台确认侧边栏功能已启用且H5链接有效。可尝试在后台提供的“测试”入口检查。侧边栏白屏或加载失败1. H5页面地址错误或无法访问非HTTPS。2. H5页面代码有JS错误。3. 网络问题。1. 直接在手机浏览器输入H5地址看是否能正常打开。2. 用真机调试方法打开侧边栏的DevTools查看Console报错和Network请求。3. 确保H5页面资源图片、CSS、JS路径正确且支持跨域如果引用外部资源。游戏与侧边栏无法通信1.postMessage/onMessage调用时机不对。2. 消息格式不是可序列化对象。3. 侧边栏未加载完成就发送消息。1.确保通信在侧边栏打开后进行。可在showGameClub的success回调里发送第一条消息。2. 使用JSON.stringify检查消息是否能被正确序列化避免传递函数、循环引用。3. 在H5页面通过window.addEventListener(load, ...)或tt.onMessage监听游戏消息确保页面就绪。侧边栏UI错乱或样式异常1. H5页面未做移动端适配。2. CSS样式冲突或单位问题。3. 侧边栏容器尺寸特殊。1. 使用viewportmeta 标签。2. 使用弹性布局Flexbox或百分比、vw/vh单位。3.实测技巧在H5页面CSS中将body或根元素的width设为100vwmax-width设为100%防止横向溢出。用真机调试查看元素实际计算样式。审核被拒理由涉及侧边栏1. H5页面内容违规如诱导分享、外链。2. 功能与描述不符。3. 性能问题加载过慢。1. 严格遵循平台《小程序运营规范》和《游戏圈审核标准》移除任何违规内容。2. 确保侧边栏功能描述真实H5页面功能稳定。3. 优化H5页面压缩资源、使用CDN、懒加载。确保首屏加载速度。提交审核前务必在多台不同档次的真机上测试流程。Cocos Creator编辑器报错Cannot read property uuid of null1. 资源引用丢失。2. 脚本在onLoad或start中访问了尚未初始化的节点或组件。1. 此错误与侧边栏无关是Cocos Creator常见错误。检查报错脚本中this.node、this的上下文是否正确特别是使用了schedule或异步回调时。2. 在属性检查器检查红色标记的丢失引用。使用this.node?.uuid进行可选链操作或增加空值判断。4.3 模拟环境下的高效调试技巧在开发阶段我们大部分时间是在PC浏览器或模拟器上。让侧边栏逻辑在非抖音环境下也能跑通能极大提升效率。增强Mock对象前面我们创建了基础的mockTTAPI。你可以扩展它模拟更复杂的行为。例如模拟网络延迟、模拟领取失败等场景。private mockTTAPI() { this._tt { showGameClub: (options) { console.log([Mock] 模拟打开侧边栏, options); // 模拟打开一个简单的浏览器弹窗作为调试面板仅用于开发 if (CC_DEBUG) { this.openDebugPanel(); } // 模拟成功回调 options?.success?.({}); }, postMessage: (msg) { console.log([Mock] 发送消息:, msg); // 可以在这里直接模拟H5的回复用于测试游戏逻辑 if (msg.command init) { setTimeout(() { this.onMessage({ command: mockReward, rewardId: debug_reward }); }, 1500); } }, onMessage: (cb) { this._mockMessageCallback cb; } }; } private openDebugPanel() { // 可以创建一个简单的DOM面板模拟侧边栏UI用于触发发送消息 // 这是一个高级技巧需要一些DOM操作知识 }使用条件编译Cocos Creator支持自定义宏。你可以在项目设置中定义ENABLE_TT_FEATURES然后在代码中通过#if ENABLE_TT_FEATURES来包裹抖音特定的代码。这样在打包Web Mobile版本进行普通测试时可以关闭这些功能。日志分级使用console.log、console.warn、console.error对不同重要性的信息进行分级。并利用CC_DEBUG宏来控制仅在开发环境输出详细日志。public postMessageToClub(msg: any) { if (this._tt this._tt.postMessage) { this._tt.postMessage(msg); if (CC_DEBUG) { console.log([GameClubBridge] 发送消息详情:, JSON.stringify(msg)); } } }5. 性能优化与进阶实践当基础功能跑通后可以考虑以下优化和进阶功能提升用户体验和系统健壮性。5.1 通信性能与数据精简侧边栏与游戏之间的通信是异步且有一定开销的。优化原则是减少次数精简数据。合并消息不要每有一个数据变化就发送一次。可以积累几次变化或者在一个固定的时间间隔如每秒批量发送。只发送变更数据在sendGameDataToClub方法中不要每次都发送完整的用户数据。可以维护一个上次发送的数据快照只发送变化的部分diff。压缩数据对于复杂对象可以考虑简单的字段名缩写如c代表coin但要以牺牲可读性为代价需谨慎权衡。更通用的做法是确保没有发送不必要的冗余数据。5.2 状态同步与容错处理网络和环境不稳定可能导致状态不同步。确认-应答机制对于重要的操作如领取奖励可以实现简单的确认机制。H5页面发送“领取请求”后禁用按钮直到收到游戏的“领取结果”消息后再更新UI状态。心跳与重连虽然侧边栏生命周期较短但对于需要保持长时间连接理论上不推荐的复杂应用可以实现一个简单的心跳包定期检查连接状态断线后尝试重新初始化数据。本地缓存H5页面可以在localStorage中缓存上一次从游戏收到的数据在页面加载初期先显示缓存内容待收到新的实时数据后再更新避免白屏或闪烁。5.3 与游戏其他系统的整合侧边栏礼包系统不应是孤立的。与任务系统联动侧边栏显示的任务其完成状态应实时从游戏任务系统同步。与广告系统联动侧边栏中“看广告双倍奖励”的按钮点击后应调用游戏的广告播放接口并在广告播放成功后由游戏逻辑通知侧边栏更新状态。与数据统计打点联动用户打开侧边栏、点击某个礼包、领取成功等行为都应通过游戏的数据统计SDK进行上报用于分析功能效果。5.4 应对平台API变更平台API可能会更新。提高代码的健壮性。API存在性检查在所有调用tt.xxx的地方都先检查tt和对应方法是否存在。封装统一接口不要在全项目散落着直接调用tt.showGameClub()。全部通过GameClubBridge这样的桥接类来访问。未来API变化只需修改这一个类。关注官方公告定期查看抖音小游戏开发者文档和公告了解API的废弃和新增情况。这套从原理到实践再到调试和优化的全流程基本覆盖了在Cocos Creator 3.8中接入抖音小游戏侧边栏礼包系统的所有关键点。最深刻的体会是模拟环境的完备性和真机调试的熟练度是决定开发效率的两个关键。前期花时间搭建好Mock系统后期就能在编辑器中完成大部分逻辑验证而掌握真机调试技巧则能快速定位和解决那些只在特定环境下出现的诡异问题。最后永远不要忽视平台审核规范在开发初期就对照规范设计功能能避免很多上线前的返工。