点击安装模板
1 模板简介
企业官网主要为展示公司信息、动态以及关于公司的介绍信息的展示和设置，我们将功能拆分成两部分。 
云模板内置了
c端应用
、
后台管理系统
和
api接口
，开发者可以根据自己的需要选择对应的开发模式。1.1开发模式
基于c端应用+后台管理系统的敏捷开发
开发者可以基于模板中已有的c端应用和b端管理系统进行二次开发，快速迭代项目，实现自己的业务需求，适用于定制化不强的业务，便于快速上线。
基于api+后台管理系统的自定义开发
当现有的c端应用模板不满足业务需求时，开发者可以使用原生微信开发实现自己的c端应用，编写自定义UI和业务逻辑，使用模板提供的api和后台管理系统持久化数据，适合有高度自定义需求的开发者。
基于c端应用+后台管理系统的开发方式可直接参阅基于c端应用+后台管理系统开发指南，基于api+后台管理系统的开发方式可直接参阅基于api+后台管理系统自定义开发指南，无论使用哪种开发方式，安装指南是不可缺少的环节。
提示： 在项目开始前，预先调研自己的项目适合哪种开发模式，是一种不错的做法
2 快速开始
2.1 安装企业官网云模板
（1）从微信IDE创建项目入口安装
在微信IDE创建项目入口找到
企业官网 云模板，点击 确定
按钮，等待安装完成。（2）从模版中心安装
在云模板中心找到
企业官网 云模板，点击右上角 安装模板
按钮，等待安装完成。注意：在创建项目之后，可通过微信开发者工具右上角的云开发->云模板->模板中心进入
2.2 相关资源说明
无论从哪一种入口安装模板，安装完成后，您将获得以下资源，他们的作用和位置分别为 
- 云数据库集合：本质为云开发数据库表，用于存储数据
- 管理后台：云模板提供的管理后台，可直接访问，或在云后台查看
- c端应用：使用基于c端应用+后台管理系统的敏捷开发模式时，c端应用直接嵌入到小程序中，预览区在微信开发者工具左侧，开发者点击页面设计可以在微搭低代码平台，通过可视化界面来编辑c端应用的各个页面，完成二次开发。
- api（工作流）：本质为工作流，提供对数据模型的增删改查能力，使用基于api+后台管理系统的自定义开发时，api（工作流）是开发者在原生微信开发中和数据模型交互的桥梁。
2.3 基于c端应用+后台管理系统开发指南
开发者从微信IDE创建项目入口完成安装步骤后，微信开发者IDE左侧会展示c端应用预览，右侧包括云数据库集合，管理后台，api（工作流）等各种资源。
**注意：**开发者可在此基础上进行
二次开发
，云模板致力于在简洁和灵活性上做平衡，值得庆幸的是，大部分的资源，如c端页面、api（工作流）、后台管理系统等，开发者都可自行修改。（1）界面编辑
c端应用编辑，可以在
服务管理 中点击 页面设计
，跳转到微搭web编辑器编辑应用。 
b端管理后台，可以在
服务管理 的管理后台点击 编辑
，跳转到微搭web编辑器编辑应用。 
编辑完成后，重新编译项目或者重启项目，将会看到最新的更改。
（2）二开开发 这里我们以修改
首页轮播图
为例。① 进入首页
② 获取企业信息数据源
③ 使用循环展示组件+图片组件并绑定首页展示图片信息数据
（3）发布 发布方式有两种，直接使用微信IDE的上传功能发布小程序（推荐），另一种是使用微搭低代码的发布功能，绑定小程序ID后发布。
2.4 基于api+后台管理系统自定义开发指南
从模板中心完成安装步骤后，在我的应用列表中点击查看详情会展示模板相关资源。
模板中的c端应用并不是必须的，开发者可以编写原生代码，在前端调用api来实现业务逻辑，接口的说明和调用示例在接口展示中做了详尽说明。 
（1）api（工作流）具体使用方式如下
- 配置云开发环境 ID
修改
app.js
，在
App
的
onLaunch
生命周期方法中添加云能力初始化代码，参数传入当前小程序的云开发环境ID。
App({
onLaunch: function () {
wx.cloud.init({
// env 参数决定接下来小程序发起的云开发调用（wx.cloud.xxx）会默认请求到哪个云环境的资源
env: 'lowcode-8gd57o8l7973e130',
// 是否在将用户访问记录到用户管理中，在控制台中可见，默认为false
traceUser: false,
});
},
});
- 调用api与数据库表交互
wx.cloud.callFunction({
name: 'cloudbase_module',
data: {
name: 'business_website_get_news',
data: {
"filter": {
"where": {
"_id": {
"$nempty": 1
}
}
},
"select": {
"$master": true
},
"pageNumber": 1,
"pageSize": 10,
"getCount": true
},
},
success: (res) => {
},
});
（2）发布
与普通小程序发布一致
3 数据模型架构设计
数据模型包含四张表，字段和关联关系如下 
4 api（工作流）设计
4.1 api总览
模板一共包含7个api（工作流），名称和作用如下：
business_website_get_info
- : 获取企业官网基础信息
business_website_get_scene
- : 获取企业官网应用场景列表
business_website_get_scene_detail
- : 获取企业官网应用场景详情
business_website_get_news
- : 获取企业官网最新动态列表
business_website_get_news_detail
- : 获取企业官网最新动态详情
business_website_get_solution
- : 获取企业官网解决方案列表
business_website_get_solution_detail
- : 获取企业官网解决方案详情
对于基础信息、应用场景、最新动态、解决方案只提供了查询api，创建、编辑和删除可在云后台进行操作。
4.2 调用方式
在调用之前需要初始化云开发sdk，初始化方式可参照快速开始章节中配置云开发环境 ID。
4.3 参数说明
对于查询api，查询参数不仅限于api接口文档提供的示例，开发者可根据实际业务需求，组合不同的查询条件，获取数据。
对于删除api，为了提供最大限度的兼容性，接口的删除条件均为数组，意味着该接口既可以删除单条记录，也可删除多条记录。
查询条件参考文档
4.4 返回值
接口返回值结构如下
{
"errMsg": "cloud.callFunction:ok",
"result": {
"Response": {
"Data": {
"records": [
{
"date": 1716220800000,
"owner": "1783070746496802818",
"createdAt": 1716367361763,
"createBy": "1783070746496802818",
"updateBy": "1783070746496802818",
"_openid": "1783070746496802818",
"_id": "324d3339664db001015a631557175861",
"title": "功能更新要点：新增流程引擎功能，新增编辑器实现预览模式...",
"content": "腾讯云微搭低代码 WeDa 是高效、高性能的拖拽式低代码开发平台，向上连接前端的行业业务，向下连接云计算的海量能力，助力企业垂直上云。微搭将繁琐的底层架构和基础设施抽象化为图形界面，通过行业化模板、拖放式组件和可视化配置快速构建多端应用（小程序、H5应用、Web 应用等），免去了代码编写工作，让您能够完全专注于业务场景。微搭以云开发作为底层支撑，云原生能力将应用搭建的全链路打通，提供高度开放的开发环境，且时刻为您的应用保驾护航
拖拽开发
页面可视化拖拽搭建和布局，上手门槛低。
表单组件拖拽布局，配置属性丰富，自由度高。
极简开发流程，小白也能3分钟极速实现应用的开发、发布和运维。
",
"picture": "cloud://wx-env01-3gf49vue58112f19.7778-wx-env01-3gf49vue58112f19-1257473911/weda-uploader/7783ba574b2c5f1077d9875651fa5ac6-d33eff8124507051de9170ea09b64100.png",
"updatedAt": 1716367361763
}
],
"total": 1
}
}
},
"requestID": "b531ebc5-9bc4-475e-9b1c-a4d2075ff3c0"
}
不同接口result内的值可能不同，但是对于同一个接口，返回值是稳定的，开发者可自行进行容错处理。
5 QA
Q：api（工作流）的查询参数如何编写?
A：查询参数与orm框架的编写方式类似，采用对象的形式描述，具体可以参照云开发文档
Q：如何将cloud://开头的图片转为https://开头的地址？
A：云开发针对图片做了防盗链处理，如需将cloud://的地址转为https://开头的地址，可以使用云开发sdk的[获取临时链接](https://docs.cloudbase.net/storage/get-temp-url)，在微信开发中的调用方式为
wx.cloud
.getTempFileURL( // 支持数组类型参数，同时处理多张图片
"cloud://tcb-demo-10cf5b.7463-tcb-demo-10cf5b-1302484483/images/pic_netbian_com/001714-162653863412dd.jpg"
)
.then((url) => console.log("请求结果", url));
