2024秋軟體工程結對作業（第二次之程式實現）

Kk陈亮腾發表於2024-10-10

這個作業屬於哪個課程	https://edu.cnblogs.com/campus/fzu/SE2024
這個作業要求在哪裡	https://edu.cnblogs.com/campus/fzu/SE2024/homework/13281
這個作業的目標	根據前一次作業中設計的原型，合作開發一個微信小程式“CrossCollab”
學號	102201211
結對成員學號	102201317
我的部落格連結	https://www.cnblogs.com/chijiayi
partner部落格連結	https://www.cnblogs.com/qingmu177
GitHub專案地址	https://github.com/Co-kein/102201211-102201317/tree/main/CrossCollab

📝一. 具體分工
⏳二. PSP表格
個人開發流程 (PSP) 表格
💡 三. 解題思路與設計實現說明
- 3.1 微信小程式實現思路與程式碼結構描述
  - 1. 開始介面
  - 2. 註冊模組
  - 3. 登入模組
  - 4. 主頁
  - 5. 專案模組
  - 6. 團隊模組
  - 7. 我的模組
  - 8. 論壇模組
  - 9. 後端支援
- 3.2 專案流程圖
- 3.3 重要的程式碼片段
  - 3.3.1“我的”介面
  - 3.3.2 “釋出專案”介面
🚀 四. 附加特點展示
- - - 一、
    - - 獨到之處和意義:
    - 小程式中的論壇功能為學生提供了一個跨專業合作的平臺，能夠迅速連線來自不同領域的學生，解決人脈不足和合作資源匱乏的問題。學生可以透過論壇釋出專案需求或尋找合作伙伴的帖子，詳細描述專案型別和所需技能，方便精準匹配。這樣，設計、程式設計、市場營銷等不同專業的學生可以直接對接，提升專案合作的效率。
    - 透過實時更新的發帖功能，使用者可以即時檢視最新的合作機會，減少了錯失重要專案的可能性。即時的互動和回應增強了論壇的活躍度和實用性。
    - - 實現思路：
    - 使用WXML和WXSS進行前端佈局，採用卡片式設計來展示不同的帖子，確保使用者能夠輕鬆瀏覽和查詢合作機會。“發帖”按鈕使用固定定位，使使用者能夠隨時發起討論，保持操作便捷。
    - - 效果展示：
    - - 程式碼展示：
    - 二、
    - - 獨到之處和意義:
    - 隱私設定允許使用者自定義資訊的可見範圍（如本車級、本院系、本班級、不限），使用者可以根據不同的合作需求和隱私偏好來選擇最適合的展示範圍。這一功能讓使用者在資訊保安與合作便利之間找到平衡。
    - 使用者另外可以自行選擇是否接收新訊息通知，從而控制資訊推送的頻率和內容，避免不必要的打擾。這使得使用者能夠更自由地管理自己參與論壇討論的頻次和深度。
    - 使用者能夠透過隱私設定完全掌控自己的個人資訊展示，避免了傳統社交平臺中隱私資訊可能被不當使用的問題，這讓使用者在選擇合作伙伴時更加放心。
    - - 實現思路：
    - 使用WXML和WXSS來構建介面佈局和開關按鈕的樣式，使使用者操作簡單直觀。透過開關元件，使用者可以快速啟用或禁用對應的隱私選項。
    - - 效果展示：
    - - 程式碼展示：
📊五. 目錄說明和使用說明
- 5.1 目錄說明
- 5.2 執行說明
📑六. 單元測試
- 測試工具
  - - - - 1.我們選用 Jest 作為測試框架，它支援 JavaScript 和 Node.js 環境，功能強大，整合方便。Jest 提供的自動模擬和非同步測試功能適合測試微信小程式的前端邏輯。
      - - 2.微信開發者工具提供了基礎的除錯和資料模擬功能，可以用來測試前端檢視層的互動效果。
- 測試學習教材
  - - - 學習單元測試的步驟如下：
      - - 瞭解測試框架的基礎：透過閱讀 Jest 和 Mocha 的官方文件，例如Jest測試學習熟悉如何編寫測試、配置測試環境和執行測試。
      - - 編寫簡單測試用例：從專案中最基本的函式或模組入手，編寫簡單的單元測試用例，逐步掌握測試程式碼的書寫方式。
      - - 測試與除錯：透過反覆測試和除錯，瞭解如何透過模擬資料和斷言來檢測程式碼行為，並不斷最佳化程式碼邏輯。
      - - 學習測試用例設計：學習如何覆蓋不同的輸入和邊界條件，提高測試用例的覆蓋率。
- 具體測試
  - - - 被測函式：validatePhoneNumber
      - 功能：用於驗證輸入的手機號是否符合標準格式（例如，11位數字，且符合手機號的規範。
      - 測試程式碼示例：
- 構造思路
  - - - 覆蓋常規情況：首先構造符合標準格式的手機號碼，確保基本功能正常。
      - 邊界測試：測試手機號長度不符或以錯誤字首開頭的情況，例如少於 11 位或字首不符合規則。
      - 異常輸入測試：考慮到使用者可能誤輸入非數字字元，我們新增非數字字元的測試用例。
      - 無效輸入處理：新增空輸入、null、undefined 等情況，以確保函式的魯棒性。
- 考慮未來測試的挑戰
  - - - 為了應對將來測試人員的嚴格測試，增加了以下考慮：
      - 測試覆蓋率：確保單元測試覆蓋常規情況、邊界情況和異常情況，減少漏測。
      - 資料多樣性：構造多種格式的資料，包括有效和無效格式，甚至一些極端的輸入，以確保函式健壯性。
      - 模組化設計：確保每個函式單一職責，方便測試，避免因過多依賴而導致測試困難。
      - 異常處理：考慮到測試人員可能會提供非預期輸入（如空值、特殊字元等），我們在函式中加入了異常處理機制，並測試這些輸入。
📁 七. Github程式碼簽入記錄截圖
🧪八. 程式碼模組異常及解決方法
- 8.1 程式碼模組異常
  - 1. 未找到app.json錯誤
  - 2. 雲函式呼叫錯誤
  - 3. JSON檔案格式錯誤
- 8.2 結對困難
  - 1. 跨團隊協作
  - 2. 模組劃分不明確
  - 3. 效能最佳化
- 8.3 其他常見異常及解決方法
  - 1. iOS系統音訊播放問題
  - 2. 頁面跳轉白屏
  - 3. 檔案型別限制
✅九. 隊友互評
- - - - 一、值得學習的地方
      - 二、需要改進的地方
      - 三、總結

📝一. 具體分工

陳磊	池家益
登入、註冊介面程式碼開發	專案、團隊介面程式碼開發
"首頁"介面、"團隊"介面等設計	設計"我的"頁面、"論壇"頁面的發帖、帖子佈局
小程式整體佈局設計	"團隊介面"設計
預估任務時間	設計複審
測試	測試報告,修改程式碼
查詢圖片素材	程式碼的潤色
程式碼異常處理	總結

⏳二. PSP表格

個人開發流程 (PSP) 表格

階段	預估耗時（小時）	實際耗時（小時）
計劃	2	2
估計	2	1.5
開發	12	13
需求分析	2	2.5
生成設計文件	1.5	1.8
設計複審	2	1.5
程式碼規範	3	4
具體設計	2	2
具體編碼	5	7
程式碼複審	2	1.5
測試	1.5	1
報告	2	2.5
測試報告	2	1.5
事後總結及過程改進計劃	1	2
合計	4.	43.8

💡 三. 解題思路與設計實現說明

3.1 微信小程式實現思路與程式碼結構描述

1. 開始介面

功能描述：作為小程式的啟動頁，提供“註冊”和“登入”兩個選項。
實現思路：在 app.js 中設定啟動邏輯，並跳轉到 pages/start 頁面，根據使用者選擇的功能跳轉到註冊或登入頁面。

2. 註冊模組

功能描述：使用者透過手機號註冊，輸入驗證碼、設定密碼，填寫個人資訊。
實現思路：
- 手機號驗證：使用微信小程式的簡訊驗證服務，確保使用者手機的真實性。
- 個人資訊填寫：包含使用者的專業、興趣和技能等，以便在後續推薦合適的專案和團隊。
- 程式碼描述：pages/register 目錄下的 .wxml 檔案用於輸入框和按鈕的佈局，.js 檔案處理表單提交和校驗邏輯。

3. 登入模組

功能描述：使用者輸入手機號和密碼登入，跳轉到主頁。
實現思路：
- 登入驗證：連線伺服器進行登入資訊驗證。
- 跳轉邏輯：登入成功後，將使用者跳轉到主頁。
- 程式碼描述：pages/login 目錄下的 .js 檔案包含登入表單的提交和伺服器的請求邏輯。

4. 主頁

功能描述：主頁是導航的中心，包括“搜尋專案”、“搜尋團隊”、“釋出專案”等。
實現思路：
- 搜尋功能：根據使用者輸入的關鍵字，呼叫後臺的介面獲取匹配的專案或團佇列表。
- 推薦專案：根據使用者的專業、興趣等推薦適合的跨專業合作專案。
- 程式碼描述：主頁的 .wxml 檔案用於展示導航選單，.js 檔案處理導航邏輯。

5. 專案模組

功能描述：使用者可以搜尋專案、釋出專案、加入專案。
實現思路：
- 搜尋專案：根據使用者的關鍵詞查詢資料庫，返回匹配的專案。
- 釋出專案：使用者可以輸入專案需求和描述資訊，提交後儲存到資料庫。
- 加入專案：根據專案需求，提供申請加入的選項，等待專案發起人的稽核。
- 程式碼描述：pages/project 目錄包含釋出、搜尋、專案詳情等子頁面，每個頁面有獨立的 .wxml 和 .js 檔案，負責資料展示和互動邏輯。

6. 團隊模組

功能描述：使用者可以搜尋團隊、檢視團隊資訊、加入團隊。
實現思路：
- 團隊搜尋：根據使用者輸入的關鍵詞，返回匹配的團隊資訊。
- 加入團隊：使用者可以申請加入團隊，團隊成員可以稽核申請。
- 程式碼描述：pages/team 目錄下包含團佇列表和團隊詳情頁面的 .wxml 檔案和 .js 檔案，處理資料展示、加入團隊申請等邏輯。

7. 我的模組

功能描述：展示使用者的收藏、加入的專案和團隊、動態、論壇和隱私設定。
實現思路：
- 我的收藏：顯示使用者收藏的專案和團隊。
- 我的專案和團隊：展示使用者加入的專案和團隊。
- 論壇：使用者可以發帖交流合作經驗或問題。
- 隱私設定：控制個人資訊的公開範圍。
- 程式碼描述：pages/my 目錄下包含不同功能頁面的 .wxml 和 .js 檔案，處理使用者資訊展示和互動操作。

8. 論壇模組

功能描述：使用者可以在論壇中發帖和交流。
實現思路：提供發帖、回帖、搜尋帖子等功能。
程式碼描述：pages/forum 目錄包含發帖和帖子詳情頁面的程式碼，負責發帖邏輯和回覆展示。

9. 後端支援

實現思路：所有資料互動（如專案和團隊資訊、使用者資料等）透過後端介面實現。
程式碼描述：可以在 utils/util.js 中編寫通用的請求方法，簡化程式碼的可讀性和複用性。

這些模組透過前端頁面佈局（.wxml 檔案）、樣式（.wxss 檔案）和邏輯（.js 檔案）實現，配合後端資料庫和 API，滿足校園跨專業合作的需求。每個頁面實現了資訊查詢、申請加入和動態釋出等功能，幫助學生找到合適的合作伙伴和專案資源。

3.2 專案流程圖

3.3 重要的程式碼片段

3.3.1“我的”介面

<view class="container">
  <!-- 使用者資訊 -->
  <view class="user-info" bindtap="onGoToPersonalInfo">
    <image class="user-avatar" src="/image/user.jpg" mode="aspectFill"></image>
    <text class="user-name">不想上學</text>
    <text class="user-major">大三 | 計算機類</text>
  </view>

  <!-- 功能按鈕 -->
  <view class="function-buttons">
    <view class="function-button" bindtap="onGoToForum">
      <image class="icon" src="/image/論壇.jpg" mode="aspectFill" />
      <text>論壇</text>
    </view>
    <view class="function-button" bindtap="onGoToCollect">
      <image class="icon" src="/image/收藏.png" mode="aspectFill" />
      <text>我的收藏</text>
    </view>
    <view class="function-button" bindtap="onGoToBrowserHistory">
      <image class="icon" src="/image/瀏覽記錄.jpg" mode="aspectFill" />
      <text>最近瀏覽</text>
    </view>
  </view>

  <!-- 常用功能 -->
  <view class="common-functions">
    <view class="function-item" bindtap="onGoToPersonalInfo">
      <image class="arrow" src="/image/個人資訊.png" />
      <text>個人資訊</text>
    </view>
    <view class="function-item" bindtap="onGoToDynamics">
      
      <image class="arrow" src="/image/動態.png" />
      <text>我的動態</text>
    </view>
    <view class="function-item" bindtap="onGoToProjects">
      
      <image class="arrow" src="/image/團隊.jpg" />
      <text>我的團隊</text>
    </view>
    <view class="function-item" bindtap="onGoToSettings">
      
      <image class="arrow" src="/image/隱私.jpg" />
      <text>隱私設定</text>
    </view>
    <view class="function-item" bindtap="onGoToAgreement">
      
      <image class="arrow" src="/image/協議.png" />
      <text>使用者協議</text>
    </view>

  </view>
</view>

這段程式碼透過組合不同的檢視、圖片和文字元素，以及利用bindtap屬性繫結點選事件，構建了一個具有使用者資訊展示、功能按鈕和常用功能列表的頁面佈局。使用者可以透過點選不同的部分來觸發相應的操作，如檢視個人資訊、進入論壇、檢視收藏等。

3.3.2 “釋出專案”介面

<view class="container">
  <text class="title">專案發起</text>

  <view class="form-item">
    <text>專案名稱</text>
    <input class="form-input" placeholder="輸入專案名稱" />
  </view>

  <view class="form-item">
    <text>專案型別</text>
    <picker mode="selector" range="{{projectTypes}}" bindchange="onTypeChange">
      <view class="picker">
        {{selectedType}}
      </view>
    </picker>
  </view>

  <view class="form-item">
    <text>年級限制</text>
    <input class="form-input" placeholder="輸入年級限制" />
  </view>

  <view class="form-item">
    <text>所需技能</text>
    <view class="skills-container">
      <view class="skill" wx:for="{{skills}}" wx:key="index">{{item}}<text class="remove-skill" bindtap="removeSkill" data-skill="{{item}}">×</text></view>
      <input class="form-input" placeholder="新增技能" bindinput="onAddSkill" />
      <button class="add-skill" bindtap="addSkill">+</button>
    </view>
  </view>

  <view class="form-item">
    <text>所需人才</text>
    <view class="talents-container">
      <view class="talent" wx:for="{{talents}}" wx:key="index">{{item}}<text class="remove-talent" bindtap="removeTalent" data-talent="{{item}}">×</text></view>
      <input class="form-input" placeholder="新增人才" bindinput="onAddTalent" />
      <button class="add-talent" bindtap="addTalent">+</button>
    </view>
  </view>

  <view class="form-item">
    <text>專案描述</text>
    <textarea class="form-textarea" placeholder="輸入專案描述"></textarea>
  </view>

  <view class="button-container">
    <button class="cancel-button" bindtap="onCancel">取消</button>
    <button class="create-button" bindtap="onCreate">建立</button>
  </view>
</view>

這段程式碼構建了一個包含多個表單項的頁面，用於收集使用者發起新專案時所需的資訊，如專案名稱、型別、年級限制、所需技能和人才，以及專案描述。使用者可以透過輸入框、選擇器和動態列表來填寫這些資訊，並透過點選“取消”或“建立”按鈕來放棄或提交表單。

🚀 四. 附加特點展示

一、

- 獨到之處和意義:

小程式中的論壇功能為學生提供了一個跨專業合作的平臺，能夠迅速連線來自不同領域的學生，解決人脈不足和合作資源匱乏的問題。學生可以透過論壇釋出專案需求或尋找合作伙伴的帖子，詳細描述專案型別和所需技能，方便精準匹配。這樣，設計、程式設計、市場營銷等不同專業的學生可以直接對接，提升專案合作的效率。

透過實時更新的發帖功能，使用者可以即時檢視最新的合作機會，減少了錯失重要專案的可能性。即時的互動和回應增強了論壇的活躍度和實用性。

- 實現思路：

使用WXML和WXSS進行前端佈局，採用卡片式設計來展示不同的帖子，確保使用者能夠輕鬆瀏覽和查詢合作機會。“發帖”按鈕使用固定定位，使使用者能夠隨時發起討論，保持操作便捷。

- 效果展示：

- 程式碼展示：

  <!-- 搜尋欄 -->
  <view class="search-bar">
    <input type="text" placeholder="輸入搜尋關鍵詞" class="search-input" />
    <button class="search-btn" bindtap="handleSearch">發帖</button>
  </view>

  <!-- 帖子列表 -->
  <block wx:for="{{posts}}" wx:key="id">
    <view class="post">
      <view class="post-header">
        <image class="avatar" src="{{item.avatar}}" mode="aspectFill"></image>
        <view class="header-right">
          <text class="name">{{item.name}}</text>
          <text class="time">{{item.time}}</text>
        </view>
      </view>
      <view class="post-content">
        <block wx:for="{{item.content}}" wx:key="index">
          <text class="content-line">{{item}}</text>
        </block>
      </view>
    </view>
  </block>
</view>

二、

- 獨到之處和意義:

隱私設定允許使用者自定義資訊的可見範圍（如本車級、本院系、本班級、不限），使用者可以根據不同的合作需求和隱私偏好來選擇最適合的展示範圍。這一功能讓使用者在資訊保安與合作便利之間找到平衡。

使用者另外可以自行選擇是否接收新訊息通知，從而控制資訊推送的頻率和內容，避免不必要的打擾。這使得使用者能夠更自由地管理自己參與論壇討論的頻次和深度。

使用者能夠透過隱私設定完全掌控自己的個人資訊展示，避免了傳統社交平臺中隱私資訊可能被不當使用的問題，這讓使用者在選擇合作伙伴時更加放心。

- 實現思路：

使用WXML和WXSS來構建介面佈局和開關按鈕的樣式，使使用者操作簡單直觀。透過開關元件，使用者可以快速啟用或禁用對應的隱私選項。

- 效果展示：

- 程式碼展示：

  <view class="header">
    <text class="title">隱私設定</text>
  </view>

  <view class="section">
    <view class="section-item">
      <text class="section-title">個人名片</text>
      <switch class="switch-control" checked="{{true}}"></switch>
      <text class="description">開啟後，所有人都可檢視你的個人資訊。</text>
    </view>

    <view class="section-title">可見資訊設定</view>
    <view class="section-item">
      <text class="info-label">手機號</text>
      <switch class="switch-control"></switch>
    </view>
    <view class="section-item">
      <text class="info-label">郵箱</text>
      <switch class="switch-control"></switch>
    </view>
    <view class="section-item">
      <text class="info-label">專業</text>
      <switch class="switch-control"></switch>
    </view>
    <view class="section-item">
      <text class="info-label">班級</text>
      <switch class="switch-control"></switch>
    </view>
    <view class="section-item">
      <text class="info-label">專案經歷</text>
      <switch class="switch-control"></switch>
    </view>

    <view class="section">
      <text class="section-title">可見範圍</text>
      <radio-group class="radio-group">
        <label class="radio-label">
          <radio value="本車級" checked="true"></radio> 本車級
        </label>
        <label class="radio-label">
          <radio value="本院系"></radio> 本院系
        </label>
        <label class="radio-label">
          <radio value="本班級"></radio> 本班級
        </label>
        <label class="radio-label">
          <radio value="不限"></radio> 不限
        </label>
      </radio-group>
    </view>

    <view class="section-item">
      <text class="info-label">新訊息通知</text>
      <switch class="switch-control" checked="{{true}}"></switch>
      <text class="description">關閉後，將不再接收新的訊息通知。</text>
    </view>
  </view>
</view>

📊五. 目錄說明和使用說明

5.1 目錄說明

檔案目錄	說明
app.json	# 小程式的全域性配置檔案，定義頁面路徑、視窗樣式等
image	# 存放小程式中使用的圖片資源
pages	# 小程式的主要頁面目錄，每個頁面有獨立的資料夾
│ start	# 啟動頁面，包括登入和註冊的選項
│ register	# 註冊頁面，包含手機號輸入、驗證碼、密碼設定和個人資訊填寫
│ login	# 登入頁面，使用者輸入手機號和密碼進行登入
│ home	# 主頁，提供搜尋專案、推薦專案等導航功能
│ project	# 專案模組，包含專案搜尋、釋出、加入等功能頁面
team	# 團隊模組，支援團隊搜尋、檢視團隊、加入團隊等操作
│ my	# 我的頁面，展示使用者的收藏、已加入的專案和團隊等
│ forum	# 論壇模組，使用者可以發帖和回帖，參與社群交流
utils	# 工具資料夾，包含通用函式和請求處理
│ util.js	# 工具檔案，包含封裝的請求函式和其他常用方法
project.config.json	# 小程式的專案配置檔案，用於定義開發環境的相關設定
project.private.config.json	# 私有配置檔案，用於儲存敏感資訊
sitemap.json	# 站點地圖配置，方便小程式的 SEO 最佳化
.gitignore	# Git 忽略檔案，定義不需要納入版本控制的檔案

5.2 執行說明

由於程式碼檔案過大無法直接生成二維碼等問題，故需測試人員下載IDE進行測試，給您帶來帶來不便，還請見諒
（一）首先進入網址https://mp.weixin.qq.com
（二）點選賬號分類中的小程式，按步驟註冊登入賬號
（三）點選左欄的開發者工具，點選下載
（四）下載如圖所示的版本
（五）最後匯入解壓後的資料夾
（六）匯入後點選關閉，左欄直接對進行小程式測試（編譯較慢等待幾秒）

📑六. 單元測試

測試工具

- 1.我們選用 Jest 作為測試框架，它支援 JavaScript 和 Node.js 環境，功能強大，整合方便。Jest 提供的自動模擬和非同步測試功能適合測試微信小程式的前端邏輯。

- 2.微信開發者工具提供了基礎的除錯和資料模擬功能，可以用來測試前端檢視層的互動效果。

測試學習教材

學習單元測試的步驟如下：

- 瞭解測試框架的基礎：透過閱讀 Jest 和 Mocha 的官方文件，例如Jest測試學習熟悉如何編寫測試、配置測試環境和執行測試。

- 編寫簡單測試用例：從專案中最基本的函式或模組入手，編寫簡單的單元測試用例，逐步掌握測試程式碼的書寫方式。

- 測試與除錯：透過反覆測試和除錯，瞭解如何透過模擬資料和斷言來檢測程式碼行為，並不斷最佳化程式碼邏輯。

- 學習測試用例設計：學習如何覆蓋不同的輸入和邊界條件，提高測試用例的覆蓋率。

具體測試

被測函式：validatePhoneNumber

功能：用於驗證輸入的手機號是否符合標準格式（例如，11位數字，且符合手機號的規範。

測試程式碼示例：

function validatePhoneNumber(phone) {
  const phoneRegex = /^1[3-9]\d{9}$/;
  return phoneRegex.test(phone);
}
module.exports = { validatePhoneNumber };

構造思路

覆蓋常規情況：首先構造符合標準格式的手機號碼，確保基本功能正常。

邊界測試：測試手機號長度不符或以錯誤字首開頭的情況，例如少於 11 位或字首不符合規則。

異常輸入測試：考慮到使用者可能誤輸入非數字字元，我們新增非數字字元的測試用例。

無效輸入處理：新增空輸入、null、undefined 等情況，以確保函式的魯棒性。

考慮未來測試的挑戰

為了應對將來測試人員的嚴格測試，增加了以下考慮：

測試覆蓋率：確保單元測試覆蓋常規情況、邊界情況和異常情況，減少漏測。

資料多樣性：構造多種格式的資料，包括有效和無效格式，甚至一些極端的輸入，以確保函式健壯性。

模組化設計：確保每個函式單一職責，方便測試，避免因過多依賴而導致測試困難。

異常處理：考慮到測試人員可能會提供非預期輸入（如空值、特殊字元等），我們在函式中加入了異常處理機制，並測試這些輸入。

📁 七. Github程式碼簽入記錄截圖

🧪八. 程式碼模組異常及解決方法

8.1 程式碼模組異常

1. 未找到app.json錯誤

問題描述：在執行程式碼時，開發者工具提示未找到app.json檔案。
解決方法：
- 確保app.json檔案存在於專案的根目錄中。
- 若在匯入專案時遇到此問題，嘗試在project.config.json中新增miniprogramRoot屬性，指向包含app.json的目錄。

2. 雲函式呼叫錯誤

問題描述：呼叫雲函式時可能遇到錯誤碼，如-404011，表示雲函式執行出錯。
解決方法：
- 確保雲函式已成功部署，並檢查部署狀態。
- 若建立了多個雲開發環境，確保選擇了正確的環境ID。

3. JSON檔案格式錯誤

問題描述：JSON檔案中可能出現格式錯誤，如缺少逗號、引號不匹配等。
解決方法：
- 仔細檢查JSON檔案格式，確保所有鍵和值被正確引號包圍，鍵值對之間用逗號分隔。
- 使用線上JSON格式校驗工具幫助檢查和修正錯誤。

8.2 結對困難

1. 跨團隊協作

問題描述：多人協作開發小程式時，可能遇到程式碼衝突、版本不一致等問題。
解決方法：
- 使用版本控制系統（如Git）管理程式碼，確保團隊成員間程式碼同步和合並。
- 定期進行程式碼審查，及時發現和修復問題。

2. 模組劃分不明確

問題描述：開發過程中，可能因模組劃分不明確導致程式碼結構混亂、難以維護。
解決方法：
- 專案開始前進行詳細的模組劃分和設計，明確每個模組的功能和職責。
- 使用合理的目錄結構和命名規範組織程式碼。

3. 效能最佳化

問題描述：小程式執行時可能出現載入速度慢、執行卡頓等問題。
解決方法：
- 最佳化程式碼，減少不必要的資源請求和計算。
- 合理利用快取，提高程式碼執行效率。
- 使用效能分析工具監控和最佳化小程式效能。

8.3 其他常見異常及解決方法

1. iOS系統音訊播放問題

問題描述：iOS系統上，小程式需使用者主動觸發才能播放音訊。
解決方法：在頁面上新增按鈕，讓使用者點選後觸發音訊播放。

2. 頁面跳轉白屏

問題描述：頁面跳轉時可能出現白屏現象，通常因頁面載入過慢導致。
解決方法：
- 使用分包載入或最佳化頁面程式碼，減少頁面載入時間。
- 對重要頁面資源進行壓縮或使用CDN加速。

3. 檔案型別限制

問題描述：小程式對檔案型別有嚴格限制，如圖片只支援PNG、JPG、GIF等格式。
解決方法：
- 檢查檔案格式是否符合小程式支援列表。
- 若格式不正確，轉換為小程式支援的檔案格式。

✅九. 隊友互評

一、值得學習的地方

隊友在程式碼編寫方面非常嚴謹，程式碼結構清晰，模組劃分合理，註釋詳細。這種良好的編碼習慣使程式碼更具可讀性和維護性，值得我在日常開發中學習。
隊友在專案開發中不斷學習新知識，主動承擔關鍵的技術實現任務，並樂於探索新的解決方法。這種積極主動的態度，提高了專案開發效率。

二、需要改進的地方

在一些複雜邏輯的實現上，程式碼可以進一步簡化和最佳化，以減少重複程式碼、提高執行效率。這將使程式碼更具可維護性，也有助於降低後期除錯和更新的難度。可以考慮學習一些程式碼重構的方法，以實現更優雅的程式碼結構。
雖然隊友已完成部分單元測試，但在一些邊界條件和異常情況下的測試用例還可以更全面。這不僅能提高程式碼的可靠性，也能防止潛在的 bug。在未來的專案中，建議隊友可以進一步研究測試框架的高階用法，增加測試覆蓋率，確保程式碼的健壯性。

三、總結

總體來說，隊友在專案中的表現非常優秀，既有紮實的技術能力，也展現了出色的溝通和團隊合作精神。他在開發中展現出的責任感和主動學習的態度，值得我在今後的專案中學習和借鑑。希望在未來的合作中，隊友能夠在程式碼最佳化、單元測試和版本管理等方面繼續提升，相信他會成為更為優秀的開發者。

2024秋軟體工程第二次結對作業之程式實現
2024-10-10
軟體工程
2024秋軟體工程結對作業（第一次之需求分析和原型設計）
2024-09-27
軟體工程原型
2024秋軟體工程現場程式設計作業
2024-11-02
軟體工程程式設計
2024秋軟體工程iman現場程式設計作業
2024-11-02
軟體工程程式設計
2024秋軟體工程個人作業（第二次）
2024-09-18
軟體工程
2024秋軟體工程課程個人作業（第二次）
2024-09-18
軟體工程
軟體工程結對第二次作業
2024-10-10
軟體工程
軟體工程第二次結對作業
2024-10-10
軟體工程
2024秋軟體工程個人作業（第一次）
2024-09-07
軟體工程
軟體工程第二次結隊作業
2024-10-10
軟體工程
2024秋軟體工程課程個人作業（第一次）
2024-09-05
軟體工程
軟體工程第二次作業任務總結
2024-04-09
軟體工程
軟工工程第二次結對作業《Fzu-help》
2024-10-10
軟工
第二次軟體工程作業
2024-04-04
軟體工程
軟體工程第二次作業
2024-10-09
軟體工程
軟體工程第二次個人作業
2024-09-18
軟體工程
軟體工程作業
2024-05-14
軟體工程
軟工第二次結對作業
2024-10-10
軟工
2024軟體工程第一次作業
2024-09-06
軟體工程
軟體工程第二次作業（原型設計）
2019-03-07
軟體工程原型
軟工實踐第三次作業（結對第二次作業）
2019-03-15
軟工
軟工實踐第二次作業（結對第一次作業）
2019-03-08
軟工
軟體工程作業2
2024-04-10
軟體工程
軟體工程作業5
2024-05-16
軟體工程
軟體工程作業13
2024-05-29
軟體工程
軟體工程單元測試作業總結
2024-04-10
軟體工程
軟體工程-單人任務-第二次作業
2024-04-10
軟體工程
個人專案(軟體工程第二次作業)
2024-03-13
軟體工程
軟體工程第二次作業 3121002015 劉增榮
2024-03-16
軟體工程
2024軟體工程第一次個人作業
2024-09-08
軟體工程
軟體工程案例分析作業
2021-04-04
軟體工程
軟體工程第一次結隊作業
2024-09-27
軟體工程
第二次結對作業
2024-10-10
軟體工程-團隊作業4
2024-04-20
軟體工程
軟體工程課程小作業
2020-10-01
軟體工程
【軟體工程】團隊作業1
2024-10-16
軟體工程
軟體工程第一次結對作業之需求分析和原型設計
2024-09-27
軟體工程原型
2024軟體工程部落格園第一次作業
2024-09-04
軟體工程