codewave-openclaw-installer 1.0.0

package/skills/smart-customer-service/docs/codewave/85./346/234/200/344/275/263/345/256/236/350/267/265/110./351/241/271/347/233/256/350/220/275/345/234/260/344/271/213/345/233/242/351/230/237/347/273/204/345/273/272/344/270/216/344/272/272/345/221/230/345/215/217/344/275/234.md

@@ -0,0 +1,49 @@
+# 项目落地之团队组建与人员协作
+
+## 1. 场景介绍
+
+CodeWave智能开发平台以其可视化界面和简化的开发流程，为不同技术背景的人员提供了快速构建应用程序的可能，降低了对深厚编程技能的需求。本文将详细介绍如何从 0 到 1 完成第一个CodeWave项目落地，包括团队组建、学习路径、项目开发流程及注意事项等。
+
+## 2. 团队的角色与技能
+
+- **业务团队的ITBP**：熟悉所属部门业务形态，有一定软件开发背景，擅长业务需求梳理和抽象，通常一个月左右可轻松上手CodeWave开发，在项目中能很好地将业务需求与开发工作对接。
+- **理工科背景的应届生**：专科、本科均可，具备逻辑思维和抽象思维，因工作经验较少，对业务的理解可能不够深入。但是经过一段时间的CodeWave学习后，可承担实际项目的CodeWave开发执行的工作。
+- **后端工程师**：在后端工程师人力充足、前端工程师人力紧缺的客户场景中，后端工程师是CodeWave开发的合适人选。他们擅长后端逻辑、建模等工作，经过短暂学习就能使用CodeWave进行完整项目开发，上手速度快且搭建效果好，还可开启前端视图进行前端开发，并通过接口调用传统后端代码。具体使用方法可参考：[前端视图使用说明](../20.应用开发/10.页面设计/37.开发视图.md)。
+- **前端工程师**：若前端工程师人力充足、后端工程师紧缺，可安排前端工程师学习CodeWave进行开发。这类人群本身具有软件开发经验，更易上手学习，能为项目带来专业的前端开发能力。
+- **产品经理**：这类人群理解业务逻辑，经过学习可进行简单应用或示例应用的开发。对于复杂业务系统，建议专人负责CodeWave开发和产品策划，避免工作职责不清，不符合产品经理的工作意愿的情况，从而影响项目落地。
+- **项目经理**：团队内具备一定技术背景的项目经理，在推进项目节奏可控的同时，经过一到两个月的学习，可参与团队内协作开发应用系统，确保项目按时、高质量交付。
+
+## 3. 开发技能学习路径
+
+明确了CodeWave开发人选，可按如下学习路径掌握CodeWave开发技能：
+
+1.  社区自学基础：首先，花费1周时间在CodeWave社区中进行自助学习，掌握基础知识，了解CodeWave开发的基本概念、常用工具和操作流程等。
+2.  参加认证考试：在学习基础知识的过程中，同步参加CodeWave中级认证考试，通过边学边考的方式，全面掌握CodeWave开发技能。CodeWave认证入口：[网易CodeWave认证](https://community.codewave.163.com/CommunityParent/Examcertification)。
+3.  交流解决疑问：在学习和考试过程中，遇到问题可以在开发交流群中与其他开发者交流互动，及时解决疑问，提升学习效果。
+
+## 4. 项目开发流程与要点
+
+### 4.1 确定项目组成员
+
+- 产品经理：根据项目工作量大小，确定产品策划人员数量。由于CodeWave平台如CodeWave是通过拖拉拽模块化封装组件搭建页面，产品策划人员输出的产品需求可粒度更粗，从而节省一部分设计人力。
+- 设计师：根据项目工作量大小，确定设计师人员数量。部分需求可直接采用CodeWave应用模板的视觉规范，以减少设计工作量，提高开发效率。
+- CodeWave开发人员：根据项目工作量大小，确定CodeWave开发人员数量。若多人参与同一项目开发，可按功能模块划分开发者工作内容，利用多人协作功能确保开发工作的顺利进行，具体可参考：[多人协同开发使用说明](../30.应用生命周期管理/120.多人协作开发/10.多人协作概念介绍.md)。
+- 测试工程师：根据项目工作量大小，确定测试人员数量，确保项目上线前的质量。
+
+### 4.2 处理特殊需求
+
+- 个性化视觉样式开发：对于像官网应用等需要丰富、独特的交互和视觉效果的项目，建议申请前端工程师资源，进行前端扩展组件的开发与封装，并导入平台的资产中心，供CodeWave开发者引用以实现完整应用效果，具体可参考：[前端依赖库开发指导](../40.扩展与集成/10.扩展开发方式/20.前端扩展开发/10.前端扩展开发概述.md)。
+- 复杂或个性化业务逻辑实现：若应用需要文件流处理能力等复杂或个性化业务逻辑，建议申请后端工程师资源，由后端工程师封装扩展逻辑，即依赖库，并导入平台的资产中心，供CodeWave开发者引用以实现完整应用效果，具体可参考：[服务端依赖库开发快速入门](../40.扩展与集成/10.扩展开发方式/30.服务端扩展开发/10.依赖库开发/10.服务端依赖库开发快速入门.md)。
+
+### 4.3 启动与推进项目
+
+经过上述准备工作，即可正式启动CodeWave项目开发。即使是没有深厚编程背景的团队，也能顺利完成CodeWave项目的落地，快速构建出满足业务需求的应用程序。
+
+此外，在开发过程中遇到任何疑问，均可在开发交流群中获取帮助和解答，确保项目顺利进行，按时交付。
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">长颈鹿</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年01月10日</span>
+</div>

package/skills/smart-customer-service/docs/codewave/85./346/234/200/344/275/263/345/256/236/350/267/265/150./345/272/224/347/224/250/351/203/250/347/275/262/345/244/232/345/234/272/346/231/257/346/224/273/347/225/245.md

@@ -0,0 +1,99 @@
+# 应用部署多场景攻略
+
+## 1. 场景介绍
+
+通过CodeWave智能开发平台开发的应用，支持多种部署形式，以灵活适配不同客户的IT环境和部署要求，CodeWave开发者可以按需采用适合自己的部署方式。CodeWave智能开发平台支持本地快速发布、导出源码、导出制品、远程部署等多种方式用于应用部署。
+
+以下将结合具体的IT环境和部署要求来分别介绍部署方式，期望能让CodeWave开发者按需选择适合的部署方式。
+
+## 2. 实践场景
+
+### 场景一：一键发布到生产环境
+
+#### 场景介绍
+
+当企业无独立部署要求时，可采用一键发布到生产环境。
+
+一键发布到生产环境后由CodeWave平台提供完整的CICD流水线功能。
+
+#### 实践思路
+
+CodeWave平台开发的应用一键发布到生产环境可参考使用说明文档：[应用发布与访问](../30.应用生命周期管理/050.应用发布与访问/10.应用发布与访问.md)。
+
+### 场景二：一键部署到远程服务器
+
+#### 场景介绍
+
+当企业需要独立部署但是又对应用上线流程不做强制约束，甚至可能有部分企业没有内部的DevOps规范且无相关运维操作人员，这个时候比较适合通过远程部署的方式将应用部署到远程服务器。
+
+#### 实践思路
+
+远程部署的具体操作可查看：[应用远程部署](../30.应用生命周期管理/100.应用导出与部署/40.应用远程部署.md)。
+
+远程部署需要具备以下前提条件：
+
+- 目标服务器与当前CodeWave平台的网络连通。如果是网络隔离的情况下不能使用远程部署。
+- 需要服务器账号信息，包括用户名和密码，需要具备一定的操作权限。
+- 需要可访问的数据库信息，包括用户名密码等配置。
+
+### 场景三：导出制品直接部署
+
+#### 场景介绍
+
+如果企业对需要上线的应用要求独立部署，但是对代码规范和上线流程没有严格要求的情况下，可以选择直接导出制品的方式进行部署。
+
+同样如果企业要求独立部署，但是又不具备独立编译构建的能力的情况下，也建议直接导出制品进行部署。
+
+导出制品直接部署的方式由于缺少了内部流水线的对接，需要操作人员直接操作服务器。因此需要这种方式进行的情况需要有一定的前置条件：
+
+- 有独立部署的服务器资源，操作人熟悉部署环境，了解基础的服务器操作。
+- 服务器能上传文件，并提供足够权限的账号用于部署操作。
+- 有可用域名，并已配置DNS解析到目标服务器。
+
+#### 实践思路
+
+通过CodeWave平台开发的应用可直接导出为制品，具体导出方式可查看：[应用导出与部署介绍](../30.应用生命周期管理/100.应用导出与部署/00.应用导出与部署介绍.md)。
+
+导出制品的方式主要有：
+
+- 镜像：企业的部署环境是k8s且要求独立部署的情况下，可采用这种方式。具体操作可查看：[应用导出镜像并部署](../30.应用生命周期管理/100.应用导出与部署/30.应用导出镜像并部署.md)。
+- jar包：仅需要部署服务端且客户不要求二次编译的情况下，可直接导出jar包。注意部署时目标服务器需要具备JDK基础运行环境。
+- 前端静态文件：仅需要部署前端且客户不要求二次编译，可直接导出前端文件部署。部署前端静态文件需要一个运行容器，一般推荐Nginx。
+- jar包+前端静态文件：需要前后端功能，但是不需要二次编译的时候，可选择导出jar包和前端静态文件。具体操作可查看：[应用导出JAR包和前端静态文件并部署](../30.应用生命周期管理/100.应用导出与部署/35.应用导出JAR包和前端静态文件并部署.md)。
+
+### 场景四：导出源码对接DevOps
+
+#### 场景介绍
+
+企业内部DevOps研发体系比较完整，对应用发布上线流程要求比较严格，通过CodeWave平台开发的应用在上线前也需要按规范匹配DevOps研发体系，走完整的应用发布流程。
+
+如果是高代码开发，一般是代码开发完成后将代码推送到Git仓库，然后驱动CICD流水线执行，实现整个发布流程。CodeWave平台开发的应用同样也支持导出前后端源码并自动推送到Git仓库。
+
+#### 实践思路
+
+CodeWave平台开发的应用支持导出前后端源码并推送到Git仓库，具体操作可查看：[应用导出源码并部署](../30.应用生命周期管理/100.应用导出与部署/20.应用导出源码并部署.md)。
+
+整体可通过以下几个过程来完成对接DevOps工作：
+
+- 确认代码仓库，配置导出源码代码仓库，配置说明可查看：[源码配置](../50.平台配置管理/20.源码配置.md)。
+- 确定应用对应的Git仓库的group、project以及分支。一般group不做特殊要求，project建议按应用的标识来生产，分支可以是dev或master。
+- 也可在导出应用时再自定义group、project、分支等信息。具体操作可查看：[导出源码到第三方Git仓库](../30.应用生命周期管理/100.应用导出与部署/50.导出源码到第三方Git仓库.md)。
+- 导出应用到git仓库时，可填写“备注”信息，作为本次提交的备注信息。同时git也会记录当前提交的操作人。建议操作导出到git的凭证使用当前操作用户自己的凭证，这样git中记录的人员信息才有意义。
+- 在导出源码时，按根据实际需要选择不同的源码类型
+
+    - 后端源码：当前应用仅提供服务端能力，无前端功能或前端功能由高代码实现；
+    - 前端源码：纯前端开发的时候，服务端由高代码实现，通过接口的方式调用；
+    - 后端源码+前端静态文件：无需对前端源码，前端静态会加载到服务端的某个目录下运行，非前后端分离的模式；
+    - 后端源码+前端源码：同时需要前后端源码。这种情况代码目录结构可选择是否合并还是拆分。
+- 如果在源码编译过程中出现问题，可参考：[应用导出源码并部署-补充说明](../30.应用生命周期管理/100.应用导出与部署/20.应用导出源码并部署.md) 解决。
+
+代码成功提交到git仓库后，流水线执行流程如图：
+
+<img src="../assets/yingyongbushuzuijiashijian_202501031602_1.jpg" class="imgStyle" style="width:70%;" />
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">有鲤</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年01月10日</span>
+</div>

package/skills/smart-customer-service/docs/codewave/85./346/234/200/344/275/263/345/256/236/350/267/265/160./346/211/223/351/200/240/345/256/214/347/276/216/351/241/265/351/235/242/347/232/204/345/233/233/345/244/247/346/212/200/345/267/247.md

@@ -0,0 +1,74 @@
+# 打造完美页面的四大技巧
+
+当开发者需要开发一个全新应用时，应该如何完成一个页面的创建？
+
+若您持有基于 Figma、MasterGO、Sketch 所生成的设计稿，不妨优先选用智能设计生成页面（D2C）这一便捷方式来导入页面，一键轻松生成所需页面。详细的操作指南可查阅文档：[智能设计生成页面](../25.智能开发/005.智能设计生成页面/005.智能设计生成页面.md)。
+
+若智能设计生成页面（D2C）功能难以契合您当下的具体需求，您还可以选择回归传统的页面搭建方式。基于设计师提供的设计稿，参照当前画布的实际宽度参数，手动搭建需要的页面效果。
+
+以下是手动搭建页面的参考步骤。
+
+## 1. 配置主题风格
+
+如果您已经明确设计样式，可以先规范整体颜色风格、间距、组件圆角等统一的样式风格，再例如观察官方提供组件和需求形态的差异，然后您可以进入到主题样式面板进行全局主题样式和单组件主题样式配置。具体介绍可查看文档：[自定义主题样式](../20.应用开发/60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+## 2. 规划页面布局
+
+配置完主题样式后，您可以开始划分搭建页面的布局。
+
+1.  通常情况下，页面效果往往没有办法通过一个页面进行承载，需要实现父、子页面拆分。我们可以使用子页面容器组件，将多个页面通用的部分抽离成父页面，剩余的内容通过子页面容器承载。例如，导航栏是父页面，通过导航栏切换跳转的页面为子页面。
+
+    <img src="../assets/dazaowanmeiyemiande4dajiqiao_202501101105_1.png" class="imgStyle" style="" />
+
+1.  页面拆分完成后，接下来需要考虑页面的自适应效果，即我们需要考虑网页发布以后在不同大小的浏览器窗口下的页面布局表现。这会影响如何选择布局组件，并且平台提供了[线性布局](../20.应用开发/10.页面设计/20.PC端Vue2组件说明（默认）/01.布局/020.线性布局.md)、[栅格布局](../20.应用开发/10.页面设计/20.PC端Vue2组件说明（默认）/01.布局/030.栅格布局.md)、[自由布局](../20.应用开发/10.页面设计/20.PC端Vue2组件说明（默认）/01.布局/050.自由布局.md)、[分栏布局](../20.应用开发/10.页面设计/20.PC端Vue2组件说明（默认）/01.布局/040.分栏布局.md)四种布局来满足常见的布局场景。具体介绍请参考组件文档。
+
+## 3. 搭建页面样式
+
+完成页面布局划分后，您可以选择需要的组件并将组件拖拽至画布区域，正式开始页面的搭建。
+
+<img src="../assets/dazaowanmeiyemiande4dajiqiao_202501101105_2.png" class="imgStyle" style="" />
+
+若您仿照设计稿来搭建页面，或许会发现设计稿中的每一个图标都对应了很多图层，但搭建页面并不需要关注这些图层区分。
+
+<img src="../assets/dazaowanmeiyemiande4dajiqiao_202501101105_3.png" class="imgStyle" style="" />
+
+因此我们可以借助于设计稿切图将图标组合为网页中的一张图片。
+
+<div class="highlight">
+
+**什么是设计稿切图**
+
+设计稿切图是指将网页设计师设计的页面原型图或视觉设计稿按照设计要求，使用专业设计软件（Figma、Mastergo等）进行切割，将页面中的各个元素（如背景、文字、图标、按钮等）分割成单独的图片或图层，以便在网页开发中使用。
+
+</div>
+
+以Mastergo为例，在切图时，我们需要先选择图片的倍率，以确保图像在不同设备上显示时保持清晰度和质量。倍率越高，清晰度越高。
+
+通常，对于标准屏幕密度的设备，使用1x倍率；对于高密度（如Retina屏）设备，使用2x倍率；对于极高密度设备，使用3x倍率。
+
+<img src="../assets/dazaowanmeiyemiande4dajiqiao_202501101105_4.gif" class="imgStyle" style="" />
+
+## 4. 编排交互逻辑
+
+页面布局完成后，需要进一步思考组件的逻辑，包括组件应该如何绑定数据、如何做前后端的数据交互等，具体组件的功能实现请查看文档中心文档。
+
+此外，在页面编写进程中，您或许会留意到部分局部业务场景频繁出现。不妨将这些高频出现的业务场景封装为专门的 [业务组件](../20.应用开发/10.页面设计/34.业务组件/010.什么是业务组件.md)，在众多不同的页面区域调用业务组件，实现“一次封装，处处复用”的便捷效果，提升工作效率。
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">有鲤</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年01月10日</span>
+</div>
+
+<style>
+ .highlight {
+      border: 1px solid #679CF8; /* 添加边框 */
+      border-radius: 6px;
+      background-color: #F8FCFF; /* 添加底色 */
+      padding: 10px 20px 10px 20px;
+      margin-bottom:20px;
+      margin-top:20px;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+  }
+</style>

package/skills/smart-customer-service/docs/codewave/85./346/234/200/344/275/263/345/256/236/350/267/265/162./345/244/232/347/273/264/345/272/246/345/256/236/347/216/260/344/270/255/345/220/216/345/217/260/351/241/265/351/235/242/345/261/200/351/203/250/346/273/232/345/212/250.md

@@ -0,0 +1,105 @@
+# 中后台页面局部滚动
+
+## 1. 背景介绍
+
+在页面设计中，局部滚动是一种常见的布局方式。以中后台系统页面为例，页面中通常需要展示大量的数据，为了有效利用屏幕的展示区域、允许不同的功能区域独立管理自己的空间，建议通过页面局部滚动使页面主要内容固定展示、次要内容放置在滚动区域。
+
+本文将帮助您了解页面局部滚动的典型使用场景，并提供清晰的操作说明：
+
+* 其一，固定导航区域的设置。无论是位于页面顶部的导航栏、底部的页签，还是侧边的导航栏，都可将其固定于特定位置，使页面的其余部分滚动展示，方便导航区域始终保持可见。
+* 其二，通过容器来放置需要滚动展示的区域。
+
+## 2. 实践场景
+
+### 场景一： 固定所有导航栏
+
+#### 场景介绍
+
+应用页面包含顶部导航、侧边导航，要求导航固定在顶部和侧边，仅内容区域跟随页面滚动。
+
+![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_1.png)
+
+#### **实践思路**
+
+通过使导航部分相对于浏览器视口进行定位，始终固定在视口的某个位置，使页面发生滚动时导航部分仍然固定在视口的相对位置上，保持可见状态。
+
+实现上述效果需要为导航栏设置“固定定位”。
+
+#### 操作步骤
+
+1. 固定顶部导航栏。选中顶部导航栏，在样式中将定位模式修改为“固定定位”，固定在顶部时定位值为上：0，左：0。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_2.png)
+
+2. 固定侧边栏。选中侧边导航，在样式中将定位模式修改为“固定定位”，固定在左侧且在顶部导航下方，顶部导航的默认高度为60px，因此定位值为上：60，左：0。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_3.png)
+
+3. 为了防止固定定位的导航栏遮挡内容区域，需在内容区域的布局内预留高度。例如为内容区域的布局栏设置上内边距，大小即顶部导航栏的高度60。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_4.png)
+
+4. 发布预览效果。
+
+#### 效果演示
+
+![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_5.gif)
+
+### **场景二：** 仅指定区域滚动
+
+#### 场景介绍
+
+页面内容固定，仅选项卡中的内容跟随鼠标滚动。
+
+![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_6.png)
+
+#### **实践思路**
+
+通过控制页面容器的高度，使其始终与视口高度保持一致，并将内容放置在一个支持滚动展示的容器中，可以实现容器外内容固定，容器内内容滚动的效果。
+
+实现上述效果需要使容器的高度跟随视口高度变化，使页面的总高度始终占满视口，而定义容器高度的方法则是“视口的高度（即100vh） - 容器外的高度”。
+
+#### 操作步骤
+
+1. 将选项卡中需要滚动展示的内容包裹在线性布局组件内，在样式中将内容超出布局宽高的模式修改为“超出则出现滚动条展示”。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_7.png)
+
+2. 为了使高度滚动区域的高度占满除固定区域以外的屏幕，线性布局的高度建议通过css样式进行计算。本示例中滚动区域的高度建议为 "100vh -顶部导航栏高度-其他内容高度-选项卡Tab项高度-选项卡内容区域内边距"。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_8.png)
+
+3. 对于组件级别的样式，支持直接选中组件后在样式中查看。例如顶部导航栏的高度为60px、示例中其他内容高度为220px。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_9.png)
+
+4. 对于组件层级级别的样式，需要查看元素的计算样式。例如本示例中选项卡内容的内边距为16px，查看方法如下：
+
+    * 方法一：发布预览后，打开制品应用的控制台，选中选项卡内容区域，即可查看其计算样式中包含上内边距。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_10.png)
+
+    * 方法二：在IDE中，将选项卡的样式切换为高级样式模式，选中选项卡内容区域，即可查看其计算样式中包含上内边距。
+
+
+        ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_11.gif)
+
+
+5. 与上一步骤相同，继续查看选项卡Tab项高度；或在选项卡的主题样式中查看其高度为48px。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_12.png)
+
+    > 上述样式均为查看的默认值，支持自定义修改。
+
+6. 已知固定区域的高度后，为线性布局设置高度，使线性布局中超出高度的部分滚动出现。综上可知，计算线性布局的高度为 100vh - 60px - 220px - 48px - 16px，即100vh - 344px，因此在线性布局的样式->自定义中填入定义高度的 CSS 代码，格式为 `height: calc(100vh - 344px);`。
+
+    注意在书写 CSS 代码时，`calc` 计算公式中的运算符两侧需要使用空格间隔。
+
+    ![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_13.png)
+
+7. 发布预览效果。
+
+#### **效果演示**
+
+![](../assets/duoweidushixianzhonghoutaiyemianjubugundong_20260113155507_14.gif)
+

package/skills/smart-customer-service/docs/codewave/85./346/234/200/344/275/263/345/256/236/350/267/265/165./346/211/251/345/261/225/346/226/207/344/273/266/345/255/230/345/202/250/346/226/271/345/274/217/347/232/204/345/244/232/347/247/215/351/200/224/345/276/204.md

@@ -0,0 +1,124 @@
+# 扩展文件存储方式的多种途径
+
+## 场景介绍
+
+业务中通常需要上传文件数据（如图片、视频、文档、压缩包等），对文件存储的可用性、扩展性需求也持续提升。在默认情况下，文件上传组件会将文件上传到平台默认的存储设施中，同时还支持通过多种方式来切换存储设施，包括但不限于以下几种：
+
+- 对接第三方 S3 存储
+- 服务器本地存储
+- 文件经过base64编码后直接存入到数据库中
+- 调用第三方文件上传接口
+
+以下通过几个典型的场景来示范如何扩展Codewave的文件存储能力。
+
+## 实践场景
+
+### 场景一：在应用中对接第三方对象存储
+
+#### 场景介绍
+
+在项目中实现文件存储时，比较常见的需求是把文件上传到指定的对象存储中，例如企业自行建立的S3存储，或者是阿里云、腾讯云、华为云、Azure、亚马逊等服务商提供的对象存储，这种情况下可以通过文件连接器来实现，文件连接器不仅能为应用对接第三方存储源，还可以同时添加多套存储设施，不同的文件上传组件可以指定不同的存储源。详细的文件连接器介绍请参考文档：[文件存储连接器](../40.扩展与集成/20.集成开发方式/20.连接器集成/35.系统连接器/20.文件存储连接器.md)。
+
+#### 实践思路
+
+使用方式如下，点击IDE上方的“集成”，添加默认文件连接器。
+
+<img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_1.png" class="imgStyle" style="" />
+
+录入连接器所需的一系列参数，如密钥、桶、是否公有、存储路径等信息。
+
+<img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_2.png" class="imgStyle" style="width:400px;" />
+
+保存连接器后，进入**应用配置 > 文件存储策略**，添加文件存储方式，在新的存储方式里选择上面创建的连接器。
+
+<img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_3.png" class="imgStyle" style="width:600px;" />
+
+使用文件上传组件时便可以通过“存储方式”属性来指定要对接的存储设施，每一个文件上传组件都可以单独设置。
+
+<img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_4.png" class="imgStyle" style="" />
+
+### 场景二：使用本地存储模式存到服务器上
+
+#### 场景介绍
+
+业务场景中可能要求上传的文件需要保存到应用运行环境中，例如直接保存在服务器的本地硬盘上，或者希望在开发机上运行源码时可以本地存储而不走云存储。本地存储也是通过文件连接器来实现。详细的连接器配置方式可参考文档：文件存储连接器
+
+#### 实践思路
+
+在添加文件连接器时，只需要修改几个特定的字段，将sinkPath字段填写为`local;`+`本地文件夹地址`即可。
+
+<img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_5.png" class="imgStyle" style="width:400px;" />
+
+导出源码之后，也可以在源码的yml文件中来修改文件连接器的配置。
+
+<img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_6.png" class="imgStyle" style="" />
+
+需要注意的是，本地存储主要适用于导出源码并部署的场景，当发布开发环境或生产环境时，由于应用程序是运行在容器内部，这种情况下的“本地存储”实际上是存到了容器内部，文件会随着容器的销毁而一同销毁。
+
+### 场景三：修改租户级别的文件存储设施
+
+#### 场景介绍
+
+在业务场景中，你可能有多个应用会使用相同的存储设施，例如有一批项目都需要使用特定的阿里云桶，尽管你可以为每个应用都添加文件连接器来对接这个阿里云桶，但这种管理存储设施的方式相对分散，当需要修改桶的配置时必须在每个应用中逐个修改，对于此类情况你可以添加租户级别的文件存储配置，应用中的文件存储方式便可以直接选择租户级别的配置。
+
+#### 实践思路
+
+1. 在**配置中心 > 文件存储配置**中新增一套存储设置。
+
+    <img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_7.png" class="imgStyle" style="" />
+
+    <img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_8.png" class="imgStyle" style="" />
+
+2. 新增之后，进入应用的**应用配置 > 文件存储配置**，修改“系统文件存储”为上述新增的存储设施即可。
+
+    多个应用只需要在此关联同一个存储设施，在租户下修改了存储设施的配置后只需要重新发布应用即可生效。
+
+    <img src="../assets/kuozhanwenjiancunchufangshideduozhongtujing_202509081741_9.png" class="imgStyle" style="" />
+
+### 场景四：使用base64编码存储文件
+
+#### 场景介绍
+
+base64是一种数据编码方式，允许将二进制文件（如图片、音频）转换成一个特殊的字符串，这个字符串经过解码后可以还原成原文件。
+
+开发者可以将文件体积较小的文件转换成base64字符串后存储到数据库中，例如将图片编码成一个字符串，使用图片组件时直接将base64字符串作为图片地址即可，优势是可以直接利用数据库，当做实体字段来处理文件。
+
+#### 实践思路
+
+图片组件支持使用base64字符串作为图片地址，从而避免需要依赖外部图片链接，示例如下：
+
+1. 通过第三方工具将图片转换成base64字符串，例如：<https://www.bejson.com/ui/image2base64/>
+
+    <img src="../assets/wenjiancunchuzuijiashijian_202410151816_7.png" class="imgStyle" style="width:400px;" />
+
+2. 图片（或图标）组件使用base64字符串作为展示的内容。如下图所示，在图片展示组件的“地址”属性中直接粘贴base64字符串内容，在IDE中即可预览效果。
+
+    <img src="../assets/wenjiancunchuzuijiashijian_202410151816_8.png" class="imgStyle" style="" />
+
+如果需要实现在制品应用中将图片转换成base64编码，可以使用依赖库将图片文件转换成base64，依赖库的下载可前往[资产市场](https://community.codewave.163.com/CommunityParent/CodeWaveMarket?navia=&currentType=%E6%90%9C%E4%BE%9D%E8%B5%96)搜素“图片转码”。
+
+如果需要将base64字符串存储到数据库中，设计实体时需要注意，文件经过编码转换后得到的字符串可能长度非常大，应合理设置String类型的最大长度，避免因为长度不够导致存储失败。
+
+<img src="../assets/wenjiancunchuzuijiashijian_202410151816_9.png" class="imgStyle" style="" />
+
+此外，使用base64编码存储文件也有一些明显的不足之处：
+
+- 编码后的文本会比原文件占用更多的存储空间，所以不适合文件体积略大的文件或者频繁传输。
+- 由于编码后的文本数据量会比较大，存放在数据库中会影响数据库查询性能。
+
+所以base64编码存储这种方式仅建议用在非常小的文件上，例如图标、小型图片。
+
+### 场景五：调用第三方文件上传接口
+
+在业务中可能需要调用第三方文件上传接口，例如以下场景：
+- 对接某风险审核服务，需要将图片上传到第三方的图片审核接口。
+- 对接某AI平台，需要上传文档输入给大模型。
+
+从4.3版本开始，连接器和依赖库都支持使用**File**类型，可用来传递原始二进制文件，解决上述场景。详细使用方式请参考文档：[将文件上传到第三方接口](../80.常见场景案例/80.业务场景/220.将文件上传到第三方接口.md)。
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">老王</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年11月21日</span>
+</div>

package/skills/smart-customer-service/docs/codewave/85./346/234/200/344/275/263/345/256/236/350/267/265/170.CodeWave/345/274/200/345/217/221/346/216/222/351/232/234/357/274/214/347/256/200/346/230/223/344/270/211/346/255/245/350/265/260.md

@@ -0,0 +1,134 @@
+# CodeWave开发排障，简易三步走
+
+## 1. 场景介绍
+
+CodeWave开发者在开发应用时或使用制品应用时可能会遇到一些故障错误，如何有效准确地定位故障原因并解决是所有开发者需要掌握的一门技能，以下通过一些典型的故障场景来描述最佳排障实践。
+
+## 2. 实践思路
+
+### 应用开发时故障
+
+开发阶段的故障是指在IDE中编辑时或发布时出现报错，可通过以下方式定位问题：
+
+- **IDE检查提示报错**，可以在IDE底部的问题栏中查看报错信息，点击报错信息可定位到具体错误位置，可有针对性的进行修复，例如缺少必填时可输入必填信息，类型匹配错误时可修改正确的类型匹配。当修复正确后问题栏中对应的错误信息会立即消失。
+- **应用发布失败并提示错误**，这种情况下重点关注IDE底部的发布栏中是否有明确的错误信息，如果有明确的错误信息则可以根据错误提示进行修复。修复后可再次预览发布进行调试。如果没有明确的错误信息，则需要根据当前发布的traceId去查看日志信息。查看日志有两个入口：
+
+    - 查看应用发布日志，在发布栏中即可通过查看日志链接进入查看。
+    - 查看系统日志，可通过运维中心>日志与监控入口进行查看各个组件的日志信息。查看时可根据traceId作为关键词进行检索查看。
+- **导出应用失败并提示错误**，与应用发布错误类似，在导出应用时可查看导出操作日志，根据具体日志判断哪里出现问题并进行调整，如果导出操作日志无法准确提供错误信息，可查看系统日志进一步定位问题；
+- **远程部署应用失败并提示错误**，根据错误提示按照应用发布错误的操作流程进行排障处理，一般远程部署的错误类型可能有以下几种情况：
+
+    - 应用编译失败，这种情况其实预览发布一般也会失败，所以建议是预览发布成功后再远程部署；
+    - 远程数据库连接失败，根据错误信息可修改数据库相关配置；
+    - 执行sql异常，一般可能是数据库账号权限问题导致远程部署异常；
+- **源码编译失败**，当导出源码后通过本地进行编译时出现错误，一般都是编译环境未准备充分导致，可查看 [源码导出说明](../30.应用生命周期管理/100.应用导出与部署/20.应用导出源码并部署.md) 文档行准备操作。当出现缺少jar包或前端依赖库时，需要手动载入相关依赖库。
+
+应用开发时排障最佳流程：
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_1.jpg" class="imgStyle" style="width:550px;" />
+
+### 应用运行时故障
+
+运行时故障是指应用成功发布了，但是在运行期出现报错或者不符合预期行为，可通过以下方式定位问题：
+
+- **页面加载白屏**，这种情况一般要优先查看浏览器的控制台是否有报错，可F12或右键检查打开浏览器开发模式，查看控制台是否有报错，如果有报错要仔细查看报错信息是否跟自定义变量有关。如果有关则需要到IDE里进行调试，可能是空指针等情况。如果无法识别错误原因，需要尽快联系技术经理；
+- **组件未按照理想展示效果**，这个时候需要仔细查看相关组件的使用说明文档，按需进行配置相关属性。如果有相关属性通过变量进行控制的时候，可采用“打印日志”组件将相关变量值打印；
+- **显示数据不对或数据更新未保存**，可通过调试功能观察数据的变化，文档请参考：[调试](../20.应用开发/60.可视化开发界面/050.调试.md)
+- **提交或更新操作提示异常**，如果提示有具体错误信息，可根据错误信息查看IDE进行修改，也可通过调试功能进行数据调试，具体请查看[说明文档](../20.应用开发/60.可视化开发界面/050.调试.md)。如果还无法定位问题，可通过查询系统日志进行定位问题。
+
+应用运行时排障最佳流程：
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_2.jpg" class="imgStyle" style="width:550px;" />
+
+### 故障无法解决时
+
+当故障问题无法自助解决时，需要联系技术支持，在联系同时请尽量提供以下信息便于快速定位问题：
+
+- 所在公司名称或您注册平台的账号信息
+- 当前使用的环境，是saas环境还是私有化环境。
+- 当前应用的版本及平台的版本。
+- 当前报错的截图或日志。
+- 精炼准确地描述异常情况，例如：在应用发布成功后，账号登陆正常，但是在点击提交表单数据时提示系统异常，并提供相关截图。
+
+## 3. 实践场景
+
+### 场景一：查看IDE信息台报错信息
+
+如下图所示，发布失败，IDE信息台中报错“unknow database“，此时可以根据这个报错信息检查数据库是否创建， 数据库连接是否联通。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_3.png" class="imgStyle" style="" />
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_4.png" class="imgStyle" style="" />
+
+可以登录到数据库服务器中查看数据库进程是否运行中，数据库是否创建。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_5.png" class="imgStyle" style="" />
+
+本案例中的错误原因是因为应用中使用的库在数据库中不存在。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_6.png" class="imgStyle" style="" />
+
+### 场景二：查看平台的发布日志
+
+如果控制台没有特别的日志，但是有提示在哪个阶段失败，可以到发布日志中查看具体失败原因。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_7.png" class="imgStyle" style="" />
+
+可以在失败阶段找到相关日志和原因。 本案例的错误原因就是在javalogicService这个逻辑中出现异常了。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_8.png" class="imgStyle" style="" />
+
+回到IDE中检查该逻辑，定位到错误原因是代码编写有误。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_9.png" class="imgStyle" style="" />
+
+### 场景三：查看浏览器的报错信息
+
+如果控制台没有明显的提示信息，且没有到发布阶段，可以打开F12 查看一下两个接口的响应，是否有错误提示。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_10.png" class="imgStyle" style="" />
+
+例如上图报错，一般是数据库出现异常情况，或者网络连不到这个数据库。
+
+由于示例中的制品应用是运行在公网SaaS上的，所以需要数据库能够被公网访问。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_11.png" class="imgStyle" style="" />
+
+可以用一个公网ip的机器进行telnet测试：`telnet \${数据库ip} \${数据库端口}`，如果发现是不通的，说明网络有问题，制品应用无法连接到数据库。（但是ping是可以通的, 一般都是因为端口被防火墙禁了，或者进程没启动。）
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_12.png" class="imgStyle" style="" />
+
+登录服务器进行排查，发现本案例的错误原因是数据库进程没启动。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_13.png" class="imgStyle" style="" />
+
+### 场景四：后端逻辑排障
+
+开发中，有时会有多个后端逻辑互相嵌套，导致逻辑比较深，此时其中如果有逻辑报错，最外层获取不到错误信息，会影响排查。
+
+例如，在一个后端逻辑中调用了其他后端逻辑，最后接口报错500。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_14.png" class="imgStyle" style="" />
+
+首先进入“运维中心-日志与监控”，找到对应应用环境的日志片段，可以观察到是调用的逻辑有报错。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_15.png" class="imgStyle" style="" />
+
+点击日志段落后面的小图标，可以跳转到IDE中并定位到报错位置
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_16.png" class="imgStyle" style="" />
+
+这里看到是Transform这个内置函数报错了，结合日志提示的空值异常，可以推断出是传入的值为null导致的报错。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_17.png" class="imgStyle" style="" />
+
+后端的Transform函数需要注意判空，不然列表为空就会报错，可以先判断是否为空。重新发布，问题解决。
+
+<img src="../assets/didaimakaifapaizhangjianyisanbuzou_202501101119_18.png" class="imgStyle" style="" />
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">老王</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年01月10日</span>
+</div>