微信小程序·雲開發：快速入門與實踐

本書系統講解小程式全棧專案開發所需的前後端技術。全書共分為3個部分，部分以實操的方式全面介紹小程式頁面開發、事件處理、API調用、雲函數、雲數據庫等基礎概念，第二部分以相冊、博客、問卷小程式為例介紹如何規劃、開發一個完整的小程式專案，第三部分提出雲函數、雲數據庫、雲調用的開發指引及性能優化建議。

本書將詳細的操作步驟、完整的代碼、複雜的技術概念以及科學的學習方法緊密結合，充分做到讓讀者從零基礎起步，不需要具備其他前置程式設計技術背景知識就能掌握小程式雲開發方法，從而開發出完整的全棧專案，適合零基礎技術愛好者、前端開發初學者閱讀。

第一部分 小程式快速入門與實戰

第1章 雲開發快速入門 2
1.1 雲開發簡介 2
1.1.1 雲開發是什麼 2
1.1.2 為什麼要學習雲開發 3
1.2 專案的創建與配置 4
1.2.1 註冊微信小程式 4
1.2.2 開發者工具與雲開發文檔 5
1.2.3 創建雲開發範本小程式 7
1.2.4 雲開發專案初始化 9
1.2.5 兩個視覺化控制台 13
1.3 雲函數的配置與部署 16
1.3.1 雲函數的開發環境 16
1.3.2 部署並上傳雲函數 18
1.3.3 npm包管理器與依賴 19
1.3.4 體驗QuickStart小程式 20
1.4 開始一個雲開發專案 23
1.4.1 開始一個雲開發專案的準備回顧 23
1.4.2 雲開發QuickStart小程式改造 24
1.4.3 讓傳統小程式專案支援雲開發 24
1.4.4 雲函數的同步 25

第2章 小程式頁面開發 26
2.1 頁面結構與配置 26
2.1.1 檔結構和頁面組成 26
2.1.2 小程式的全域配置 27
2.1.3 新建小程式頁面 29
2.1.4 瞭解配置項的書寫方式 30
2.1.5 配置tabBar配置項 32
2.1.6 小程式的頁面配置 35
2.2 WXML與WXSS 36
2.2.1 編輯WXML檔 36
2.2.2 WXSS選擇器 38
2.2.3 CSS參考手冊 39
2.2.4 字體屬性與文字屬性 40
2.2.5 盒模型 42
2.3 連結和圖片 44
2.3.1 navigator組件 44
2.3.2 image組件 46
2.3.3 雲存儲 47
2.3.4 尺寸單位rpx 47
2.3.5 圖片的裁剪 48
2.3.6 背景屬性 49
2.3.7 圖片的邊框美化 50
2.3.8 view、navigator、image組件嵌套 51
2.4 WeUI 53
2.4.1 體驗WeUI小程式 53
2.4.2 WeUI的使用 55
2.4.3 Flex佈局 55
2.4.4 全域樣式與局部樣式 58
2.4.5 Flex樣式參考 58
2.4.6 使用WeUI美化文章排版 58
2.4.7 WeUI框架的核心與延伸 60
2.4.8 範本樣式的 改 61
2.5 數據綁定 62
2.5.1 把數據分離出來 63
2.5.2 數據類型 63
2.5.3 元件屬性的渲染 64
2.5.4 字串與數字 65
2.5.5 渲染數組裡的單條數據 65
2.5.6 渲染對象類型的數據 66
2.5.7 複雜的數據嵌套 67
2.6 列表渲染 69
2.6.1 渲染數組裡的所有數據 69
2.6.2 電影清單頁面 70
2.6.3 Grid九宮格樣式參考 72
2.6.4 List樣式參考 75
2.7 條件渲染 76
2.7.1 渲染的運算與邏輯判斷 76
2.7.2. 布耳運算的渲染 79
2.7.3 hidden的用法 81
2.7.4 多條件判斷與三元運算子 82
2.8 小程式的元件 83
2.8.1 元件的屬性 83
2.8.2 輪播效果 84
2.8.3 audio組件 85
2.8.4 video組件 86
2.8.5 cover效果 86
2.9 優化與部署 87
2.9.1 開發者工具的使用 87
2.9.2 小程式的轉發功能 89
2.9.3 小程式配置的細節 90
2.9.4 禁止頁面下拉 91
2.9.5 自訂頂部巡覽列 91
2.9.6 範本 92
2.9.7 小程式的客服 93
2.9.8 web-view 94

第3章 JavaScript基礎 95
3.1 JavaScript基礎入門 95
3.1.1 數學運算 95
3.1.2 Console.log輸出日誌 96
3.1.3 輸出數組 96
3.1.4 輸出對象 97
3.1.5 變數與賦值 97
3.1.6 操作數組 99
3.1.7 操作物件 100
3.1.8 常量 101
3.1.9 字串的操作 101
3.1.10 Math對象 102
3.1.11 Date對象 103
3.2 小程式API實戰 103
3.2.1 全域物件wx 103
3.2.2 控制台實戰小程式API 104
3.2.3 API的可用性判斷與許可權 107
3.3 按一下事件 109
3.3.1 頁面滾動 109
3.3.2 消息提示框Toast 111
3.3.3 模態對話方塊 112
3.3.4 手機振動 114
3.3.5 彈出操作功能表 115
3.3.6 頁面路由 116
3.4 頁面渲染 118
3.4.1 將變數值渲染到頁面 118
3.4.2 回應的數據綁定 120
3.4.3 回應的布林操作 121
3.4.4 回應的數組操作 122
3.4.5 currentTarget事件物件 123
3.5 攜帶數據與跨頁面渲染 125
3.5.1 連結攜帶數據 125
3.5.2 數據跨頁面 127
3.5.3 組件攜帶數據dataset 129
3.6 生命週期 131
3.6.1 構造器 131
3.6.2 生命週期函數 135
3.7 小程式函數與調用 138
3.7.1 函數與調用函數 138
3.7.2 匿名函數與箭頭函數 140
3.7.3 物件的方法 141
3.7.4 給構造器添加函數或數據變數 142
3.8 語法進階 145
3.8.1 範本字串 145
3.8.2 解構賦值 145
3.8.3 擴展運算子 146
3.8.4 回呼函數與回呼函數的寫法 147
3.8.5 模組化 149

第4章 雲函數入門 151
4.1 雲函數快速入門 151
4.1.1 雲函數的新建與調用 151
4.1.2 雲函數的初始化 155
4.1.3 開發者工具右鍵操作說明 157
4.2 本地調試與雲端測試 158
4.2.1 雲函數的開發流程 158
4.2.2 return與console 161
4.2.3 雲函數的監控 165
4.3 雲函數的調用與返回 166
4.3.1 雲函數的傳參與返回 166
4.3.2 不同調用方式下的event與context 168
4.3.3 main函數與return 171
4.4 雲函數的配置與進階 173
4.4.1 雲函數的環境變數 173
4.4.2 記憶體與超時時間 176
4.4.3 雲函數模組與實例複用 177
4.4.4 雲函數調用進階 179

第5章 雲數據庫入門 182
5.1 雲數據庫基礎知識 182
5.1.1 雲數據庫的基礎知識 182
5.1.2 數據庫的匯出與導入 184
5.2 雲數據庫快速上手 187
5.2.1 許可權的設置 187
5.2.2 小程式端調用數據庫 189
5.2.3. 雲函數端調用數據庫 190
5.2.4 獲取數據的寫法 191
5.3 數據查詢與統計 193
5.3.1 快速瞭解數據查詢 193
5.3.2 構建查詢準則的5個方法 194
5.3.3 統計記錄 196
5.3.4 數據查詢需要注意的問題 196
5.4 查詢操作符 198
5.4.1 查詢操作符基礎 198
5.4.2 比較操作符 200
5.4.3 邏輯操作符 201
5.4.4 欄位操作符 202
5.4.5 欄位字串的模糊查詢 203
5.5 操作集合裡的記錄 204
5.5.1 新增記錄add 204
5.5.2 刪除與 新多條記錄 206
5.6 操作記錄裡的欄位 208
5.6.1 許可權限制與替代寫法 208
5.6.2 操作單個記錄doc的欄位值 209
5.7 新操作符 212
5.7.1 新操作符介紹 213
5.7.2 使用 新操作符操作欄位 214
5.7.3 原子操作與高併發 214
5.8 數組的查詢 新操作符 215
5.8.1 查詢操作符和 新操作符一覽 215
5.8.2 查詢操作符和 新操作符 216
5.9 操作嵌套數組物件 219
5.9.1 普通數組和對象的查詢與 新 219
5.9.2 匹配和 新多重嵌套的數組和對象 221
5.9.3 新數組中所有匹配的元素之＄[] 222
5.9.4 新數組中第 一個匹配到的元素之＄ 224
5.10 數據庫變數處理 226
5.10.1 集合名、記錄_id、欄位值變數 226
5.10.2 數據庫請求的變數 227
5.10.3 欄位名稱為變數 228

第6章 彙總查詢 229
6.1 聚合快速入門 229
6.1.1 彙總查詢與普通數據查詢 229
6.1.2 聚合的基礎知識 231
6.1.3 雲數據庫命令與SQL語句對應理解 234
6.2 聚合階段 234
6.2.1 聚合階段介紹 234
6.2.2 聚合階段實戰 236
6.2.3 簡單的排名案例 245
6.3 操作符入門 246
6.3.1 算術操作符 247
6.3.2 累計器操作符 249

第二部分 雲開發專案實戰

第7章 雲存儲與相冊小程式 255
7.1 小程式端圖片操作 255
7.1.1 獲取手機相冊或拍照的圖片 256
7.1.2 操作圖片 259
7.1.3 保存圖片到相冊 261
7.2 小程式端檔操作 263
7.2.1 小程式端上傳檔 263
7.2.2 上傳地理位置 265
7.2.3 下載檔案 266
7.2.4 預覽文檔 268
7.2.5 保存檔與檔緩存 269
7.3 數據緩存Storage 271
7.3.1 將圖片存儲到緩存裡 271
7.3.2 將數據存儲到緩存裡 273
7.4 雲存儲快速入門 277
7.4.1 上傳檔到雲存儲 277
7.4.2 下載和刪除雲存儲裡的檔 280
7.4.3 雲函數上傳圖片到雲存儲 281
7.4.4 獲取檔在雲存儲的HTTPS連結 283
7.4.5 fileID是雲存儲與數據庫的紐帶 283
7.5 創建個人相冊 284
7.5.1 數據庫的設計與結構 284
7.5.2 UI與檔結構 286
7.5.3 建立用戶與數據的聯繫 288
7.5.4 獲取使用者資訊並存儲到數據庫 290
7.5.5 獲取相冊資料夾數據 293
7.6 相冊資料夾管理 295
7.6.1 相冊資料夾的表現形式 295
7.6.2 相冊/資料夾的渲染 298
7.6.3 UI交互與相冊/資料夾的創建 300
7.7 照片文件管理 303
7.7.1 數組的索引與交互 303
7.7.2 上傳單個文件到資料夾 304

第8章 前後端交互與博客小程式 308
8.1 網路API 308
8.1.1 數據API 309
8.1.2 小程式端獲取網路數據 310
8.1.3 雲函數端獲取數據 312
8.2 渲染網路數據到頁面 313
8.2.1 將數據渲染到頁面 313
8.2.2 詳情頁數據渲染 315
8.2.3 HTML標籤解析rich-text 317
8.2.4 跨頁面數據渲染 317
8.3 文章列表與詳情頁 317
8.3.1 數據庫的範式化設計 317
8.3.2 聯表與跨表 321
8.4 用戶與文章交互 325
8.4.1 訪問數據與文章流覽量 325
8.4.2 數據一致性與緩存 327
8.4.3 收藏數與用戶收藏 330

第9章 表單與問卷小程式 332
9.1 表單的基礎知識 332
9.1.1 設置巡覽列標題 333
9.1.2 文本輸入框input 335
9.1.3 添加手機連絡人 336
9.1.4 input綁定事件處理函數 338
9.1.5 剪貼板 339
9.2 表單元件與組合 341
9.2.1 表單組件快速入門 341
9.2.2 slider回應設置顏色 345
9.2.3 picker組件 346
9.3 表單的提交與渲染 349
9.3.1 表單數據的提交 349
9.3.2 表單的渲染 354
9.4 問卷小程式 356
9.4.1 問卷的數據庫設計 356
9.4.2 不同類型題目的渲染與提交 358

第三部分 雲開發進階

第10章 用雲函數實現後端能力 363
10.1 雲函數的模組知識 363
10.1.1 Node.js的內置模組 363
10.1.2 Node的全域物件 364
10.1.3 wx-server-sdk的模組 367
10.1.4 協力廠商模組 367
10.1.5 雲函數的運行機制 368
10.2 檔案系統的操作 369
10.2.1 讀取雲函數服務端的檔 369
10.2.2 檔操作模組介紹 370
10.2.3操作臨時磁碟空間 372
10.2.4 雲函數與Buffer 373
10.3 雲函數實用工具庫 375
10.3.1 時間處理 375
10.3.2 加解密Crypto 377
10.3.3 lodash實用工具庫 378
10.4 Excel文檔處理 379
10.4.1 讀取雲存儲的Excel檔 379
10.4.2 將數據庫裡的數據保存為CSV 381
10.4.3 導入Excel 多數據的解決方法 383
10.4.4 將Excel文件一鍵轉成雲數據庫的json文件 384
10.5 HTTP處理 385
10.5.1 get請求 386
10.5.2 post請求 387
10.5.3 使用axios下載檔案 388
10.6 雲函數路由tcb-router 389
10.6.1 tcb-router快速入門 389
10.6.2 tcb-router管理數據庫的增刪改查 391

第11章 雲數據庫的高階用法 395
11.1 數據庫的管理 395
11.1.1 控制台數據庫 操作 395
11.1.2 數據庫腳本的實際應用 396
11.1.3 數據庫的導入匯出 398
11.1.4 使用回檔進行數據備份 399
11.2 安全規則 400
11.2.1 {openid}變數 400
11.2.2 安全規則的寫法 402
11.2.3 身份驗證 405
11.2.4 安全規則常用場景 409
11.2.5 數據驗證doc的規則匹配 410
11.3 數據庫的設計 413
11.3.1 數據庫的設計 413
11.3.2 反範式化與範式化設計 414
11.3.3 內嵌文檔（內嵌數組或對象） 416
11.3.4 引用文檔 418
11.3.5 數據庫設計的注意事項 421
11.4 索引 423
11.4.1 索引的類型與管理 424
11.4.2 索引的創建說明 426
11.4.3 索引的原則與注意事項 427
11.5 數據庫性能與優化 429
11.5.1 數據庫性能與優化建議 429
11.5.2 數據庫設計以及處理的優化建議 434
11.5.3 慢查詢與告警 436

第12章 雲調用 438
12.1 雲調用快速入門 438
12.1.1 雲調用基礎 438
12.1.2 雲函數的設定檔 439
12.2 定時觸發器 440
12.2.1 定時觸發器使用說明 441
12.2.2 用定時觸發器調用雲函數 443
12.2.3 定時觸發器的應用 445
12.3 訂閱消息 447
12.3.1 獲取訂閱消息授權 447
12.3.2 發送訂閱消息方式說明 454
12.3.3 使用雲調用發送訂閱消息 457
12.3.4 使用定時觸發器發訂閱消息 461
12.4 CloudID 461
12.4.1 獲取微信步數 462
12.4.2 獲取用戶手機號 463
12.4.3 獲取微信群ID和群名稱 464
12.5 客服消息 468
12.5.1 客服消息的配置與說明 469
12.5.2 自動回復文本消息和連結 470
12.5.3 自動觸發event事件 474
12.5.4 自動回復圖片 475
12.6 微信支付 477
12.6.1 雲支付快速入門 477
12.6.2 查詢訂單與申請退款 481
12.6.3 支付成功的回呼函數 483