今天接續昨天整合的過程 , 先讓我的database.py生成sql文件 , 再讓codex讀生成的sql文件 , 寫入變數到html對應的欄位 , 終於成功了
| 難點描述 (Difficulty) | 解決方式 (Solution) | 來源 |
|---|---|---|
| 【Flask/Vertex AI 模組與除錯】 | ||
匯入套件失敗：ImportError: cannot import name 'storage' from 'google.cloud' (誤裝空殼套件 google-cloud) |
卸載錯誤套件 (pip uninstall google-cloud -y)，並安裝正確的子套件 (pip install google-cloud-storage google-cloud-aiplatform)。 |
|
權限問題：程式嘗試建立 /srv/esp32-ads 目錄時發生 PermissionError: [Errno 13] Permission denied |
選擇一：使用 sudo 建立目錄並修改權限 (sudo mkdir -p & sudo chown)。選擇二：改存放路徑到專案資料夾 (如 ~/esp32-new/ads/)。 |
|
前端請求 /ad/latest/stream 但後端沒有對應的路由，導致不斷回傳 404 |
後端補上 /ad/latest/stream 路由，例如回傳最新圖片或 Server-Sent Events (SSE)。或修改前端，直接請求 /latest_upload → /ad/。 |
|
Vertex AI helpers 命名衝突 (_text_model() 與快取變數名稱相同)，導致函式永遠回傳 function object 而非 model |
將快取變數名稱改成不同名稱，例如使用 _text_model_instance。 |
|
Gemini API 呼叫錯誤：generate_content() got an unexpected keyword argument 'request_options' |
新版 Vertex AI SDK 已移除該參數，需刪除 request_options 參數，改用最簡單的呼叫方式 (text_model.generate_content(prompt))。 |
|
在 _fallback_copy 中誤用中文變數名，導致 NameError: name '最新_summary' is not defined |
改用正確的英文變數 (如 latest_summary)，或移除該行。 |
|
SSE 參數轉型錯誤：float(request.args.get("interval")) 當查詢字串是空或非數字時，會拋出 ValueError |
加上防呆機制：使用 try/except 處理 ValueError，並在空字串時設定預設值 5.0。 |
|
| Flask 多重啟動導致 Port 佔用，前一個 process 被 Terminated | 先清理舊的 process (pkill -f "flask --app backend.app")，再重新啟動一次。或編寫 script 自動 kill & restart。 |
|
| 【SQL 與資料庫整合】 | ||
| 不確定用 Python 程式包涵 SQL 操作和直接用 SQL 指令的差別 | 兩者搭配使用：SQL 負責定義結構和基本資料，Python 負責管理流程與動態邏輯。 | |
不確定固定初始化資料應該用 .py 腳本還是 .sql 檔案 |
固定初始化資料用 .sql (方便一次匯入)；動態產生或測試用假資料用 .py。 |
|
不知道如何將 .sql 檔案放進 VM 內 |
使用 scp 傳輸檔案、將 .sql 放在 GitHub 專案後在 VM 上 git pull、或直接在 VM 上用編輯器 (nano) 貼上內容後再匯入。 |
|
想知道 .sql 匯入 VM 後能否有圖形化管理介面 (預設 VM 為命令列環境) |
若需要 GUI：可在 VM 內安裝 phpMyAdmin / pgAdmin (Web GUI)；或用本機工具 (MySQL Workbench、DBeaver) 連線 VM 資料庫。SQLite 可直接下載 .db 檔用 DB Browser 開啟。 |
|
| 如何讓組員共享相同的 SQL 初始化資料 | 最常見做法是把 .sql 檔 (schema + seed) 放進 GitHub 專案，組員 clone 後匯入。SQLite 可直接共享 .db 檔。 |
|
| 執行 SQL 建表語法後，表格存在但裡面資料找不到 | 目前 SQL 檔只有建表語法，沒有 INSERT 語句。需要加上 INSERT INTO ... VALUES (...) 才會新增資料。 |
|
/dashboard 視圖函式只回傳模板，頁面上顯示靜態文字，沒有從資料庫抓取 |
在 Flask 路由裡呼叫查資料函式 (如 get_member_profile())，將結果傳給模板。在 dashboard.html 中用 Jinja2 變數與迴圈動態顯示。 |
|
| 【UI 介面與資料顯示】 | ||
| 左右版面不對齊，左邊卡片固定寬度 300px，導致右邊表格與左邊空隙過大 | 使用 flex/grid 佈局，左邊設定 25%~30% 寬度，右邊設定 70%~75%。將「照片 + 會員資訊」放入同一個 .card 讓高度一致。 |
|
| 上傳的照片大小不一，造成左側卡片被撐長，影響版面 | 固定容器大小 (例如 300px × 300px)，並使用 object-fit: cover; 保持比例縮放並裁切多餘部分。 |
|
prediction.py 產生的預測結果 (PredictionResult.items) 尚未整合到前端表格 |
在 Flask 路由中直接呼叫 predict_next_purchases()，將結果傳給模板。使用現有的表格樣式渲染預測所需的欄位 (如商品名稱、查閱率、預估購買機率等)。 |
|
| 消費紀錄或預測結果超過 7 筆時，整個頁面變長，需要捲動 | 表格限制每頁最多顯示 7 筆，並提供「上一頁 / 下一頁」分頁按鈕。 | |
| 【會員資料與後端整合】 | ||
| 前端組員的網頁是純靜態 HTML，寫死的內容與後端 (Jinja2) 的變數名稱對不上。 | 將原始寫死的 HTML (如「王小美」) 改為 Jinja2 模板變數 (如 {{ profile.name }})。 |
|
後端的 MemberProfile 中缺少「姓名 (name)」欄位。 |
在 MemberProfile 中新增 name 欄位，並更新資料庫 schema/SQL dump。 |
|
Dashboard 即使後端有姓名欄位，預設仍顯示 persona 標籤，造成顯示邏輯錯誤。 |
調整 UI 顯示邏輯：讓會員真實姓名優先顯示，persona 標籤改為輔助徽章。 |
iThome鐵人賽
看影片追技術